ASP.NET – Disabling the submit button to prevent double submissions

If a user clicks on a form submit button and the page response is slow, the user may often re-click that button. Because the original request has already been submitted, you may find that the user has made a double submission. In e-commerce sites, the double submission of a credit card payment may be very unpopular with your customers.

This is a common problem faced by web developers, and there are a variety of ways to try to prevent it. However, I have not seen a really elegant way to solve the problem, so I set about trying to find a simple and effective solution.

There were some key issues I wanted to address:

  1. I wanted to disable the button when it was clicked, but only if the page was valid
  2. I did not want to manually add code to every button in my application
  3. I did not want to break the existing validation, especially when using validation groups
  4. I wanted to preserve the CausesValidation property

To achieve these goals, I set about creating a custom button that inherited the standard ASP Button. This custom button would replace the existing buttons in my application.

First add a new class to your App_Code directory called “EnhancedButton” and then override the OnPreRender event:

Now, we add the following to our web.config to take advantage of the tagMapping feature:

The result is that all instances of standard Buttons are replaced with our new Enhanced custom button. You have no need to add extra code in every Page_Load. The Tag Mapping takes care of replacing the standard button across the web application.

And Voilà, our job is done!