CODEWITHSUNDEEP
javascriptjqueryapi
csandreas1
csandreas1

Reputation: 2378

How to get the elements of the moviedb.org API and use them with Jquery

I use themoviedb.org API to take content of the movies like description, title, images,etc. Using a searchbox i type the name of the movie and i get the following values like the image below: enter image description here

I want to take some of these elements (of each object) and use them in my website. For example, how can i take the image and description elements of the array? An example of an image url is this: https://image.tmdb.org/t/p/w500/kqjL17yufvn9OVLyXYpvtyrFfak.jpg

api documentation: https://www.themoviedb.org/documentation/api
My code looks like this:

   function search()
{
    var movieTitle = $('#search_field').val();
    var str1 = "https://api.themoviedb.org/3/search/movie?include_adult=false&page=1&query=";
    var str2 = "&language=en-US&api_key=XXXX";
    var searchResult = str1+movieTitle+str2;

    var settings = 
    {
        "async": true,
        "crossDomain": true,
        "url": searchResult,
        "method": "GET",
        "headers": {},
        "data": "{}"
    }

    $.ajax(settings).done(function (response) {
    console.log(response);
    console.log("Here is the generated url:"+searchResult);

});
}

Upvotes: 0

Views: 642

Answers (1)

Huy Hoang Pham
Huy Hoang Pham

Reputation: 4147

Just use a simple loop and get the overview and poster image of each movie, then do whatever you want with them.

$.ajax(settings).done(function (response) {
  var results = response.results;
  for(var i=0; i < results.length; i++) {
     var movie = results[i];
     var description = movie.overview;
     var image = 'https://image.tmdb.org/t/p/w500' + movie.poster_path;
     // Display the description and image
  }
});

Upvotes: 1

Related Questions