Question

I spent a while trying to understand why my jQuery.ajax call was not invoking the callback function, even though I could see on the network that the POST request succeeded.

My code looked something like this:

var invokeService = function (url, action, parameters, callback, async, errorFn) {
    var jqXhr = $.ajax({
        async:async,
        type:'POST',
        cache:false,
        url:url + '?action=' + action,
        contentType:'application/json; charset=utf-8',
        data:$.toJSON(parameters),
        done:callback,
        fail:errorFn
    });
};

and I was calling it like:

invokeService(serviceUrl, 'ActionFn', {param:'one'}, successFn, null, failFn);

I couldn’t figure out why my callback was getting invoked on other browsers, but not IE9.

I posted the answer that I found so I could find it again if it happened in the future, since I couldn’t find the answer here…

Answer 1

What I discovered was that the async parameter of $.ajax doesn’t like a null value being passed in when you’re in IE9.

I changed my code to explicitly use true or false for the async parameter and it began working:

var invokeService = function (url, action, parameters, callback, errorFn) {
    var jqXhr = $.ajax({
        async:true, //<--- In my case I could just hard code it, probably even remove this param.
        type:'POST',
        cache:false,
        url:url + '?action=' + action,
        contentType:'application/json; charset=utf-8',
        data:$.toJSON(parameters),
        done:callback,
        fail:errorFn
    });
};