Code not running synchronously in IE with Jquery

Question

I'm having major difficulties getting IE to run jscript code synchronously. Other browsers have no problems. Here's an example of the code:

function renew_order() {
    $.ajaxSetup({async:false});
    // These 3 lines are to disable 2 buttons and show a progress indicator.  This never happens,  
    // which is the main problem.
    $('#cancel_order_button').attr("disabled", "disabled");
    $('#renew_order_button').attr("disabled", "disabled");
    $('#renew_order_load').show();

    // Make some Ajax call to do some processing
    $.getJSON(url, function(json) {
    $.each (json, function (type, name) {
        new_order_id = json.OrderId;
        });
    });

    // Close the modal box this is diaplyed on and display some results on the web page
$.modal.close();
display_new_order(order_list);
}

Basically, the code runs, the modal box is closed, and the results are displayed. But the buttons on the modal box never show as disabled while the process is running. This only seems to be a problem with IE.

This is ironic... I ran into a very similar issue yesterday that only affects IE. When I click one checkbox, I want to disable a different checkbox and change the color of the text in its corresponding label. For some reason the code that changes the color of the label would not work in IE (no issues with other browsers). Eventually we used `setTimeout()` to delay the execution of the one line that wasn't executing properly and it worked. I'd **LOVE** to find out why we had to do this for IE! — jahroy, Mar 20 '13 at 18:45
@jahroy - that is undoubtedly because you were trying to use data related to an AJAX response before the data returned from the server. Your setTimeout will not work one day when your server is running slow. — Adam Jenkins, Mar 20 '13 at 18:54
@Adam - There is no ajax involved in my application whatsoever. I wish it was that obvious. I'm talking about clicking a checkbox and having it affect the color of another checkbox's label. When I get some time, I will create a fiddle and create a question... Unfortunately we fixed it with a kludgy workaround and I have to work on something else right now. I got excited when it _looked_ like this question _might_ be related. Just to demonstrate how silly our workaround is, all it takes is a `1 milisecond` delay to get the code to work (and it's only necessary with IE)!! — jahroy, Mar 20 '13 at 19:31

score 2 · Answer 1 · answered Mar 20 '13 at 18:50

2

Try using the prop function instead.

$(".example").prop("disabled", true);

And if that doesn't work do

document.getElementById("example").disabled = true

answered Mar 20 '13 at 18:50

fredrik

6,483
3
35
45

And for an explanation as to why, this is the best I've seen: http://stackoverflow.com/questions/5874652/prop-vs-attr – Pete Mar 20 '13 at 18:53

score 0 · Answer 2 · answered Mar 20 '13 at 18:59

0

I don't think this has anything to do with synchronicity, since the buttons should be disabled before the ajax call is even made. Check for javascript errors in the console window -- my guess is you're running into something there.

answered Mar 20 '13 at 18:59

Phillip Schmidt

8,805
3
43
67

Code not running synchronously in IE with Jquery

2 Answers2