Permalink
Browse files

Checkboxradio: refresh() has to check whether to disable or not

(cherry picked from commit b33ec10)

Closes gh-7600
Fixes gh-7598
1 parent ede2f5f commit 2f45cb956c86d1edbf65f82d91515fcf649534df @gabrielschulhof gabrielschulhof committed Jul 30, 2014
@@ -296,14 +296,13 @@ $.widget( "mobile.checkboxradio", $.extend( {
},
refresh: function() {
- var hasIcon = this._hasIcon(),
- isChecked = this.element[ 0 ].checked,
+ var isChecked = this.element[ 0 ].checked,
active = $.mobile.activeBtnClass,
iconposClass = "ui-btn-icon-" + this.options.iconpos,
addClasses = [],
removeClasses = [];
- if ( hasIcon ) {
+ if ( this._hasIcon() ) {
removeClasses.push( active );
addClasses.push( iconposClass );
} else {
@@ -319,6 +318,8 @@ $.widget( "mobile.checkboxradio", $.extend( {
removeClasses.push( this.checkedClass );
}
+ this.widget().toggleClass( "ui-state-disabled", this.element.prop( "disabled" ) );
+
this.label
.addClass( addClasses.join( " " ) )
.removeClass( removeClasses.join( " " ) );
@@ -26,26 +26,43 @@
ok( elem.siblings( "label[for='chk\\[\\'3\\'\\]-1']" ).length === 1, "element has exactly one sibling of the form label[for='chk[\'3\']-1']" );
});
- test( "widget can be disabled and enabled", function(){
- var input = $( "#checkbox-1" ),
- button = input.parent().find( ".ui-btn" );
-
- input.checkboxradio( "disable" );
- input.checkboxradio( "enable" );
- ok( !input.prop("disabled"), "start input as enabled" );
- ok( !input.parent().hasClass( "ui-state-disabled" ), "no disabled styles" );
- ok( !input.prop("checked"), "not checked before click" );
+ function testEnableDisable( theInput, theMethod ) {
+ var button = theInput.parent().find( ".ui-btn" );
+
+ theMethod( theInput, true );
+ theMethod( theInput, false );
+ ok( !theInput.prop("disabled"), "start input as enabled" );
+ ok( !theInput.parent().hasClass( "ui-state-disabled" ), "no disabled styles" );
+ ok( !theInput.prop("checked"), "not checked before click" );
button.trigger( "click" );
- ok( input.prop("checked"), "checked after click" );
+ ok( theInput.prop("checked"), "checked after click" );
ok( button.hasClass( "ui-checkbox-on" ), "active styles after click" );
button.trigger( "click" );
- input.checkboxradio( "disable" );
- ok( input.prop( "disabled" ), "input disabled" );
- ok( input.parent().hasClass( "ui-state-disabled" ), "disabled styles" );
- ok( !input.prop( "checked" ), "not checked before click" );
+ theMethod( theInput, true );
+ ok( theInput.prop( "disabled" ), "input disabled" );
+ ok( theInput.parent().hasClass( "ui-state-disabled" ), "disabled styles" );
+ ok( !theInput.prop( "checked" ), "not checked before click" );
button.trigger( "click" );
- ok( !input.prop( "checked" ), "not checked after click" );
+ ok( !theInput.prop( "checked" ), "not checked after click" );
ok( !button.hasClass( "ui-checkbox-on" ), "no active styles after click" );
+ }
+
+ test( "widget can be disabled and enabled via enable()/disable() method", function(){
+ testEnableDisable( $( "#checkbox-disabled-test-1" ), function( theInput, isDisabled ) {
+ theInput.checkboxradio( isDisabled ? "disable" : "enable" );
+ });
+ });
+
+ test( "widget can be disabled and enabled via option 'disabled'", function(){
+ testEnableDisable( $( "#checkbox-disabled-test-2" ), function( theInput, isDisabled ) {
+ theInput.checkboxradio( "option", "disabled", isDisabled );
+ });
+ });
+
+ test( "widget can be disabled and enabled via prop + refresh()", function(){
+ testEnableDisable( $( "#checkbox-disabled-test-3" ), function( theInput, isDisabled ) {
+ theInput.prop( "disabled", isDisabled ).checkboxradio( "refresh" );
+ });
});
test( "clicking a checkbox within a controlgroup does not affect checkboxes with the same name in the same controlgroup", function(){
@@ -67,8 +67,24 @@
<div data-nstest-role="fieldcontain">
<fieldset data-nstest-role="controlgroup">
<legend>Agree to the terms:</legend>
- <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom"/>
- <label for="checkbox-1">I agree</label>
+ <input type="checkbox" name="checkbox-disabled-test-1" id="checkbox-disabled-test-1" class="custom"/>
+ <label for="checkbox-disabled-test-1">I agree</label>
+ </fieldset>
+ </div>
+
+ <div data-nstest-role="fieldcontain">
+ <fieldset data-nstest-role="controlgroup">
+ <legend>Agree to the terms:</legend>
+ <input type="checkbox" name="checkbox-disabled-test-2" id="checkbox-disabled-test-2" class="custom"/>
+ <label for="checkbox-disabled-test-2">I agree</label>
+ </fieldset>
+ </div>
+
+ <div data-nstest-role="fieldcontain">
+ <fieldset data-nstest-role="controlgroup">
+ <legend>Agree to the terms:</legend>
+ <input type="checkbox" name="checkbox-disabled-test-3" id="checkbox-disabled-test-3" class="custom"/>
+ <label for="checkbox-disabled-test-3">I agree</label>
</fieldset>
</div>

0 comments on commit 2f45cb9

Please sign in to comment.