"Please wait" image on every user action with ASP.NET 3.5

Question

In our ASP.NET 3.5 application, we would like to implement a "Please wait.." feature : on every user action (button click, tab change, etc.) we would display a little spinner on top of the page (actually in a separate frame that we use already have).

We thought of this solution :

1. "hijack" the _doPostBack to intercept every event, display the spinner image, then execute the original _doPostBack function
2. register a client script block in the ASP.NET codebehind to hide the image when the processing ends

My question is : do you think it's a good solution ? it's certainly not very elegant but it seems quite efficient. Is there another solution/pattern to do this kind of thing ?

PS : we do not use JQuery and we use UpdatePanels

Answer 1

Since you are already using UpdatePanels, you just need to add an UpdateProgress control to the page and associate it to your UpdatePanel.

This will automatically show up when a partial postback is initiated from inside the UpdatePanel and hide once the request is completed.

Below is an example, just point the img tag to a spinner image. You can position the control where you want it to appear.

<asp:UpdateProgress runat="server" AssociatedUpdatePanelID="updatePanel1">
  <ProgressTemplate>
    <img src="./images/somespinner.gif" />Please wait...
  </ProgressTemplate>
</asp:UpdateProgress>