Start Building Professional
Web Apps Today


 
Categories Question details Back To List
Question  posted by Bill Manes on Mar 14, 2009 00:24
open dhtmlx forum
grid kb issue in IE7

I am trying to support keyboard input with a dhtmlxgrid object (using latest release). The grid has a single column of data in a list (to select from) with a search field in the header. The grid is in a popup div. Mouse input works just fine, but I need to be able to support selection with keyboard input only. A keyup event with keycode 13 (enter) on the form field causes the popup to be displayed.

After a lot of trial and error, I have been able to force the focus to the search field (grid.setActive did not work at all). This works in both FF and IE7.

In FF when I press tab, focus moves from the search field to the selected grid row and I can use up/down arrows to select a new row and then onEnter event handler to select the item. But in IE7, when I press tab focus moves outside the grid to the next form field. I cannot seem to find any key stroke that will get focus from the search field to the grid rows. Is there any way to do this in IE7?

I also have a problem after the onEnter event in the grid. When I make the popup invisible and focus back to the form field, the keyup event fires again and the grid is displayed. I don't understand why an enter on the grid causes a keyup event in the form field. Is there anyway to keep this from happening?

Bill
Answer posted by dhxSupport on Mar 16, 2009 08:14

You can use setExternalTabOrder(start, end) where start - html object or its id - gets focus when tab+shift are pressed in the first cell, end - html object or its id - gets focus when tab is pressed in the last cell. In your case end should be null object (end={})

To get object of a header input:

var start=mygrid.hdr.rows[2].firstChild.firstChild;

or 

var start=mygrid.hdr.getElementsByTagName("INPUT")[0];