Checkboxradio: Properly find radio groups from the associated form

Fixes #9973
Closes gh-1631

3 files changed, 39 insertions, 8 deletions

diff --git a/tests/unit/checkboxradio/checkboxradio.html b/tests/unit/checkboxradio/checkboxradio.html
index 92db788c5..9883e0834 100644
--- a/tests/unit/checkboxradio/checkboxradio.html
+++ b/tests/unit/checkboxradio/checkboxradio.html
@@ -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>
diff --git a/tests/unit/checkboxradio/core.js b/tests/unit/checkboxradio/core.js
index 15cfc155b..2a9cf9822 100644
--- a/tests/unit/checkboxradio/core.js
+++ b/tests/unit/checkboxradio/core.js
@@ -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 = [
diff --git a/ui/widgets/checkboxradio.js b/ui/widgets/checkboxradio.js
index b4f4de49d..107749201 100644
--- a/ui/widgets/checkboxradio.js
+++ b/ui/widgets/checkboxradio.js
@@ -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() {