$ .ajax jsonp回调函数的工作

Question

I`m using http://www.myapifilms.com/imdb/inTheaters to fetch the data. This is the query Generated from the code below.

function sendRequest() {
    var parms = "format=JSONP";

    // Other parameters
    //parms += "&lang=en-us&actors=S";

    $("#countries").text("");
    $("#actors").text("");

    $.ajax({
        data:       parms,
        url:        'http://www.myapifilms.com/imdb/inTheatres',
        type:       'get',
        dataType:   'jsonp',
        beforeSend: function () {alert(this.url);},


        success:  function (response, textStatus, jqXHR) {
            $.each(response, function(index, element){

                if (element.directors != undefined) {
                    $.each(element.directors, function(index, director){
                        $("#directors").append(director.name + ", ");
                    });
                }
                if (element.title != undefined) {
                    $.each(element.title, function(index, title){
                        $("#movies").append(title + ", ");
                    });
                }
            });
        },
        error: function(jqXHR, textStatus, errorThrown) {
            $("#error").text(textStatus + "; " + errorThrown);
        }
    });
}

The issue here is I`m getting " parsererror; Error: jQuery1113009284638670545353_1442120413250 was not called ."

I was just playing with passing values in parameters and could see that this works fine http://www.myapifilms.com/imdb?callback=jQuery21308063971860152206_1442321554390&format=JSONP&_=1442321554392&title=matrix . However this http://www.myapifilms.com/imdb/inTheaters?callback=jQuery21308063971860152206_1442321554390&format=JSONP&_=1442321554392&title=matrix doesn`t.

As you see from the latter query, it looks like the application is returning default callback "myapifilms". So how do I use that default callback in the ajax request to access the data it has? Please help me in achieving the same. Thanks in advance.

Find my working here | http://codepen.io/anon/pen/YywLop

Answer 1

I guess you can create a local function named myapifilms to handle the response.

Something like this, and it should automatically get called.

 function myapifilms(response) {
     $.each(response, function(index, element){
        if (element.directors != undefined) {
            $.each(element.directors, function(index, director){
                $("#directors").append(director.name + ", ");
            });
        }
        if (element.title != undefined) {
            $.each(element.title, function(index, title){
                $("#movies").append(title + ", ");
            });
        }
    });
}

Answer 2

How said @Jaromanda X, it is a bug. In any case, the URL of your code is wrong, you have inTheat re s and is inTheat er s (mismatch between "re" and "er"). I test this code and works:

function submit() {
    var url = "http://www.myapifilms.com/imdb/inTheaters";

    $.ajax({
       data:      'format=JSONP',
       url:       url,
       dataType:  'jsonp',
       jsonpCallback: "myapifilms",
       success:   function (response, textStatus, jqXHR) {
            $.each(response, function(index, element){

                if (element.directors != undefined) {
                    $.each(element.directors, function(index, director){
                        $("#results").append(director.name + ", ");
                    });
                }
            });
       },
        error: function(jqXHR, textStatus, errorThrown) {
            $("#error").text(textStatus + "; " + errorThrown);
        }
    });
}

function myapifilms(response) {
     $.each(response, function(index, element){
        if (element.directors != undefined) {
            $.each(element.directors, function(index, director){
                $("#results").append(director.name + ", ");
            });
        }
    });
}

PS: I'm the creator of site and I recommend you that migrate to version 2.

Edit:

Example of call in Version 2:

function submit() {
    var url = "http://www.myapifilms.com/imdb/inTheaters";
    var params = {
        token: 'YOUR_TOKEN',
        format: 'json',
        callback: 'myapifilms'
    };

    $.ajax({
        url : url,
        data : params,
        type : 'get',
        dataType : 'jsonp',
        jsonpCallback: 'myapifilms'
    });
}

function myapifilms(json) {
    alert(json.data.inTheaters[0].openingThisWeek);
}

In "json" variable you have all information.