I am another person with the same problem. I have some other requirements too.

The grid has virtually 250,000 rows, so I use virtual scrolling. I want to be able to [Tab] into the grid from the previous part of the form, selecting the first visible row at the same time, use up and down arrow keys to move up and down, and [Enter] to have the same effect as a mouse click (not all rows respond to clicks or [Enter]. The user does not do any editing.

I do not believe the complicated messes I have made trying to do this are close to the correct method.

I have read the documentation, but I found a lot of it difficult to understand. Like RickB, I can use up and down arrows to scroll the view of the grid, but cannot change the current selection. There is no mention in the documentation about controlling form focus either into the grid or within it (if I want the grid to take focus so that I can use keystrokes to change which row is selected using the arrow keys, what do I trigger the “focus” event on? How do I control which row is selected when I do? What if I am using virtual scrolling (and I am) and the row to be selected isn't loaded?).

I am going to try doing this again. But I don't want to make another mess of it, so let me check if I have this right.

• I will need to include the cell editing module.
• Because the server supplies JSON data, I will also need the Import/Export and JSON/XML modules.
• Because “editable” defaults to false in the colModel options, I can leave that out.
• The colModel will need extra hidden columns to store information that will be used to make the events work (and not using jQuery's data() to store it against the row's DOM object).
• Formatting of the visible columns differs based on information in the hidden columns, so I also need the Formatter plugin.
• The grid options will include “celledit:true” and “scroll:1″.
• I use the keyBindings method to attach an event handler to the [Enter] key, and set “scrollingRows” in the same parameter object to true.
• Because I often want to select an arbitrary row in the table (because there are so many rows, I have dynamically-generated indexes for the user to select from (either with a mouse-click or by using up/down arrows and hitting [Enter]) and then the grid should get focus) I want the grid's options to include “scrollrows:true”. This seems to cause problems with virtual scrolling.

Would this be doing things the right way? But now I don't understand how to make clicking on a row have the same behaviour as selecting it with the keyboard and hitting [Enter]. There seems to be no kind of setting a row's “click” handler (except through accessing the DOM object – which I could not find support for).

Update. By setting “scrollingRows:false” when calling bindKeys() (and osome ther random prodding), Keyboard focus is successful, the spontaneous reloading has stopped, and the up and down arrow keys do what they should. Woohoo!

All I need to do now is find out why the grid only scrolls by 15px per row when the height of a row is 22px, and I'll be totally satisfied.

Updated update: except now the grid won't scroll when using the mouse to move the scrollbar.