My Problem is ,I have a simple web form, which contains two textboxes and a button.there are some asp.net validator controls on page.so i want client side disabling of butto
If you disable a submit button once it is clicked, then it won't postback. I've been researching this for many many hours now, and the best solution I've seen is here. (The best solution is at the bottom of the page)
I'm now writing a custom server control to add to the toolbox that extends from Button, and uses a slightly modified version of this code. (overriding the OnLoad method)
I'm allowing the user the ability to change the 'processing...' text for something else and may make an attribute that allows the text to change to something else when submission is complete(which would be produced when the postback returns)
I have come up with the solution. Just hide the button after you click it. The postback will take place as usual. After completion of the postback, you will get your button as it is! See the detailed steps on how to disable asp.net button on postback and master the art!
This is the correct and simple way to do this:
Create a helper method in your application (say in a Utlity Namespace):
Public Shared Sub PreventMultipleClicks(ByRef button As System.Web.UI.WebControls.Button)
button.Attributes.Add("onclick", "this.disabled=true;" & button.Page.ClientScript.GetPostBackEventReference(button, String.Empty).ToString)
End Sub
Now from the code behind of each of your web pages you can simply call:
Utility.PreventMultipleClicks(button1)
where button1 is the the button you want to prevent multiple clicks.
What this does is simply sets the on click handler to: this.disabled=true
and then appends the buttons own post back handler, so we get:
onclick="this.disabled=true";__doPostBack('ID$ID','');"
This does not break the default behaviour of the page and works in all browsers as expected.
Enjoy!
Assuming this is asynchronous, and that you validate prior to saving, you can try as pseudo-follows:
bool hasSavedAlready = false;
savedata(){
if (!hasSavedAlready){
//normal saving code
...
//after success
hasSavedAlready = true;
}
}
That's the simplest solution I can think of.
If you disable the button then form submission will not happen. Correct way would be to set timer to disable the button. I would also suggest to use submit behavior instead of putting post-back event ref. For example,
function clickHandler(id, validate, validationGroup) {
var isValid = true;
if (validate && typeof(Page_ClientValidate) == 'function') {
isValid = validationGroup? Page_ClientValidate(validationGroup): Page_ClientValidate();
}
if (isValid)
{
// set timer to disable the button
var b = document.getElementById(id);
var f = function() { b.disabled = 'disabled'; };
setTimeout(f, 100);
return true;
}
return false;
}
And now attach function to your button
protected override void OnPreRender(EventArgs e)
{
this.Attributes.Add("onclick",
string.Format("return clickHandler('{0}', {1}, '{2}')",
this.ClientID, this.CausesValidation ? "true" : "false",
this.ValidationGroup));
}
I had this problem and none of the previous solutions worked for me but after some messing around I used:
<asp:LinkButton runat="server" OnClientClick="this.setAttribute('disabled','disabled'); this.text = 'Submit in progress...';" UseSubmitBehavior="false" ID="btnSubmit" ValidationGroup="formSubmit"</asp:LinkButton>