So, I have a list of imdb ids stored in the database. What I want to do is, iterate over these and query a web service provider, for example TMDB and get the movie thumbnail associated with that imdb id.
I have fetched the data from the database, and stored it in response.
<script>
var results_area = $(".results-area");
function render(response) {
var img_thumbnail = $(".img-thumbnail");
var quote= $(".quote");
results_area.empty();
for (var i = 0; i < response.d.length; i++) {
img_thumbnail.attr('src', getImageThumbnail(response.d[i].imdbId));
quote.text("Reviews:" + response.d[i].quote);
results_area.append(img_thumbail.clone(),quote.clone());
}
}
function getImageThumbnail(imdbId) {
$.ajax({
async: false,
url: "https://api.themoviedb.org/3/movie/" + imdbId + "?",
data: param,
dataType: 'jsonp',
success: function () {
}
});
}
</script>
Since my dataType is 'jsonp', async:false won't work. What is happening is since in my html img src="#", it stays the same after the for loop finishes.
Is there a better way to do this?