This article will demonstrate a way to prevent multiple button clicks on ASP.NET Web Forms. Preventing multiple clicks can help prevent multiple server-side events from firing and thus reduces the chance of duplicate information being saved to the database.
Concept
- Disable a button control on client side.
- After performing some server-side tasks, enable the button from code-behind.
Please Note
In this example, you will need to be using an HTML button instead of ASP.net button.
Markup
<input type="button" id="SaveButton" value="Save" runat="server" onclick="this.disabled=true;" onserverclick="SaveButton_ServerClick" />
To Enable Client-Side Validation
If you want to enable client side validation along with the button click, the markup should be 'slightly' changed to.
<input type="button" id="SaveButton" value="Save" runat="server" onclick="if(Page_ClientValidate() == true){this.disabled=true;}" onserverclick="SaveButton_ServerClick" />
Code-behind (Visual Basic)
Protected Sub SaveButton_ServerClick(ByVal sender As Object, ByVal e As System.EventArgs)
Me.Validate()
If Page.IsValid Then
'****************************
'Save information to database.
'****************************
End If
If SaveButton.Disabled Then
SaveButton.Disabled = False
End If
End Sub
Code-behind (CSharp)
protected void SaveButton_ServerClick(object sender, System.EventArgs e)
{
this.Validate();
if (Page.IsValid) {
}
//****************************
//Save information to database.
//****************************
if (SaveButton.Disabled) {
SaveButton.Disabled = false;
}
}
