Permalink
Browse files

TextInput: Add ui-state-disabled class when disabled

By checking if the input has disabled attribute we add
ui-state-disabled class to give it a look of disabled
text input

Fixes gh-8251
Closes gh-8343
  • Loading branch information...
apsdehal authored and arschmitz committed Dec 11, 2015
1 parent 92ef0c1 commit 3ba1af26af5c9660b937f3d07abc02d737fe84c7
Showing with 16 additions and 1 deletion.
  1. +6 −1 js/widgets/forms/textinput.js
  2. +1 −0 tests/unit/textinput/index.html
  3. +9 −0 tests/unit/textinput/textinput_core.js
@@ -87,10 +87,15 @@ $.widget( "mobile.textinput", {
"blur": "_handleBlur"
} );
if ( options.disabled !== undefined ) {
this.element.prop( "disabled", !!options.disabled );
this._toggleClass( this._outer, null, "ui-state-disabled", !!options.disabled );
}
},
refresh: function() {
this.setOptions( {
this._setOptions( {
"disabled": this.element.is( ":disabled" )
} );
},
@@ -81,6 +81,7 @@
<input type="text" id="destroy-test" data-nstest-role="none">
</div>
<input type="text" id="disable-test">
<input type="text" id="disable-test-default" disabled="true">
</div>
</body>
</html>
@@ -221,4 +221,13 @@ QUnit.test( "textinput is disabled/enabled correctly", function( assert ) {
"After disabling, the 'disabled' prop is true" );
} );
QUnit.test( "textinput is disabled correctly by default", function( assert ) {
var textinput = $( "#disable-test-default" );
assert.hasClasses( textinput.parent()[ 0 ], "ui-state-disabled",
"After disabling, the ui-state-disabled class is present" );
assert.deepEqual( textinput.prop( "disabled" ), true,
"After disabling, the 'disabled' prop is true" );
} );
} )( QUnit, jQuery );

0 comments on commit 3ba1af2

Please sign in to comment.