CODEWITHSUNDEEP
javascriptjquery
Laguna
Laguna

Reputation: 3876

Show progress for long checkbox click event

I have a checkbox upon checking which it will trigger a long call to the server. I want to show a spinning while .gif image while users wait for the call, but the image is not showing. Below is my code snippet:

$('#chk').click(function () {
        $('span.progress-indicator').show(); //the gif image

        $.ajaxSetup({ asynch: false});

        LongServerCallMethod(); 

        $('span.progress-indicator').hide(); //the gif image
    });

Upvotes: 0

Views: 92

Answers (1)

Kevin B
Kevin B

Reputation: 95018

Place the long method call in a setTimeout allowing the browser time to render the gif first. However, you will notice that since the browser is locked up by your asynchronous call, the spinner will not spin. The only way to fix that is to not use async: false.

setTimeout(function(){
    LongServerCallMethod();

    $('span.progress-indicator').hide(); //the gif image
},0);

If you have the time, you really should rewrite the code to not use async: false since time is the only thing that could possibly prevent you from being able to convert async: false code to async: true

Upvotes: 2

Related Questions