Calling the following in IE with Caret browsing enabled will make the textbox look disabled, but the textbox can still be changed.
widget.set("disabled", true);
This is actually an issue with any input html tag in IE when Caret browsing is enabled (Hit F7 to enable or View->Caret browsing). The following html displays the issue:
<!DOCTYPE html>
<html>
<body>
<h1>disabled</h1>
<input type="text" value="hello world" disabled />
<h1>disabled/readonly</h1>
<input type="text" value="hello world" disabled readonly />
</body>
</html>
Put cursor in first textbox and the value is changed when typing without any events firing (keydown/keyup/…).
Potential workaround is to also mark disabled textboxes as readonly. Notice the second does not have the same issue.
Below is a patch to fix trident browsers that will:
- mark an input as readonly if setting disabled
- mark an input as not readonly if this code marked it while setting disabled
Index: _FormWidgetMixin.js
===================================================================
--- _FormWidgetMixin.js (revision 6004)
+++ _FormWidgetMixin.js (revision 6007)
@@ -75,6 +75,23 @@
// Can't use "disabled" in this.focusNode as a test because on IE, that's true for all nodes.
if(/^(button|input|select|textarea|optgroup|option|fieldset)$/i.test(this.focusNode.tagName)){
domAttr.set(this.focusNode, 'disabled', value);
+ // IE has a Caret Browsing mode (hit F7 to activate) where disabled textboxes can be modified
+ // textboxes marked readonly avoid this issue.
+ // If setting widget disabled and widget is not already readonly, also set readonly.
+ // If setting widget enabled, and this code set readonly, set to non-readonly
+ if (has("trident")) {
+ if (value) {
+ if (domAttr.get(this.focusNode, 'readonly') === false) {
+ domAttr.set(this.focusNode, 'readonly', true);
+ this._disabledSetReadonly = true;
+ }
+ } else {
+ if (this._disabledSetReadonly) {
+ domAttr.set(this.focusNode, 'readonly', false);
+ this._disabledSetReadonly = false;
+ }
+ }
+ }
}else{
this.focusNode.setAttribute("aria-disabled", value ? "true" : "false");
}