removeAttr() not removing "disabled" attribute in IE

Question

var disableSelection = function(){     $("#elementId").attr("disabled","disabled");     };  var enableSelection = function(){     $("#elementId").removeAttr("disabled"); }; 

I have following requirements:

1. disable SELECT element in order to restrict users from selecting options
2. disabled SELECT element has some OPTION element already selected
3. on submit event enable disabled SELECT element in order to save selected value

Adding attribute "disabled" works well for IE. Yet, when I try to remove attribute by using jQuery revomeAttr() method then instead of removing attribute:

1. method adds "disabled" attribute to previously enabled SELECT element
2. method doesn't remove "disabled" attribute

Answer 1

Use .prop instead of .attr to affect an element's disabled state:

var disableSelection = function(){     $("#elementId").prop("disabled", true);     };  var enableSelection = function(){     $("#elementId").prop("disabled", false); }; 

For more information, see .prop() vs .attr().

Answer 2

You can use removeProp('disabled') instead. It worked for me while removeAttr('disabled') didn't.