Question

I have an ASP.NET 2.0 Web application.I want to show a progress indcator when user saves some data (Ex : Editing profile).I have already used jQuery in my application for some client side effects. How can i do this ? any jquery trusted stuff to use along with ASP.NET ? Thanks in advance

Answer 1

Do you want to show actual progress or just a busy indicator while the action is happening? If the former, you’ll need to have some mechanism to record the save progress in the session and a method to check the state of the progress via AJAX. You’d submit the form via AJAX then periodically call the check method to get reports of the progress and update whatever client-side indicator (usually switch from one to another of a series of canned images or increase the width of some filled “bar”). This, of course, is complicated.

If you want to do the latter, just display an animated GIF that’s a busy indicator while you submit the form via AJAX from jQuery using the beforeSend callback, then hide the indicator using the ajax method’s complete handler.

$('form').ajax( {
    url: '/updateprofile.aspx',
    type: 'POST',
    data: function() { return $('form').serialize(); },
    beforeSend: function() { $('#indicator').show(); },
    complete: function() { $('#indicator').hide(); },
    success: function(data,status) { alert('Update complete'); }
});

The above code would be in the function invoked from whatever handler invokes the submission or hooked to the form’s submit event — though you’d have to prevent the default action from taking place, too.