I have just spent the best part of half a day getting this working and wanted to make sure no one else EVER suffers the way that I have.

Scenario. I have an ASP.NET 2.0 application with a long running Bulk Email/E-Ticket process that needs to show the user something/anything while it’s working so they aren’t tempted to wander off and therefore frag the run. I am also using Master pages

I’ve tried:

1. Progress bar controls – but they all needed to run the process asynchronously and/or did not allow other UI controls/display to be updated while in-flight. My task was not a separate thread.

2. SPIN.JS – but that got into difficulties as it was client side only and the long-running task is server side.

3. ASP.NET ClientScript.RegisterClientScriptBlock – that snagged itself as it could not run early enough to affect the by then already rendered .ASPX page

4. AJAX Extensions: Still required UpdatePanel and Script Manager controls, unavailable in ASP.NET 2.0 and there’s no way I was upgrading a large app to .NET 4.0 simply to get this working!

Solution: After MUCH Googl-ing I have come up with the following.

Take 1 Animated GIF and sprinkle onto .ASPX page in a hidden DIV with ID=’PleaseWait’, note the id of the IMG for for use later

[code language=”html”]<div id="PleaseWait" style="display:none;"><img src=” id=’myAnimatedImage’></div>[/code]

Make your button/link to run the Server Side task code is hidden and add a standard HTML <input> control which calls a small Javascript function, say ShowMe() – mine looked like this …

[code language=”html”]

<asp:LinkButton CssClass=myhide ID="lnkSend" runat="server" OnClick=RunLetterMerge>[ Start Building Letters ]</asp:LinkButton><br />
<input id="btnDOIT" type="button" value="Start Building Letters" OnClick="return ShowMe(‘ctl00_ContentPlaceHolder1_lnkSend’);" size="22"/>

[/code]

Ensure the FULL Master Page ID (not the ClientID as that also would not work in my level of .NET) is passed to the JavaScipt function as a parameter e.g. ShowMe(‘ctl00_ContentPlaceHolder1_lnkSend’)

ShowMe Javascript function should look EXACTLY like this – this was the answer to the problem.

[code language=”javascript”]

function ShowMe(lnkDOIT)
{
var pwdiv = document.getElementById(‘PleaseWait’);
if ( pwdiv != null )
{
pwdiv.style.display="";
document.getElementById(‘myAnimatedImage’).src = "../images/PleaseWait.gif";
setTimeout(‘document.images["myAnimatedImage"].src = "../images/PleaseWait.gif"’, 200);
}
else
{
alert("Nope");
}
var doit = document.getElementById(lnkDOIT);
doit.click();
}

[/code]

This key 3 statements in this function are nos. 6-8, no other code will both show the animated GIF and allow it to animate properly. The final part of the function simply passes control back to hidden ASP LinkButton and runs the Server Side Task: RunLetterMerge

Hope that makes sense and saves you hours of needless hair-pulling 🙂