This post is a step enhance version of my previous post: Preventing Multiple Button Click on Asp.net Page
Problem: How to disable button immediately on user click in asp.net so that user cannot click multiple time.
Solution: To solve this problem use regular html button, including runat=”server” attribute and write the disable client-side click event which disable button immediately and server-side event which runs the actual code for click event.
To perform this task add javascript function.
Client-Side Event to disable button immediately.
<head runat="server">
<script language = "javascript">
var c=0;
function DisableClick()
{
var objName = 'Button1';
document.getElementById(objName).disabled=true;
c=c+1;
msg = 'Please Wait...('+ c +')!';
document.getElementById(objName).value= msg;
var t=setTimeout('DisableClick()',1000);
}
</script>
</head>
Note: Replace “Button1” with object name of button control
And following button code in body.
Button Control – HTML Button instead of Asp button.
<INPUT id="Button1"
onclick="DisableClick();" type="button"
value="Submit Payment" name="Button1"
runat="server" onserverclick="Button1_Click">
Note: onclick event is calling javascript client-side function and onserverclick event is calling server-side function which performs actual task.
Server-Side Event to perform actual task
This task can be any as per your logic, for an example I am performing some heavy time consuming task, you can even make use of Threading concept to minimize code…
protected void Button1_Click(object sender, EventArgs e)
{
ArrayList a = new ArrayList();
for (int i = 0; i < 10000; i++)
{
for (int j = 0; j < 1000; j++)
{
a.Add(i.ToString() + j.ToString());
}
}
Response.Write("I am done: " +
DateTime.Now.ToLongTimeString());
}
Before Button Click
During Button Click
After Task is done
Related Links:
11 comments:
This looks like an effective solution to the problem of validation returning the user back to a page with a disabled button. Does this work in Firefox? Firefox is like the school teacher standing over your shoulder waiting you to make even the smallest of mistakes.
@Douglas
I haven't tested with Firefox, but it should work without any problem, as it is simple HTML control converted as server control and javascript.
This worked nicely in IE 7, but in FireFox 3.0.1 the disable button did not get enabled. I set the timer to 5 seconds for some back end processing, but the timer just keeps going, showing numbers above 20 seconds. Perhaps Firefox requires a different timeout function.
Thanks douglas for posting update about firefox.
After your feedback I have re-check the Disable Multiple Button Click in Firefox and its works perfectly.
Now I can say its code work perfectly fine for both Firefox and IE.
Post me update with exact problem you are facing. Its works for me. I am using Firefox 2.0.0.16
Thanks for staying with this. I finally figured it out, and I think this might be helpful to other .Net developers. I was using several regular expression validation controls, and the javascript which Microsoft uses for these controls appears to kill Firefox's postback calls following a btnDisable onclick event. I moved the client side validation to the server side, and the code works fine in both IE7 and Firefox 3.0.1 A work around would be to write your own javascript validation code, and not rely on the packaged Asp.net ones.
You are right. Validation Control provided by microsoft are browser dependent in many case, it works fine with IE, but it needs work around with Firefox or other browser. Thanks for sharing your experience.
Worked like a charm! Thanks much - it was exactly what I was looking for.
All i could say is brilliant!
Tried others before stumbled upon this, but its either working only with IE or Firefox Yours works for both like charm!
Thank you so much for sharing. :)
Lame solution...You are advocating for an html button, why not still use an asp:Button and use some code like this.
ButtonToDisable.Attributes.Add("onclick", "this.disabled=true;" + ClientScript.GetPostBackEventReference(ButtonToDisable,"").ToString());
in ASP.NET 2.0 is can be done more easily:
http://lawo.wordpress.com/2010/05/14/disable-button-after-click-with-confirmation-clientside/
Hi ,
This code is working perfectly fine but the problem which i am facing is i have written a code to send an email on server side click event but it is not sending the email when i am using html button control.....
please suggest what may be the problem
Post a Comment