Disabling the button after once click

Question

I need to disable a button once it s clicked so the user can t click it more than once   My application is written in MVC ASP NET  I ve done this in a normal ASP NET application    I tried using JavaScript and jQuery and it s not working  The button is getting disabled but the form is not being submitted   jQuery       ClickMe   attr  disabled    disabled       JavaScript   function DisableNextButton btnId        document getElementById btnId  disabled    true       Both methods work great  but now the form won t submit

User · Accepted Answer

jQuery now has the  one   function that limits any given event  such as  submit   to one occurrence   Example       myForm   one  submit   function           this  find  input type  submit     attr  disabled   disabled          This code will let you submit the form once  then disable the button  Change the selector in the find   function to whatever button you d like to disable   Note  Per Francisco Goldenstein  I ve changed the selector to the form and the event type to submit  This allows you to submit the form from anywhere  places other than the button  while still disabling the button on submit   Note 2  Per gorelog  using attr  disabled   disabled   will prevent your form from sending the value of the submit button  If you want to pass the button value  use attr  onclick   this style opacity    0 6   return false    instead

User · Answer

jQuery  one   should not be used with the click event but with the submit event as described below       input type submit    one  submit   function            this  attr  disabled   disabled

User · Answer

selectorbyclassorbyIDorbyName   click function           selectorbyclassorbyIDorbyName   attr  disabled   true  delay 2000  attr  disabled   false         select the button and by its id or text or class     it just disables after 1st click and enables after 20 Milli sec  Works very well for post backs n place it in Master page  applies to all buttons without calling implicitly like onclientClick

User · Answer

think simple   lt button id  button1  onclick  Click     gt ok lt  button gt   lt script gt      var buttonClick   false      function Click             if  buttonClick                return                    else               buttonClick   true                todo             alert  ok                  buttonClick   false                   lt  script gt    if you want run once

User · Answer

If when you set disabled  disabled  immediately after the user clicks the button  and the form doesn t submit because of that  you could try two things     First choice  given myForm   your form   myInputButton disabled    disabled   myForm submit      Second choice  setTimeout disableFunction  1       so the form will submit and then almost instantly  the button will be disabled     Although I honestly bet there will be a better way to do this  than that

User · Answer

To submit form in MVC NET Core you can submit using INPUT    lt input type  submit  value  Add This Form  gt    To make it a button I am using Bootstrap for example    lt input type  submit  value  Add This Form  class  btn btn-primary  gt    To prevent sending duplicate forms in MVC NET Core  you can add onclick event  and use this disabled   true  to disable the button    lt input type  submit  value  Add This Form  class  btn btn-primary  onclick  this disabled   true   gt    If you want check first if form is valid and then disable the button  add this form submit    first  so if form is valid  then this button will be disabled  otherwise button will still be enabled to allow you to correct your form when validated    lt input type  submit  value  Add This Form  class  btn btn-primary  onclick  this form submit    this disabled   true   gt    You can add text to the disabled button saying you are now in the process of sending form  when all validation is correct using this value  text      lt input type  submit  value  Add This Form  class  btn btn-primary  onclick  this form submit    this disabled   true  this value    Submitting the form    gt

User · Answer

Use modern Js events  with  quot once quot   const button   document getElementById btnId   button addEventListener  quot click quot   function            Submit form     once   true        Disabling works too  but this is a more standard approach for general one-time events  Documentation  CanIUse

User · Answer

To disable a submit button  you just need to add a disabled attribute to the submit button       btnSubmit   attr  disabled   true     To enable a disabled button  set the disabled attribute to false  or remove the disabled attribute       btnSubmit   attr  disabled   false     or      btnSubmit   removeAttr  disabled

User · Answer

protected void Page Load object sender  EventArgs e                   prevent user from making operation twice         btnSave Attributes Add  onclick                                    this disabled true     GetPostBackEventReference btnSave  ToString                           etc

[javascript] Disabling the button after once click

Examples related to javascript

Examples related to jquery

Examples related to asp.net-mvc