Tabbing issue within RadGrid pagination

[diane]

On page load ...when navigating by keyboard focus first goes to the pagination links below the table then back up to the links in the Action table column. How to I set focus to the links within the Action column first when using the keyboard (tabbing) then the pagination links below the table.

[Attila Antal]

Hello Diane,

The Grid renders the HTML table child elements in the following order:

<table>
    <thead></thead>
    <tfoot></tfoot>
    <tbody></tbody>
</table>

 

To fix the focus, try moving the <tfoot> element after the <tbody>

<table>
    <thead></thead>
    <tbody></tbody>
    <tfoot></tfoot>
</table>

 

You can this writing a jQuery code in the GridCreated client-side event.

Example:

<script>
    function OnGridCreated(sender, args) {
        var grid = sender;
        var $masterTableElement = $(grid.get_element()).find('.rgMasterTable');

        // Move the <tfoot> elemnt from between the <thead> and <tbody> to the end 
        $masterTableElement.find('> tfoot').appendTo($masterTableElement);
    }
</script>

This will put the focus on the hyperlinks after tabbing away from the Column/Filters.

Regards,
Attila Antal
Progress Telerik

[diane]

Thank you Attila Antal your fix worked!!