Disable enable an input with jQuery

Question

input disabled   true    or    input disabled    disabled     Which is the standard way  And  conversely  how do you enable a disabled input

User · Answer

In jQuery Mobile   For disable      someselectElement   selectmenu   selectmenu  disable   selectmenu  refresh   true       someTextElement   textinput   textinput  disable      For enable      someselectElement   selectmenu   selectmenu  enable   selectmenu  refresh   true       someTextElement   textinput  enable

User · Answer

Approach 4  this is extension of wild coder answer    x000D   x000D  txtName disabled 1        0 for enable x000D   lt input id  txtName  gt  x000D   x000D   x000D

User · Answer

Disable      input   attr  readonly   true      Disable it     input   addClass  text-muted       Gray it out with bootstrap    Enable      input   attr  readonly   false      Enable it     input   removeClass  text-muted       Back to normal color with bootstrap

User · Answer

You can use the jQuery prop   method to disable or enable form element or control dynamically using jQuery  The prop   method require jQuery 1 6 and above   Example    lt script type  text javascript  gt            document  ready function                   form input type  submit     prop  disabled   true                   agree   click function                    if   this  prop  checked      true                          form input type  submit     prop  disabled   false                                     else if   this  prop  checked      false                          form input type  submit     prop  disabled   true                                                      lt  script gt

User · Answer

input   0  disabled   true    or     input   0  disabled   false

User · Answer

Update for 2018   Now there s no need for jQuery and it s been a while since document querySelector  or document querySelectorAll  for multiple elements  do almost exactly same job as    plus more explicit ones getElementById  getElementsByClassName  getElementsByTagName  Disabling one field of  input-checkbox  class  document querySelector   input-checkbox   disabled   true    or multiple elements  document querySelectorAll   input-checkbox   forEach el   gt  el disabled   true

User · Answer

2018  without JQuery  ES6   Disable all input       document querySelectorAll  input    map e   gt  e disabled   true     Disable input with id  my-input   document getElementById  my-input   disabled   true    The question is with JQuery  it s just FYI

User · Answer

You can put this somewhere global in your code     prototype enable   function            each this  function  index  el              el  removeAttr  disabled                 prototype disable   function            each this  function  index  el              el  attr  disabled    disabled                And then you can write stuff like       myInputs   enable        otherInput   disable

User · Answer

lt html gt   lt body gt   Name   lt input type  text  id  myText  gt      lt button onclick  disable    gt Disable Text field lt  button gt   lt button onclick  enable    gt Enable Text field lt  button gt    lt script gt  function disable         document getElementById  myText   disabled   true    function enable         document getElementById  myText   disabled   false     lt  script gt    lt  body gt   lt  html gt

User · Answer

I used  gnarf answer and added it as function       fn disabled   function  isDisabled         if  isDisabled           this attr  disabled    disabled           else          this removeAttr  disabled                   Then use like this      myElement   disable true

User · Answer

Use like this             id    prop   disabled   true           id    prop   disabled   false

User · Answer

this works for me       values input   attr  disabled  true       values input   attr  disabled  false

User · Answer

There are many ways using them you can enable disable any element    Approach 1      txtName   attr  disabled   true     Approach 2      txtName   attr  disabled    disabled      If you are using jQuery 1 7 or higher version then use prop    instead of attr         txtName   prop  disabled    disabled      If you wish to enable any element then you just have to do opposite of what you did to make it disable  However jQuery provides another way to remove any attribute    Approach 1      txtName   attr  disabled   false     Approach 2      txtName   attr  disabled          Approach 3      txtName   removeAttr  disabled      Again  if you are using jQuery 1 7 or higher version then use prop    instead of attr    That s is  This is how you enable or disable any element using jQuery

User · Answer

Disable true for input type       In case of a specific input type  Ex  Text type input       input type text    attr  disabled   true        For all type of input type      input   attr  disabled   true

User · Answer

jQuery 1 6   To change the disabled property you should use the  prop   function      input   prop  disabled   true      input   prop  disabled   false     jQuery 1 5 and below  The  prop   function doesn t exist  but  attr   does similar   Set the disabled attribute      input   attr  disabled   disabled      To enable again  the proper method is to use  removeAttr       input   removeAttr  disabled      In any version of jQuery  You can always rely on the actual DOM object and is probably a little faster than the other two options if you are only dealing with one element      assuming an event handler thus  this  this disabled   true    The advantage to using the  prop   or  attr   methods is that you can set the property for a bunch of selected items     Note  In 1 6 there is a  removeProp   method that sounds a lot like removeAttr    but it SHOULD NOT BE USED on native properties like  disabled   Excerpt from the documentation      Note  Do not use this method to remove native properties such as checked  disabled  or selected  This will remove the property completely and  once removed  cannot be added again to element  Use  prop   to set these properties to false instead    In fact  I doubt there are many legitimate uses for this method  boolean props are done in such a way that you should set them to false instead of  removing  them like their  attribute  counterparts in 1 5

User · Answer

Disable  x          x    prop   disabled   true           Enable  x          x    prop   disabled   false      Sometimes you need to disable enable the form element like input or textarea  Jquery helps you to easily make this with setting disabled attribute to  disabled   For e g        To disable        someElement   attr  disabled    disabled      To enable disabled element you need to remove  disabled  attribute from this element or empty it s string  For e g     To enable      someElement   removeAttr  disabled        OR you can set attr to         someElement   attr  disabled          refer  http   garmoncheg blogspot fr 2011 07 how-to-disableenable-element-with html

User · Answer

Just for the sake of new conventions  amp  amp  making it adaptable going forward  unless things change drastically with ECMA6           document  on  event name     your id   function           this  removeAttr  disabled          and    document  off  event name     your id   function           this  attr  disabled   disabled

User · Answer

If you just want to invert the current state  like a toggle button behaviour       input   prop  disabled        input   prop  disabled

[javascript] Disable/enable an input with jQuery?

For disable

For enable

Examples related to javascript

Examples related to jquery

Examples related to html-input

Examples related to disabled-input