Use this.name properly so widget in form behaves. (#329)

dojo · Feb 20, 2022 · 21c5ffa · 21c5ffa
1 parent 4097783
commit 21c5ffa
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 5 deletions.
diff --git a/form/Rating.js b/form/Rating.js
@@ -36,12 +36,12 @@ define([
 			//		Build the templateString. The number of stars is given by this.numStars,
 			//		which is normally an attribute to the widget node.
 
-			var radioName = 'rating-' + Math.random().toString(36).substring(2);
+			this.name = this.name || 'rating-' + Math.random().toString(36).substring(2);
 
 			// The radio input used to display and select stars
 			var starTpl = '<label class="dojoxRatingStar dijitInline ${hidden}">' +
 				'<span class="dojoxRatingLabel">${value} stars</span>' +
-			 	'<input type="radio" name="' + radioName + '" value="${value}" dojoAttachPoint="focusNode" class="dojoxRatingInput">' +
+			 	'<input type="radio" name="' + this.name + '" value="${value}" dojoAttachPoint="focusNode" class="dojoxRatingInput">' +
 				'</label>';
 
 			// The hidden value node is attached as "focusNode" because tabIndex, id, etc. are getting mapped there.

diff --git a/form/tests/test_Rating.html b/form/tests/test_Rating.html
@@ -90,16 +90,24 @@ <h3>Inside a dojo form</h3>
 		dojo.require("dijit.form.FilteringSelect");
 		dojo.require("dijit.form.Button");
 	</script>
-	<form dojoType="dijit.form.Form">
+	<form jsId="rating2form" dojoType="dijit.form.Form">
 		<select dojoType="dijit.form.FilteringSelect">
 			<option>Does</option>
 			<option>this</option>
 			<option>work?</option>
 		</select>
 		<br /><br />
-		<div dojoType="dojox.form.Rating" numStars="5" value="1"></div>
+		<div jsId="rating2" dojoType="dojox.form.Rating" numStars="5" value="1" name="rating_widget_2"></div>
 		<br /><br />
-		<button dojoType="dijit.form.Button">Click me</button>
+		<button dojoType="dijit.form.Button">
+			<script type="dojo/event" data-dojo-event="onClick">
+				dojo.query('#rating2Value')[0].innerHTML = rating2.value;
+				dojo.query('#rating2FormValue')[0].innerHTML = JSON.stringify(rating2form.get('value'));
+			</script>
+			Click me</button>
+		<br /><br />
+		The value is: <b><span id="rating2Value">0</span></b>
+		The form value is: <b><span id="rating2FormValue">-empty-</span></b>
 	</form>
 </body>
 </html>