jQuery attr disabled disabled not working in Chrome

Question

Not sure why this isn t working   When people click the  edit  button of my application  the disabled textfields become editable       bewerken   click function e              input disabled  disabled     removeAttr  disabled          I then want to disable the textfields again when the user saves  I have this code bound to my save button       save school changes   click function e          stuff        ajax           type   POST           url    school save changes           data      stuff            success  function data                            feedback top   html   lt p gt     data  message       lt  p gt    slideDown  slow   delay 2000  slideUp                   input type  text     attr  disabled    disabled                            e preventDefault          As far as I know  this should disable the textfields again  However  this does not seem to be working in Chrome  It does work in Firefox  I haven t had the chance to test in IE or Safari yet  Is there any way to make this work in Chrome aswell  Thanks a lot

User · Accepted Answer

If you are using jQuery  lt  1 6 do this   jQuery  input type  text     attr  disabled    disabled      If you are using jQuery 1 6    jQuery  input type  text     prop  disabled   true     See this question   prop   vs  attr    for references why   Or you can try this      input text   attr  disabled    disabled      see here for info on  text

User · Answer

Try    input type  text     attr  disabled   true

User · Answer

Here  http   jsbin com urize4 edit  Live Preview http   jsbin com urize4   You should use  readonly  instead like      input type  text     attr  readonly    true

User · Answer

For me  none of these answers worked  but I finally found one that did   I needed this for IE-     input text   attr  disabled    disabled      I also had to add this for Chrome and Firefox -     input text   AddClass  notactive      and this -   lt style type  text css  gt       notactive           pointer-events  none          cursor  default          lt  style gt

User · Answer

Have you tried with prop       Well prop   seems works for me

User · Answer

It s an old post but I none of this solution worked for me so I m posting my solution if anyone find this helpful   I just had the same problem   In my case the control I needed to disable was a user control with child dropdowns which I could disable in IE but not in chrome   my solution was to disable each child object  not just the usercontrol  with that code       controlName   find      each function        this  attr  disabled   true        It s working for me in chrome now

User · Answer

My issue with this was that the element using the disabled attr needed to be defined as a form element   ie input type for it to work  Both worked with attr   and prop   but chose the latter for future maintainability

User · Answer

if you are removing all disabled attributes from input  then why not just do      input   removeAttr  disabled      Then after ajax success      input type  text     attr  disabled   true     Make sure you use remove the disabled attribute before submit  or it won t submit that data   If you need to submit it before changing  you need to use readonly instead

User · Answer

Mostly disabled attribute doesn t work with the anchor tags from HTML-5 onwards  Hence we have change it to  let s say  button  and style it accordingly with appropriate color border-style etc  That s the most apt solution for any similar issue users are facing in Chrome   Only few elements support  disabled  attribute  Span   select  option  textarea  input   button

[jquery] jQuery .attr("disabled", "disabled") not working in Chrome

Examples related to jquery

Examples related to google-chrome

Examples related to cross-browser

Examples related to attr

Examples related to jquery-attributes