javascript - Multiple values for aria-describedby when using jQuery Validation Unobtrusive - Stack Overflow

admin管理员组

文章数量:1026073

I am using the latest version of jQuery Validation Unobtrusive in bination with the latest version of jQuery Validate. The validation itself works like a charm. However if the field is invalid, values will be added to the aria-describedby attribute.

Let's say I want to type in my password (for validation the length of the password must be greater than 6). The initial HTML looks like this:

<input data-val="true" data-val-minlength="The field Passwort must be a string or array type with      a minimum length of '6'." 
   data-val-minlength-min="6" data-val-required="The Passwort field is required." 
   id="Password" name="Password" tabindex="2" 
type="password">

I start to type a password with only 5 characters and then remove focus from the input by clicking somewhere on the body. The validation runs through and a bunch of attributes and values including aria-describedby will be added. Now the aria-describedby attribute only has a single value Password-error. If I then focus the input field again and remove all characters and even keep pressing backspace, a new value on each keyup is added. This results in the following:

<input data-val="true" 
   data-val-minlength="The field Passwort must be a string or array type with a minimum length of '6'." 
   data-val-minlength-min="6" 
   data-val-required="The Passwort field is required." 
   id="Password" name="Password" tabindex="2" type="password" aria-required="true" 
   aria-invalid="true" class="input-validation-error" 
   aria-describedby="Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error 
Password-error">

This is quite an overhead of values for the attribute considiering that the values are equal. Is this behaviour usual or does someone know how to fix this?

I am using the latest version of jQuery Validation Unobtrusive in bination with the latest version of jQuery Validate. The validation itself works like a charm. However if the field is invalid, values will be added to the aria-describedby attribute.

Let's say I want to type in my password (for validation the length of the password must be greater than 6). The initial HTML looks like this:

<input data-val="true" data-val-minlength="The field Passwort must be a string or array type with      a minimum length of '6'." 
   data-val-minlength-min="6" data-val-required="The Passwort field is required." 
   id="Password" name="Password" tabindex="2" 
type="password">

I start to type a password with only 5 characters and then remove focus from the input by clicking somewhere on the body. The validation runs through and a bunch of attributes and values including aria-describedby will be added. Now the aria-describedby attribute only has a single value Password-error. If I then focus the input field again and remove all characters and even keep pressing backspace, a new value on each keyup is added. This results in the following:

<input data-val="true" 
   data-val-minlength="The field Passwort must be a string or array type with a minimum length of '6'." 
   data-val-minlength-min="6" 
   data-val-required="The Passwort field is required." 
   id="Password" name="Password" tabindex="2" type="password" aria-required="true" 
   aria-invalid="true" class="input-validation-error" 
   aria-describedby="Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error 
Password-error">

This is quite an overhead of values for the attribute considiering that the values are equal. Is this behaviour usual or does someone know how to fix this?

• javascript
• jquery
• unobtrusive-validation

Share Improve this question Follow edited Oct 30, 2014 at 17:58 Sparky 98.8k2626 gold badges202202 silver badges290290 bronze badges asked Oct 30, 2014 at 16:38 LordTribualLordTribual 4,24922 gold badges2929 silver badges3838 bronze badges 2

• Have you found any solution? – Alex Commented Oct 10, 2015 at 4:14
• See my answer below. Somehow the problem was gone after I rebuild the solution in VS and deleted the shadow copies which get created in the background. – LordTribual Commented Oct 11, 2015 at 6:53

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

This issue was present in v1.13.0 of jquery.validate.js but has since been fixed (in at least v1.14.0).

I have no explicit explanation for the problem but since Visual Studio creates shadow copies in the background I could solve the issue by clearing the cashe and deleting all shadow files for the project and a rebuild afterwards.

I ran into a similar problem with version 1.19.5, where aria-describedby attributes were added in many inputs for no reason. The reason, in my case, was having a validation element with no corresponding input element of the same name. It looked like JQuery.validation just got confused. The OP has already accepted an answer, yet I thought of sharing a potential fix for scenarios similar to my case.

