KeyTable allows you to use keyboard navigation on a DataTables enhanced table, like an Excel spreadsheet. The focused cell is shown through the CSS class (focus - configurable using keys.className) which in the case below is simply a blue outline. Use your keyboard's arrow keys and click the cells in the table to navigate.

Enabling KeyTable on a DataTable is trivial with the keys option, however, to have it perform a useful function you'll want to know when the end user performs interaction options with the table's focus. For this KeyTable has a number of events it can trigger:

KeyTable supports DataTables' scrolling options (scrollX and scrollY) without required any additional configuration. As the navigation keys are used to alter the focus of the KeyTable, the DataTables scrolling position is altered to show the focused cell.

When DataTables' state saving option is enabled (stateSave) KeyTable will automatically store the last cell focused in a table and then restore that state when the page is reloaded.

When KeyTable adds focus to a table's cell it adds a class (defined by keys.className - default focus). This class can be used to provide styling information to highlight the focused cell to the end user. The provided stylesheets use CSS outline to show focus, but any CSS property can be used.