Support Article
Freeze grid header option of Repeat grid has issue with Tab-Key
SA-31338
Summary
Selection of "Freeze grid header" checkbox (Presentations Tab) for a Repeating Grid allows user to navigate twice through Grid header using Tab-Key press.
The additional navigation is because of a hidden row that gets appended to the grid header with tabindex = "0".
Error Messages
Not Applicable
Steps to Reproduce
1. Create a section and include a Repeat Grid.
2. Navigate to Layout Properties > Presentations Tab and select "Freeze grid header" checkbox.
3. Populate data into the repeat grid.
4. Press tab key to navigate through the header columns of the repeat grid in UI.
Root Cause
As Freeze Grid header is not Accessibility Certified and problematic because the freeze header is implemented using multiple HTML tables which leads to the issue, it is suggested to use pagination instead of freeze grid header.
Resolution
Add the below script in userworkform:
<script>
function setHiddenCellTabIndex() {
if(!detectIE()){
$("th.hiddenCell").attr("tabindex","-1"); /* this works for chrome */
}else{
$(".hiddenCell").attr("tabindex","-1"); /* this works for IE */
}
}
$(document).ready(function() {
pega.u.d.attachOnload(setHiddenCellTabIndex,true);
});
/**
* detect IE
* returns version of IE or false, if browser is not Internet Explorer
*/
function detectIE() {
var ua = window.navigator.userAgent;
var msie = ua.indexOf('MSIE ');
if (msie > 0) {
// IE 10 or older => return version number
return parseInt(ua.substring(msie + 5, ua.indexOf('.', msie)), 10);
}
var trident = ua.indexOf('Trident/');
if (trident > 0) {
// IE 11 => return version number
var rv = ua.indexOf('rv:');
return parseInt(ua.substring(rv + 3, ua.indexOf('.', rv)), 10);
}
var edge = ua.indexOf('Edge/');
if (edge > 0) {
// Edge (IE 12+) => return version number
return parseInt(ua.substring(edge + 5, ua.indexOf('.', edge)), 10);
}
// other browser
return false;
}
</script>
Published December 17, 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.