Javascript 如何在剑道网格中的可编辑单元格之间添加自定义键盘导航

作为问答的继续：

如何为剑道网格实现自定义按键处理程序，以实现以下功能：

箭头键向上和向下导航行

当导航离开时，单元格内容将保存到网格中

将打开下一个单元格的编辑器

---

我将使用在中找到的信息、kendo.grid.js源代码和我自己的实验来回答我自己的问题。如果其他人有更好的解决方案，我会欣然接受

// add a handler for the keydown event within the grid cells
$("#grid").kendoGrid().table.on("keydown", "td", function(e) {
    var grid = $("#grid").kendoGrid();

    if (e.keyCode == 38 || e.keyCode == 40) {
        var current = $(this);
        var row = current.closest("tr");
        var rowIndex = $("tr", grid.tbody).index(row);
        var colIndex = $("td", row).index(this);

        if (e.keyCode == 38) {//up
            rowIndex--;
        }

        if (e.keyCode == 40) {//down
            rowIndex++
        }

        //handle wraparound. Negative indexing already counts from the end, so only this case is needed
        if (rowIndex >= grid.dataSource.view().length) {
            rowIndex = 0;
        }

        var nextCellSelector = "#bid-items-grid tbody tr:eq(" + rowIndex + ") td:eq(" + colIndex + ")";
        grid._handleEditing(current, $(nextCellSelector), current.closest("table"));

        // reusing the jQuery object doesn't work here because the grid redraws
        grid.editCell($(nextCellSelector));
    }
});

首先，编写一个自定义的keydown事件处理程序。你读钥匙，你决定你在哪个单元，你需要移动到哪个单元，你在网格上处理包裹案件

第一个技巧是调用

\u handleEditing（）

。这是剑道网格用于处理编辑的内部函数。它的签名是

\u handleEditing:function（current，next，table）

，将当前单元格、下一个单元格和表本身作为输入注意：

方法是内部方法：它们不是为外部使用而设计的，也不能保证在更新过程中保持不变。但我找不到实现这一目标的官方途径。小心使用

看起来它将自动选择下一个单元格进行编辑，如果选择了，您可能可以省略对
grid.editCell（）
的调用。但是，根据我的经验，
\u handleEditing（）
会导致网格重新绘制，这会导致JQuery对象与表单元格元素分离

这就是为什么调用
grid.editCell（）
需要使用行和列位置的显式选择器，而不仅仅是将JQuery对象保存在变量中

基于选项卡的导航可以以类似的方式实现，方便的
kendo.keys.Tab
定义可以与keyCode进行比较，以提高可读性。此外，有了Tab支持，您需要接受浏览器的默认Tab行为，即尝试跳转到下一个输入：

e.preventDefault();
e.stopPropagation();

恐怕用下划线的方法不是个好主意。他们自称是私人的。我是说，因为他们可以随时更改这些方法，所以更新可能会破坏您的代码。我建议你在telerik论坛上展示你的代码（如果你有访问权限的话），并寻求更好的解决方案。这甚至可能成为未来小部件中的修复或新功能。以功能请求的形式向他们提出这是一个好主意。正是因为这个原因，我想把这篇文章贴出来，以防其他人碰巧知道更好的解决方案，但在我的研究中，我找不到任何官方的、公众的消息。我将在答案中更明确地补充这一警告。