ExtJS使用Tab在两个网格之间导航

Question

我有一个包含两个网格的面板，这两个网格都可以使用单元格编辑插件进行编辑。在网格中，用户可以使用Tab键在可编辑字段之间移动。但是，我似乎无法找到正确的方法来获取Tab键以允许用户从第一个网格中的最后一个可编辑单元格移动到第二个网格中的第一个可编辑单元格（两个网格之间没有组件）。用户只是卡在第一个网格的最后一个可编辑字段中。

我尝试使用FocusManager，但这使键盘导航变得更复杂，而不是更少，需要使用箭头键进出每个表单元素和网格。

我将此代码添加到父面板：

var nav = new Ext.util.KeyNav(Ext.getDoc(), {
tab: function(e) {
console.debug('TAB HIT!', arguments);
},
scope: this
});
nav.enable();

只是为了查看检测到哪些标签，但只有在单击标签键并且父面板中的表单元素具有焦点时才会激活它。

我想我需要学习一些元素，如何将焦点从元素传递给元素，以及如何检测网格中的第一个和最后一个元素？或者有没有办法在ExtJS中内置这个？任何建议或意见将不胜感激。

Answer 1

我会将新的cellkeydown event用于网格面板。

为该事件实现一个处理程序，该事件检查密钥类型，以及该单元格是否是网格中的最后一列，然后在另一个网格中相应行的第一列中启动单元格编辑。

你可以从这个事件传递的第7个参数中找出它是否是TAB键。

您可以从事件传递的第3个参数中找出它是否是网格中的最后一个单元格。

rowIndex是第6个参数 - 使用它以便您知道在另一个网格中开始编辑哪一行。

顺便说一句，可以使用on method将事件处理程序添加到组件中。

您还可以在API here中查找需要调用以启动单元格编辑的函数。

如果你有更多的代码，也许是赏金，我可能会更具体，但这就是我将如何做到的要点。