Checkboxradio: Properly find radio groups from the associated form

Fixes #9973
Closes gh-1631
This commit is contained in:
Scott González 2015-10-27 14:35:27 -04:00
parent 5157c2520b
commit e77fbe5388
3 changed files with 39 additions and 8 deletions

View File

@ -64,6 +64,13 @@
<label>
<input type="checkbox" id="label-with-no-for"/>
</label>
<form id="form3"></form>
<input type="radio" name="crazy-form" id="crazy-form-1" form="form3" checked="checked">
<label for="crazy-form-1">Choice 1</label>
<input type="radio" name="crazy-form" id="crazy-form-2" form="form3">
<label for="crazy-form-2">Choice 2</label>
</div>
</body>
</html>

View File

@ -49,6 +49,25 @@ asyncTest( "Ensure checked after single click on checkbox label button", functio
} );
} );
test( "Handle form association via form attribute", function( assert ) {
expect( 4 );
var radio1 = $( "#crazy-form-1" ).checkboxradio();
var radio1Label = radio1.checkboxradio( "widget" );
var radio2 = $( "#crazy-form-2" ).checkboxradio();
var radio2Label = radio2.checkboxradio( "widget" );
radio2.change( function() {
ok( this.checked, "#2 checked" );
ok( !radio1[ 0 ].checked, "#1 not checked" );
assert.hasClasses( radio2Label, "ui-state-active" );
assert.lacksClasses( radio1Label, "ui-state-active" );
} );
radio2Label.simulate( "click" );
} );
test( "Checkbox creation requires a label, and finds it in all cases", function( assert ) {
expect( 7 );
var groups = [

View File

@ -93,9 +93,6 @@ $.widget( "ui.checkboxradio", [ $.ui.formResetMixin, {
this._bindFormResetHandler();
// this.form is set by the form-reset-mixin
this.formParent = this.form.length ? this.form : $( "body" );
if ( this.options.disabled == null ) {
this.options.disabled = this.element[ 0 ].disabled;
}
@ -151,17 +148,25 @@ $.widget( "ui.checkboxradio", [ $.ui.formResetMixin, {
},
_getRadioGroup: function() {
var group;
var name = this.element[ 0 ].name;
var formParent = this.formParent[ 0 ];
var nameSelector = "input[name='" + $.ui.escapeSelector( name ) + "']";
if ( !name ) {
return $( [] );
}
return this.formParent.find( "[name='" + $.ui.escapeSelector( name ) + "']" ).filter( function() {
var form = $( this ).form();
return ( form.length ? form : $( "body" ) )[ 0 ] === formParent;
} ).not( this.element );
if ( this.form.length ) {
group = $( this.form[ 0 ].elements ).filter( nameSelector );
} else {
// Not inside a form, check all inputs that also are not inside a form
group = $( nameSelector ).filter( function() {
return $( this ).form().length === 0;
} );
}
return group.not( this.element );
},
_toggleClasses: function() {