Disabling an ASP.NET ASP:Button Control with JavaScript

When using JavaScript on a ASP.NET Webforms page one can register the JavaScript function to execute using the OnClientClick attribute of the asp:button control. This can be quite usefu,l for example, when adding a script to stop duplicate submissions.

However, it is important to correctly disable the button control since using the wrong command will cause the Webform to break.

As I mentioned in a previous blog, browsers do not send form data from controls that have been marked ‘Disabled’. This can cause real problems with an ASP.NET Webform since the browser will not send information about the button control to the server if it has been disabled. So the button control’s Click event will not be called, which will end up causing the form not to work.

Rather than using the disabled attribute to mark the asp:button control as disabled I set the button’s CSS display attribute to ‘none’. In IE 9 this results in a nicely greyed out button that behaves as it should when the form is submitted.

Here is the JavaScript code I use to mark the button non-clickable:

btnInitiateProcess.style.display = 'none';