Netflix has a nice submit button so that when you click it, it changes to “Please Wait…” and disables itself to prevent you from clicking it again.
I have problems all the time with my users doing this, and I never spent time trying to solve it.
The way around this is to have a script run “OnBeforeUnload” so that it is still disables it late enough to not prevent postback. The only problem with this is that it would disable the button on each Unload request. We must solve this also.
I realize you can throw all this in a custom button, but since I just got this to work, here is my quick solution:
Put the following in your page's base class (assuming you have one). If not, throw it in your codebehind.
public void SetOnClickDisable(System.Web.UI.WebControls.Button control)
control.Attributes.Add("onclick","formSubmitted = true;");
The first line tells the function that gets called that the button was pressed triggering postback. This will prevent every Unload from running this function. The rest assembles the function to disable the Button you pass into it.
Next, call it from your page.
Thats all you need to get it working. Now some cool css to make it look like a Netflix button. In your css file (or in the page if you want) put:
font: 11px arial,helvetica, sans-serif;
background-image : url(/img/button.gif);
background-color : White;
And then in your aspx page put:
You also need the background for the image which you can get here and save it in the path you specify in your css .netflix-button class above.
***Understand that this is a Netflix image, so ONLY use this as an example. In fact, I have no right to even link to it, but I figure that it is easier to show it this way, and Netflix won't care as long as we don't rip it off.
Note that this works with the validation controls also. The buttons will not be disabled if the postback is stopped in the validation stage.
The main problem right now is that this will only work for one button on a page. It isn't the worst deal in the world because it isn't that often that I have multiple buttons on a page that spawn long running operations. In any case, if anyone wants to solve that, go for it!
If I left anything out, let me know as this works successfully over here. And if it works, let me know too!