I am using the latest version of jQuery Validation Unobtrusive in bination with the latest version of jQuery Validate. The validation itself works like a charm. However if the field is invalid, values will be added to the aria-describedby attribute.

Let's say I want to type in my password (for validation the length of the password must be greater than 6). The initial HTML looks like this:

<input data-val="true" data-val-minlength="The field Passwort must be a string or array type with      a minimum length of '6'." 
   data-val-minlength-min="6" data-val-required="The Passwort field is required." 
   id="Password" name="Password" tabindex="2" 
type="password">

I start to type a password with only 5 characters and then remove focus from the input by clicking somewhere on the body. The validation runs through and a bunch of attributes and values including aria-describedby will be added. Now the aria-describedby attribute only has a single value Password-error. If I then focus the input field again and remove all characters and even keep pressing backspace, a new value on each keyup is added. This results in the following:

<input data-val="true" 
   data-val-minlength="The field Passwort must be a string or array type with a minimum length of '6'." 
   data-val-minlength-min="6" 
   data-val-required="The Passwort field is required." 
   id="Password" name="Password" tabindex="2" type="password" aria-required="true" 
   aria-invalid="true" class="input-validation-error" 
   aria-describedby="Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error 
Password-error">

This is quite an overhead of values for the attribute considiering that the values are equal. Is this behaviour usual or does someone know how to fix this?

I am using the latest version of jQuery Validation Unobtrusive in bination with the latest version of jQuery Validate. The validation itself works like a charm. However if the field is invalid, values will be added to the aria-describedby attribute.

Let's say I want to type in my password (for validation the length of the password must be greater than 6). The initial HTML looks like this:

<input data-val="true" data-val-minlength="The field Passwort must be a string or array type with      a minimum length of '6'." 
   data-val-minlength-min="6" data-val-required="The Passwort field is required." 
   id="Password" name="Password" tabindex="2" 
type="password">

I start to type a password with only 5 characters and then remove focus from the input by clicking somewhere on the body. The validation runs through and a bunch of attributes and values including aria-describedby will be added. Now the aria-describedby attribute only has a single value Password-error. If I then focus the input field again and remove all characters and even keep pressing backspace, a new value on each keyup is added. This results in the following:

<input data-val="true" 
   data-val-minlength="The field Passwort must be a string or array type with a minimum length of '6'." 
   data-val-minlength-min="6" 
   data-val-required="The Passwort field is required." 
   id="Password" name="Password" tabindex="2" type="password" aria-required="true" 
   aria-invalid="true" class="input-validation-error" 
   aria-describedby="Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error Password-error 
Password-error">

This is quite an overhead of values for the attribute considiering that the values are equal. Is this behaviour usual or does someone know how to fix this?

• javascript
• jquery
• unobtrusive-validation

Share Improve this question Follow edited Oct 30, 2014 at 17:58 Sparky 98.8k2626 gold badges202202 silver badges290290 bronze badges asked Oct 30, 2014 at 16:38 LordTribualLordTribual 4,24922 gold badges2929 silver badges3838 bronze badges 2

• Have you found any solution? – Alex Commented Oct 10, 2015 at 4:14
• See my answer below. Somehow the problem was gone after I rebuild the solution in VS and deleted the shadow copies which get created in the background. – LordTribual Commented Oct 11, 2015 at 6:53

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 4

This issue was present in v1.13.0 of jquery.validate.js but has since been fixed (in at least v1.14.0).

I have no explicit explanation for the problem but since Visual Studio creates shadow copies in the background I could solve the issue by clearing the cashe and deleting all shadow files for the project and a rebuild afterwards.

I ran into a similar problem with version 1.19.5, where aria-describedby attributes were added in many inputs for no reason. The reason, in my case, was having a validation element with no corresponding input element of the same name. It looked like JQuery.validation just got confused. The OP has already accepted an answer, yet I thought of sharing a potential fix for scenarios similar to my case.

本文标签： javascriptMultiple values for ariadescribedby when using jQuery Validation UnobtrusiveStack Overflow