Best practices for keyboard navigation for web based data grids

Question

Can some one please tell me Keyboard navigation of Web based Grids?

My aim is to know how to work with Keyboard while working on any web based grid control.

For example:

Tabing, up and down arrow keys etc..

Thank you in advance.

Answer 1

If you are displaying an editable grid (like Excel) then you should emulate the expected keyboard navigation of such spreadsheet type apps.

• Tab should take user to the next logical cell (horizontal until it wraps at the end of the row)
• Shift+Tab (same but in reverse)
• Enter should take user to the cell below

Etc.

Answer 2

You can check the Shield UI Grid keyboard navigation example.

They have recently updated it to conform to the latest WAI-ARIA 1.1 standard and practices.