jQuery.ajax success callback function not executed

Question

I have a JavaScript Ajax call (jQuery.ajax), that does not execute the success callback function.

$.ajax({
        url: target,
        contentType: 'application/json; charset=utf-8',
        type: 'POST',
        // type: 'GET',
        dataType: 'jsonp',
        error: function (xhr, status) {
            alert(status);
        },
        success: function (result) {
            alert("Callback done!");
            // grid.dataBind(result.results);
            // grid.dataBind(result);
        }
    });

I see in firebug, that the request is posted and the correct result in terms of the json is returned as expected. What is wrong?

Solution 1

For many times I have encountered similar problems and most of the time the reason was a malformed json. Try getting the result as text data type to see whether this is your problem.

Also, I'd like to ask if you're using a parameter like "&jsoncallback=?" in your url, since your data type is jsonp instead of simple json.

Solution 2

Your $.ajax call with dataType: 'jsonp' could work in these scenarios:

1. You are calling a url on the same domain of your page.
2. You are calling a url out of your domain of your page that supports callback

If you are out of these two cases, you can't do anything since you can’t make cross site XmlHttpRequest calls.

Solution 3

This is an old question, but I suspect people still hit this.

I fought this for some time, and eventually gave up and moved to the deferred model. (I've been using jQuery long enough that I was in the "old" way habits still...) As soon as I moved to a deferred model, things started to work. I have no idea why the old way didn't work, but no longer care. (This question pre-dates the new model.)

cf. https://stackoverflow.com/a/14754681/199172

Solution 4

You need to have set async property to false.

$.ajax({
        url: target,
        contentType: 'application/json; charset=utf-8',
        type: 'POST',
        // type: 'GET',
        dataType: 'jsonp',
        async = false,
        error: function (xhr, status) {
            alert(status);
        },
        success: function (result) {
            alert("Callback done!");
            // grid.dataBind(result.results);
            // grid.dataBind(result);
        }
    });

View more solutions