Question

We have a simple datagrid that we are enabling navigation via a the tab key. (we move to the next cell) In IE 7 & 8 when we hit the tab key it causes the focus to move off the grid to the next element.

In other browsers we prevent focus moving to the next element on the page by calling focus() on the div that contains our grid. In IE this does not work, the focus moves on regardless.

What can we do (without jQuery) to keep the focus on the grid so we can hit the tab key repeatedly and move through the cells in our grid?

The same issue also exists when pushing the enter key.

Answer 1

In your event handler (onkeydown, keypress etc) when you have finished handling the tab key use this code 🙂

return false;

This prevents the default behaviour from occurring and should stop the navigation from proceeding.