Displaying a spinner for a webservice call (Like UpdateProgress Control)

Question

Right now I have a page where unfortunately there is a mix of update panels and calls to webservice web/script methods from javascript.

I have an update progress control which shows a spinner for update panel activity. But when I do webservice calls it isn't displayed.

How would you recommend I solve this usability issue since the user experience needs to be consistent. Should I hook into each webservice call to hide and show the updatecontrol's div?

Thanks

Answer 1

Well, for initial page rendering and for synchronous postbacks, the UpdateProgress control is not displayed. So, make sure that your UpdatePanel is updating asynchronously.

Also, at the bottom of the linked page, it shows what you must have in order to control when the spinner will show up.

Having said that, this is the Microsoft's golden path to the resolution of your problem. It could be possible that there's a bug somewhere in the ASP.NET Ajax library that's preventing the spinner from showing.

If you do exhaust all the options, try doing it yourself. If you override the beginRequest and endRequest JavaScript methods, you can control when the spinner shows up. I'd probably save any previous code in those functions to variables like this:

function addLoadEvent(func)
{
    var oldonload = window.onload;
    if(typeof window.onload != 'function')
    {
        window.onload = func;
    }
    else
    {
        window.onload = function()
        {
            oldonload();
            func();
        }
    }
}

Now, granted, this code is for adding a new function to window.onload, but the same technique can work for beginRequest and endRequest.

Hope this helps