From 20f3e9fac929fe103b87d046040b8ff75ee90466 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jo=CC=88rn=20Zaefferer?= <joern.zaefferer@gmail.com>
Date: Tue, 23 Sep 2014 13:27:51 +0200
Subject: [PATCH] Core: Escape id/name before using it as a selector in
 errorsFor

Fixes #1275
---
 src/core.js             |  3 ++-
 test/error-placement.js | 13 +++++++++++++
 test/index.html         |  4 ++++
 3 files changed, 19 insertions(+), 1 deletion(-)

diff --git a/src/core.js b/src/core.js
index e54cb698a..5226ec46c 100644
--- a/src/core.js
+++ b/src/core.js
@@ -807,9 +807,10 @@ $.extend( $.validator, {
 			var name = this.idOrName( element ),
 				describer = $( element ).attr( "aria-describedby" ),
 				selector = "label[for='" + name + "'], label[for='" + name + "'] *";
+
 			// aria-describedby should directly reference the error element
 			if ( describer ) {
-				selector = selector + ", #" + describer.replace( /\s+/g, ", #" );
+				selector = selector + ", #" + describer.replace( /[\[\]]/g, "\\$&" ).replace( /\s+/g, ", #" );
 			}
 			return this
 				.errors()
diff --git a/test/error-placement.js b/test/error-placement.js
index 26316a058..ab7050ad2 100644
--- a/test/error-placement.js
+++ b/test/error-placement.js
@@ -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( "", $("#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" );
+});
diff --git a/test/index.html b/test/index.html
index d8008e740..029e55ad5 100644
--- a/test/index.html
+++ b/test/index.html
@@ -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">
 		<span id="testForm17text-description">This is where you enter your data</span>
 	</form>
+	<form id="testForm18">
+		<!-- test id/name containing brackets -->
+		<input name="testForm18[text]" id="testForm18[text]" required>
+	</form>
 	<form id="dataMessages">
 		<input name="dataMessagesName" id="dataMessagesName" class="required" data-msg-required="You must enter a value here">
 	</form>