WHY DO IT ???
Before you read the post, let us answer why did I waste time in changing the behavior of the UpdateProgress control. Here is the deal. Suppose, you have 5 or 6 controls on your page, which when clicked result in an Ajax call. You know that the UpdateProgress control is pretty much static, meaning, wherever you put the <asp:UpdateProgress> tags, that is the place where the progressbar will show up when your Ajax call is in progress. So, no matter which control the user clicks the progressbar is being shown in a fixed place. Why may some people consider this bad ???
- You or anyone looking at the screen, may lose track of why you are waiting because the progressbar just shows that you are waiting not what has triggered the wait.
- If the page is long, and the progress bar is at a fixed place, there is a possibility that you clicked a control which is a scroll length away from where the progressbar will show.
- If the control which was clicked can give a feedback for the user to wait, it prevents the user from clicking the same button twice.
So, much for justifying why I wrote this control. But those were just a few thoughts behind it. Let us get back to the nitty gritties. Btw, here is a YouTube vide of how it looks (video is a little fuzzy but it shows what I am trying to communicate)
The Code :
I will not go into too much detail explaining the code, because I am sharing the source code with you. But here is the high level overview :
- Create a new control, which inherits from UpdateProgress control
- The first Image control in the <ProgressTemplate> of the UpdateProgress control will be assumed to be the hourglass image, and if you haven’t set an ImageURL value for it, a default image will be supplied. You can create your own hourglass images from this awesome website : http://www.ajaxload.info/#preview
That is it. Do leave comments and suggestions if you find this control useful. I am also attaching the source code and the assembly. If you don’t want to see the code, just use the assembly and things should work right away.