Skip to content

Commit

Permalink
Core: Escape id/name before using it as a selector in errorsFor
Browse files Browse the repository at this point in the history
Fixes #1275
  • Loading branch information
jzaefferer committed Sep 23, 2014
1 parent a8765ff commit 20f3e9f
Show file tree
Hide file tree
Showing 3 changed files with 19 additions and 1 deletion.
3 changes: 2 additions & 1 deletion src/core.js
Expand Up @@ -807,9 +807,10 @@ $.extend( $.validator, {
var name = this.idOrName( element ), var name = this.idOrName( element ),
describer = $( element ).attr( "aria-describedby" ), describer = $( element ).attr( "aria-describedby" ),
selector = "label[for='" + name + "'], label[for='" + name + "'] *"; selector = "label[for='" + name + "'], label[for='" + name + "'] *";

// aria-describedby should directly reference the error element // aria-describedby should directly reference the error element
if ( describer ) { if ( describer ) {
selector = selector + ", #" + describer.replace( /\s+/g, ", #" ); selector = selector + ", #" + describer.replace( /[\[\]]/g, "\\$&" ).replace( /\s+/g, ", #" );
} }
return this return this
.errors() .errors()
Expand Down
13 changes: 13 additions & 0 deletions test/error-placement.js
Expand Up @@ -331,3 +331,16 @@ test( "test pre-assigned non-error aria-describedby", function( assert ) {
strictEqual( "This is where you enter your data", $("#testForm17text-description").text() ); strictEqual( "This is where you enter your data", $("#testForm17text-description").text() );
strictEqual( "", $("#testForm17text-error").text(), "Error label is empty for valid field" ); strictEqual( "", $("#testForm17text-error").text(), "Error label is empty for valid field" );
}); });

test( "test id/name containing brackets", function( assert ) {
var form = $( "#testForm18" ),
field = $( "#testForm18\\[text\\]" );

form.validate({
errorElement: "span"
});

form.valid();
field.valid();
assert.hasError( field, "required" );
});
4 changes: 4 additions & 0 deletions test/index.html
Expand Up @@ -173,6 +173,10 @@ <h2 id="qunit-userAgent"></h2>
<input name="testForm17text" id="testForm17text" data-rule-required="true" data-msg="required" aria-describedby="testForm17text-description"> <input name="testForm17text" id="testForm17text" data-rule-required="true" data-msg="required" aria-describedby="testForm17text-description">
<span id="testForm17text-description">This is where you enter your data</span> <span id="testForm17text-description">This is where you enter your data</span>
</form> </form>
<form id="testForm18">
<!-- test id/name containing brackets -->
<input name="testForm18[text]" id="testForm18[text]" required>
</form>
<form id="dataMessages"> <form id="dataMessages">
<input name="dataMessagesName" id="dataMessagesName" class="required" data-msg-required="You must enter a value here"> <input name="dataMessagesName" id="dataMessagesName" class="required" data-msg-required="You must enter a value here">
</form> </form>
Expand Down

0 comments on commit 20f3e9f

Please sign in to comment.