Support Article
Field-level validation errors not read by screen reader
Summary
Server-side field-level validation error messages as defined in a validate rule, are not read when the accessibility user uses the error field hotkey.
For Internet Explorer the hotkey is "Alt+E" while in Firefox and Chrome it is "Alt+Shift+E."
This hotkey should move browser focus to the next field with a validation error and prompt a screen reader to read the specific error.
Instead, the browser's edit menu is opened and browser focus does not go to the field.
Error Messages
Not Applicable.
Steps to Reproduce
- Configure field-level server side validation on a field.
- Cause the validation error to be displayed.
- Use Alt+E or Alt+Shift+E to jump to the field with the error.
Root Cause
A defect in Pegasystems’ code or rules causes the intended shortcut to not bind properly.
Resolution
Perform the following local-change:
Add the following script to the UserWorkForm Html fragment:
<script>
if(pega && pega.u && pega.u.d && pega.u.d.Axisbility){
pega.u.d.Axisbility.shortcutToError = function(){
// get all error spans
var spans = document.getElementsByTagName("SPAN");
for(i=0; i<spans.length; i++){
if(spans[i].getAttribute("errId") || spans[i].id=="PegaRULESErrorFlag"){
var element = spans[i].parentNode.nextSibling;
if(typeof element != "undefined" && element && element.nodeType==3){element=element.nextSibling;}
var currentElement = spans[i];
while(currentElement){
if(element){
if(typeof(element.length)=='undefined'){
if((element.tagName=="INPUT") || (element.tagName=="TEXTAREA") || (element.tagName=="SELECT")){
if(element.type!="hidden"){
element.accessKey = accessKeyError;
element['accessKey'] = accessKeyError;
element.setAttribute("aria-describedby",element.name+"Error");
element.setAttribute("aria-invalid","true");
}
else{
var elemSib=element.nextSibling;
if(element.name==elemSib.name){
elemSib.accessKey = accessKeyError;
elemSib['accessKey'] = accessKeyError;
elemSib.setAttribute("aria-describedby",elemSib.name+"Error");
elemSib.setAttribute("aria-invalid","true");
}
}
break;
}
}
for(var j=0; j<element.length; j++){
if(element[j]){
if((element[j].tagName=="INPUT") || (element[j].tagName=="TEXTAREA") || (element[j].tagName=="SELECT")){
if(element[j].style.display != 'none' && element[j].style.visibility!="hidden" && element[j].type!="hidden"){
element[j].accessKey = accessKeyError;
element[j]['accessKey'] = accessKeyError;
element[j].setAttribute("aria-describedby",element[j].name+"Error");
element[j].setAttribute("aria-invalid","true");
break;
}
}
}
}
}
currentElement = currentElement.parentElement;
if(currentElement){
element = currentElement.getElementsByTagName("*");
}
}
}
}
}
}
</script>
This will also be addressed in a future release of Pega 7.
Published April 6, 2016 - Updated October 8, 2020
Have a question? Get answers now.
Visit the Collaboration Center to ask questions, engage in discussions, share ideas, and help others.