Skip to content

Commit 20f3e9f

Browse files
committed
Core: Escape id/name before using it as a selector in errorsFor
Fixes jquery-validation#1275
1 parent a8765ff commit 20f3e9f

File tree

3 files changed

+19
-1
lines changed

3 files changed

+19
-1
lines changed

src/core.js

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -807,9 +807,10 @@ $.extend( $.validator, {
807807
var name = this.idOrName( element ),
808808
describer = $( element ).attr( "aria-describedby" ),
809809
selector = "label[for='" + name + "'], label[for='" + name + "'] *";
810+
810811
// aria-describedby should directly reference the error element
811812
if ( describer ) {
812-
selector = selector + ", #" + describer.replace( /\s+/g, ", #" );
813+
selector = selector + ", #" + describer.replace( /[\[\]]/g, "\\$&" ).replace( /\s+/g, ", #" );
813814
}
814815
return this
815816
.errors()

test/error-placement.js

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -331,3 +331,16 @@ test( "test pre-assigned non-error aria-describedby", function( assert ) {
331331
strictEqual( "This is where you enter your data", $("#testForm17text-description").text() );
332332
strictEqual( "", $("#testForm17text-error").text(), "Error label is empty for valid field" );
333333
});
334+
335+
test( "test id/name containing brackets", function( assert ) {
336+
var form = $( "#testForm18" ),
337+
field = $( "#testForm18\\[text\\]" );
338+
339+
form.validate({
340+
errorElement: "span"
341+
});
342+
343+
form.valid();
344+
field.valid();
345+
assert.hasError( field, "required" );
346+
});

test/index.html

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -173,6 +173,10 @@ <h2 id="qunit-userAgent"></h2>
173173
<input name="testForm17text" id="testForm17text" data-rule-required="true" data-msg="required" aria-describedby="testForm17text-description">
174174
<span id="testForm17text-description">This is where you enter your data</span>
175175
</form>
176+
<form id="testForm18">
177+
<!-- test id/name containing brackets -->
178+
<input name="testForm18[text]" id="testForm18[text]" required>
179+
</form>
176180
<form id="dataMessages">
177181
<input name="dataMessagesName" id="dataMessagesName" class="required" data-msg-required="You must enter a value here">
178182
</form>

0 commit comments

Comments
 (0)