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

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

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>