jQuery ajax does not work in production on IE

Question

I am trying to make a service call using jQuery's ajax function. I have tested it on my local environment in both IE and Chrome and it works fine. However after deploying our site to production, I can only get the service call to work in Chrome. Stepping through the code in the inspector I can see that it makes it into the ajax function in IE but the the request is never issued. I have used fiddler and can see the call when using Chrome but not IE.

var customers;

function AutoComplete(TheId) {

    if (!customers) {
        $.ajax({
            type: "GET",
            url: "api/customerapi",
            dataType: "json",
            async: false,
            success: function (data) {
                customers = data;
            }
        });
     }

.... further code ....
}

Any ideas what could be going wrong here?

See http://stackoverflow.com/questions/3141396/ie7-hangs-when-using-to-much-ajax-calls-with-async-false — Maetschl, Feb 26 '13 at 15:13
Thanks for everyone who jumped on the async issue. That was the problem, I will just have to rework my logic to better use the success callback to ensure the correct order of operations I was going after. @Maetschl your link really led me to the answer. — ferics2, Feb 26 '13 at 15:27
Do you use a [document ready](http://docs.jquery.com/Tutorials:Introducing_$%28document%29.ready%28%29) function? $(document).ready(function() { // do something -> AutoComplete call }); Please notice that you block your application with `async : false`. — Eich, Feb 26 '13 at 15:09
I am aware of blocking my application with `async : false`. In this case I need that data before the user can continue. And yes, I have checked for document loading issues. — ferics2, Feb 26 '13 at 15:19
@ferics2, why not use `async:true` and use a loading animation? — Dom, Feb 26 '13 at 15:21
Dom was faster, but he's right. Use a loading animation instead of `async:false`. — Eich, Feb 26 '13 at 15:22

score 1 · Accepted Answer · answered Feb 26 '13 at 15:20

There not a hole lot to go on from your code. You should provide more details and the link to the fiddle you made.

A few general things to consider:

Are you making https:// requests with http:// or vice-versa? This gave me trouble when working with IE after deploying to production (which was https). It would complain that security was being breached and wouldn't even make the request.

Also don't use async: false unless you have a really good reason to. It freezes the user's browser until the request is finished. On IE it's particularly bad because it freezes the entire browser, not only the page. There's hardly a reason you should use synchronous requests, since jQuery makes it so easy to just use the async. You can do the exact same thing that the sync does, without freezing the browser. Collect all the data needed then proceed from there. If your question is how to use the async request, I advise re-writing the question.

These are some very general suggestions, if you make your question more specific, you'll probably get an equally specific answer.

jQuery ajax does not work in production on IE

1 Answers1