Disabling and enabling a html input button

Question

So I have a button like this    lt input id  Button  type  button  value     style  background-color grey  onclick  Me      gt    How can I disable and enable it when I want  I have tried disabled  disable  but enabling it back is a problem  I tried setting it back to false but that didn t enable it

User · Answer

lt  --Button Disable Script-- gt       lt script type  text javascript  gt          function DisableButton                 document getElementById   lt   btnSave ClientID   gt    disabled   true                    window onbeforeunload   DisableButton       lt  script gt       lt  --Button Disable Script-- gt

User · Answer

You can do this fairly easily with just straight JavaScript  no libraries required   Enable a button  document getElementById  Button   disabled false    Disable a button   document getElementById  Button   disabled true    No external libraries necessary

User · Answer

Disabling enabling an html input button with JavaScript   And React with refs  Replace  quot elementRef current quot  with element selection if not using React   elementRef current setAttribute  disabled    disabled     Enable   elementRef current removeAttribute  disabled

User · Answer

btncancel   button   disabled  true       Here  btncancel  is the class name of the button

User · Answer

This will surely work    To Disable a button      btn id   button  disable      To Enable a button      btn id   button  enable

User · Answer

Using Javascript   Disabling a html button  document getElementById  Button   disabled   true   Enabling a html button  document getElementById  Button   disabled   false   Demo Here     Using jQuery  All versions of jQuery prior to 1 6   Disabling a html button      Button   attr  disabled   disabled     Enabling a html button      Button   removeAttr  disabled     Demo Here   All versions of jQuery after 1 6   Disabling a html button      Button   prop  disabled   true    Enabling a html button      Button   prop  disabled   false    Demo Here   P S  Updated the code based on jquery 1 6 1 changes  As a suggestion  always use the latest jquery files and the prop   method

User · Answer

Without jQuery disable input will be simpler  Button disabled 1     x000D   x000D  function dis     x000D    Button disabled   Button disabled  x000D    x000D   lt input id  Button  type  button  value     style  background-color grey  onclick  Me      gt  x000D   x000D   lt button onclick  dis    gt Toggle disable lt  button gt  x000D   x000D   x000D

User · Answer

Since you are disabling it in the first place  the way to enable it is to set its disabled property as false   To change its disabled property in Javascript  you use this   var btn   document getElementById  Button    btn disabled   false    And obviously to disable it again  you d use true instead   Since you also tagged the question with jQuery  you could use the  prop method  Something like   var btn       Button    btn prop  disabled   true        Or  false    This is in the newer versions of jQuery  The older way to do this is to add or remove an attribute like so   var btn       Button    btn attr  disabled    disabled       or btn removeAttr  disabled      The mere presence of the disabled property disables the element  so you cannot set its value as  false   Even the following should disable the element   lt input type  button  value  Submit  disabled      gt    You need to either remove the attribute completely or set its property

User · Answer

the disable attribute only has one parameter  if you want to reenable it you have to remove the whole thing  not just change the value

User · Answer

While not directly related to the question  if you hop onto this question looking to disable something other than the typical input elements button  input  textarea  the syntax won t work  To disable a div or a span  use setAttribute document querySelector   somedivorspan   setAttribute  disabled   true    P S  Gotcha  only call this if you intend to disable  A bug in chrome Version 83 causes this to always disable even when the second parameter is false

User · Answer

Stick to php     Why not only allow the button to appear once an above criteria is met    lt   if  whatever    something         display     lt input id  Button  type  button  value     style  background-color grey  onclick  Me      gt        return  display      gt

[javascript] Disabling and enabling a html input button

Examples related to javascript

Examples related to jquery