Question

I’m using JQUERY Block UI to show progress image for one of the long running process in our system. I’m using below code to display progress image. In between blockui and unblockui codes there is a long running method call. When I execute this code block UI works but image doesn’t rotate as we can see in other web sites. This code shows s still image and it doesn’t rotate anytime and unblock UI works at the end. Why this progress image doesn’t animate?

$.blockUI({ message: img src="../progress.gif" /><h4>Just a moment</h4> });

AddFunctionalityToLevel(id); //Just a method call.  

$.unblockUI({ fadeOut: 200 }); 

Answer 1

Problem I noticed here is single thread blocking the rotation of Image. So I found a way of calling asynchronous method and let the image to rotate in a separate thread. Below is the way of archived that.

$.blockUI({ message: ‘Just a moment…’ });

setTimeout(‘AddFunctionalityToLevel(‘ + id + ‘)’, 1000);

function AddFunctionalityToLevel(id)
{

//logic of the function

$.unblockUI({ fadeOut: 200 });

}