Disable a button on click

Question

I have a button control. Once the user clicks on it, the click event should fire and then the button should get disabled. How can I do this? I have the option to use JQuery

Answer 1

you can disable it server side

Button1.Enabled = false;

Answer 2

add an OnClientClick="this.disabled = true;" to your button.

If you are using Asp.net Ajax you might want to look at using PostBack Ritalin.

Answer 3

   <script type="text/javascript">
     Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
      function BeginRequestHandler(sender, args) {
        document.getElementById('<%= lblMessage.ClientID %>').innerText = "Processing...";
          document.getElementById('<%= btnSubmit.ClientID %>').innerText = "Processing";
         args.get_postBackElement().disabled = true;
           }
           </script>

Add Script Tag in source page . change Id of button in code . You can disable the button till the process completes execution .

Answer 4

There is really cool event for body tag "<"body onBeforeunload="buttonId.disabled = true;" ">"

This event triggers right before form submits, in other words your data will be submitted correctly.

Answer 5

When using the "this.disabled = true" method make sure you check if the page is valid before disabling the control if you have validators on the page. If validation fails you won't be able to re-enable the control without reloading the page.

if (Page_IsValid) this.disabled = true;

Answer 6

// to disable
this.setAttribute('disabled', true); 
// to enable
this.removeAttribute('disabled');

this is a cross browser solution