2013-06-23 1 views
0

JSONP를 사용하여 $ .ajax 호출을 3 개 중첩 시켰습니다. 첫 번째 $ .ajax 호출이 함수에서 작동하지만 세 번째 호출이 호출을 실행하지 못합니다. Uncaught TypeError: Property 'insertFilmData' of object [object Object] is not a functionJSONP 콜백 오류 : [object Object] 객체의 'insertFilmData'속성이 함수가 아닙니다.

CODE :

function searchFilms(film, settings) { 
if (film === '') { 
    console.log("enter a movie"); 
} else { 
    $.ajax({ 
     type: 'GET', 
     url: 'http://api.themoviedb.org/3/configuration?api_key=XXX', 
     async: false, 
     jsonpCallback: 'getSearchResults', 
     contentType: 'application/json', 
     dataType: 'jsonp', 
     success: function(json) { 
      if (json.images) { 
       settings.imageData = json.images; 
       getSearchResults(json, settings); 
      } 
     } 
    }); 

    function getSearchResults(data, settings) { 
     $.ajax({ 
      type: 'GET', 
      url: 'http://api.themoviedb.org/3/search/movie?api_key=XXX&query=' + film, 
      async: false, 
      jsonpCallback: 'deliverResults', 
      contentType: 'application/json', 
      dataType: 'jsonp', 
      success: function(json) { 
       if (json.total_results !== 0) { 
        deliverResults(json, settings); 
       } 
      } 
     }); 

     function deliverResults(data, settings) { 
      var results = data.results; 
      var html = "<ul id='film-search-results' data-role='listview' data-inset='true'>"; 
      for (var i = 0; i < results.length; i++) { 
       var result = results[i]; 
       var filmId = result.id; 
       $.ajax({ 
        type: 'GET', 
        url: 'http://api.themoviedb.org/3/movie/' + filmId + '?api_key=XXX&append_to_response=' + settings.extras, 
        async: false, 
        jsonpCallback: 'insertFilmData', 
        contentType: 'application/json', 
        dataType: 'jsonp', 
        success: function(json) { 
         if (json) { 
          settings.html = html; 
          insertFilmData(json, settings); 
         } 
        } 
       }); 

       function insertFilmData(data, settings) { 
        var poster_base_url = settings.imageData.base_url; 
        var poster_size = settings.imageData.poster_sizes[0]; 
        var poster_filepath = data.poster_path; 
        var poster_url = poster_base_url + poster_size + "/" + poster_filepath; 
        var html = settings.html + "<li><img src='" + poster_url + "' alt='Poster' /><a class='ui-link-inherit'><h3 class='ui-li-heading'>" + data.title + "</h3><p class='ui-li-desc'><strong>" + data.tagline + "</strong></p><p class='ui-li-desc'>" + data.overview + "</p></a></li>"; 

       } 
      } 
      html = html + "</ul>"; 
      console.log(html); 
      $('#content-add-title').html(html); 
      $('#film-search-results').trigger("create"); 
     } 
    } 
} 
} 

내가 크로스 도메인 JSONP를 사용하여 아주 새로운 해요 그래서 호출 내가 잘못 처음 두 호출 뒤 화재로보고 무슨 일이 일어나고 있는지 확실하지 않다 다시 날이 오류를 제공 그렇지 않은 것은 마지막 것뿐입니다. 어떤 도움이나 방향이 크게 감사 할 것입니다. 감사합니다

답변

0

insertFilmData라는 메서드를 찾고 있는데 찾을 수 없습니다. 그것은 지금처럼 또는

  $.ajax({ 
       type: 'GET', 
       url: 'http://api.themoviedb.org/3/movie/' + filmId + '?api_key=XXX&append_to_response=' + settings.extras, 
       async: false, 
       jsonpCallback: 'insertFilmData', 
       contentType: 'application/json', 
       dataType: 'jsonp', 
       success: function(json) { 
        if (json) { 
         settings.html = html; 
         insertFilmData(json, settings); 
        } 
       }, 
       insertFilmData: function(data, settings) { 
        var poster_base_url = settings.imageData.base_url; 
        var poster_size = settings.imageData.poster_sizes[0]; 
        var poster_filepath = data.poster_path; 
        var poster_url = poster_base_url + poster_size + "/" + poster_filepath; 
        var html = settings.html + "<li><img src='" + poster_url + "' alt='Poster' /><a class='ui-link-inherit'><h3 class='ui-li-heading'>" + data.title + "</h3><p class='ui-li-desc'><strong>" + data.tagline + "</strong></p><p class='ui-li-desc'>" + data.overview + "</p></a></li>"; 

       } 

      }); 

, 당신은 단지 그것을 유지할 수 있지만 줄을 변경 : 당신이 AJAX 호출에 매개 변수 개체의 방법, 즉으로 함수를 정의하면 아마도 그것은 작동합니다 jsonpCallback: 'insertFilmData', ~ jsonpCallback: insertFilmData,. 이것은 ajax 호출에 대한 인수 중 하나가 함수의 이름이 아니라 함수 자체가됨을 의미합니다. (그리고 올바르게 이해한다면, 함수 정의가이 줄 아래에 있다는 것은 중요하지 않습니다. 왜냐하면 그것은 명명 된 함수이고 범위에 있기 때문입니다.)

+0

두 제안을 모두 시도해 보았습니다. 두 번째 제안은 jsonp 콜백이라고하지만 콜백 매개 변수는 함수 내부에서 정의되지 않습니다. $ .ajax 호출과 설정 객체에서 json을 콜백에 전달하는 방법을 모르겠습니다. – Joe

+0

별개의 문제라고 생각합니다. 음 ...이 코드에서 내가 잘못 볼 수있는 것은 async : false 부분뿐입니다. 'async'에 대한 jQuery 문서에서 : "도메인 간 요청 및 데이터 유형 :"jsonp "요청은 동기 작업을 지원하지 않습니다." 나는 jQuery가 오류를 던지기를 기대했지만 분명히 그렇지 못했을 것이다. 그것을 바꿔보고 무슨 일이 일어나는 지보십시오. (이것은 자연스러운 추측이지만 어쨌든 그것을 변경해야합니다.) –

관련 문제