[#6613] - [bug] Client-side form validation : remove aria-invalid on label. Closes #6596
- Closed
- 25 Nov 2015
- Medium
- Build: staging
- Easy Test
- # 6613
- Diff
- vinespie:master
- Success Human Test Results: 2 Successful 0 Failed. Details
User tests: Successful: Unsuccessful:
Removing "aria-invalid" attribute on label when form is not valid.
https://www.w3.org/WAI/GL/wiki/Using_Aria-Invalid_to_Indicate_An_Error_Field
Closes #6596
Client-side form validation : aria-invalid on label
Hello,
When using the client-side form validation system joomla " behavior.formvalidator " when a field is misinformed and when the field is linked to a label, the attribute " aria -invalid = true" is added to the label.
According to accessibility standards this attribute should be only placed on the attribute "input".
Thank you for your answers
http://www.w3.org/TR/wai-aria/states_and_properties#aria-invalid
https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-invalid_attribute
Example before client-side validation :
<form class="form-validate" method="post">
<label id="jform_title-lbl" title="" for="jform_title">Title</label>
<input id="jform_title" type="text" aria-required="true" required="required">
</form>Example after client-side validation wrong :
<form class="form-validate" method="post">
<label id="jform_title-lbl" title="" for="jform_title" aria-invalid="true">Title</label>
<input id="jform_title" type="text" aria-required="true" required="required" aria-invalid="true">
</form>Example after client-side validation correct:
<form class="form-validate" method="post">
<label id="jform_title-lbl" title="" for="jform_title">Title</label>
<input id="jform_title" type="text" aria-required="true" required="required" aria-invalid="true">
</form>Patch to \media\system\js\validate-uncompressed.js
Remove line 52
if($label){
$label.addClass('invalid');
}Remove line 57
if($label){
$label.removeClass('invalid');
}
joomla-cms-bot
- | Labels |
Added:
?
|
||
| Labels |
Added:
?
|
||
| Rel_Number | ⇒ | 6596 | |
| Relation Type | ⇒ | Pull Request for | |
| Easy | No | ⇒ | Yes |
| Category | ⇒ | JavaScript |
You should really include in the test notes that you need to enable joomla debugging for this (because else the compressed javascript is used)!
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/6613.
I have tested this item 
successfully on af39a44
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/6613.
I have tested this item successfully on af39a44
Works fine
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/6613.
| Status | Pending | ⇒ | Ready to Commit |
| Milestone |
Added: |
||
| Labels |
Added:
?
|
||
| Status | Ready to Commit | ⇒ | Pending |
| Labels | |||
Pending
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/6613.
| Labels |
Removed:
?
|
||
| Milestone | |||
| Milestone |
Added: |
||
| Milestone |
Added: |
||
| Milestone | |||
roland-d
- | Status | Pending | ⇒ | Closed |
| Closed_Date | 0000-00-00 00:00:00 | ⇒ | 2015-11-25 21:17:01 |
| Closed_By | ⇒ | roland-d |
I still have the aria-invalid="true" on the label...
This comment was created with the J!Tracker Application at issues.joomla.org/joomla-cms/6613.