Site Navigation

Tuesday, September 25, 2007

bug 237 - type is a readonly attribute in IE

Issue: #237
Affects: IE5, IE5.5, IE6, IE7, IE8, IE9 PP4
MSIE Feedback ID: 332453
Status: Microsoft has confirmed this will NOT be fixed in IE8 RTM
Partially Fixed In: IE9 Platform Preview 6 (only when rendering in IE9 Standards Document Mode)

Update: There are partial fixes for this in IE9 Platform Preview 4. For example you can change an input element from text to hidden and back to text and it works. However changing any input type to a password, then back to any other type deletes the value attribute contents (e.g. erases the set value)

In a world of Web 2.0 shininess, being able to work your JavaScript-Foo on the DOM is critical. A typical, yet simple example of this, would be to change an input type="text" element on a form, to a type="hidden" field, or visa versa.

Example:

<input type="text" id="userid" value=""/>
<script type="text/javascript">
var userIDField = document.getElementById('userid');
var userID = userIDField .value;
//do some fancy ajax stuff...
userIDField.setAttribute('type', 'hidden');
</script>


In a DOM compliant browser, this is a piece of cake. However in IE (msdn article), the type attribute is read-only... except for a small window of time before you add an element to the DOM (e.g. if you are using createElement() )


Known Workarounds: None. If you copy all the information for a given node, into JS variables, then remove the existing element, and create a brand new one in its place, then you are set.

However the sheer complexity of this task makes it rather troublesome even to attempt. Keep in mind, any workaround should handle all attributes set on the element, including custom attributes and attributes in specialized namespaces. Also remember that any event handlers attached to the element need to be copied over to the new element. If you think you have an ideal workaround, drop us a line!


Related Issues: (bug 242).