腐ったトマトのapiでjQueryのオートコンプリート

Question

私は自動補完を使って、rottentomatoesから映画の提案をJSON形式で取得しようとしています。 しかし、以下のコードでは提案は表示されません。完全なページのソースの場合

<script> 
var apikey = "5xq9w7z2mp7a6cnchkfy52yd"; 
var baseUrl = "http://api.rottentomatoes.com/api/public/v1.0"; 

var moviesSearchUrl = baseUrl + '/movies.json?apikey=' + apikey; 
var query = "Rocky"; 

$(document).ready(function() { 
$("#sample").autocomplete({ 
source: function(request, response) { 
     $.ajax({ 
      url: moviesSearchUrl + '&q=' + encodeURI(query), 
      dataType: "jsonp", 
      success: function(data) { 
        var movies = data.movies; 
        response(function(movies) { 
           return { 
             label: movies.title, 
             value: movies.title 
             } 
        }));   
        } 
     }); 
     } 
}); 
}); 
</script> 

：https://gist.github.com/2018447 私はまた、候補リストに動画のサムネイルを含める必要があります。誰も私に助けてくれませんか？

Answer 1

構文エラー（追加の)）があり、moviesの配列（通常は$.map()を使用）での繰り返し呼び出しがありませんでした。

これは、それがどのように見えるかです：ここでの例作業（更新ポスターのサムネイルを含ん）

$("#sample").autocomplete({ 
    source: function(request, response) { 
     $.ajax("http://api.rottentomatoes.com/api/public/v1.0/movies.json", { 
      data: { 
       apikey: apikey, 
       q: request.term 
      }, 
      dataType: "jsonp", 
      success: function(data) { 
       response($.map(data.movies, function(movie) { 
        return { 
         label: movie.title, 
         value: movie.title, 
         thumb: movie.posters.thumbnail 
        } 
       }));   
      } 
     }); 
    } 
}).data("autocomplete")._renderItem = function(ul, item) { 
    var img = $("<img>").attr("src", item.thumb); 
    var link = $("<a>").text(item.label).prepend(img); 
    return $("<li>") 
     .data("item.autocomplete", item) 
     .append(link) 
     .appendTo(ul); 
}; 
​ 

- http://jsfiddle.net/df7tp/6/