Question

我正在尝试使用箭头键在Kendo网格中启用导航。我看过可能使用箭头键仅在可编辑单元格之间导航的示例。我的剑道网格中有50多列，其中20多个单元格可编辑。我在数据绑定中创建了一个keydown事件，它只适用于可编辑的单元格。如果我转到不可编辑的单元格按键事件不起作用 当前工作逻辑：
左箭头键和右箭头键仅在可编辑单元格内部起作用。一旦我们到达不可编辑的单元格，它就无法正常工作 期望的工作逻辑
当我们按箭头键时，如果单元格是可编辑的，那么它应该进入编辑模式，如果单元格不可编辑，焦点应该保持不变，当我们按左/右箭头键时，光标应移动到上一个/下一个单元格。

我创建了一个telerik dojo。
UPDATE 此Dojo在IE中正常运行。但是在Chrome中它没有用。基本上Right arrow key应该像TAB密钥一样工作，而Left Arrow key应该像SHIFT+TAB

那样工作

Answer 1

即使不特别推荐在＆＃34; tabing＆＃34;？

时如何滑动不可编辑的单元格？

您将在网格中的表上绑定keydown事件。它可以调用这样的函数：

function onGridKeydown(e){
  if (e.keyCode === kendo.keys.TAB) {
    var grid = $(this).closest("[data-role=grid]").data("kendoGrid");
    var current = grid.current();
    if (!current.hasClass("editable-cell")) {
      var nextCell = current.nextAll(".editable-cell");
      if (!nextCell[0]) {
        //search the next row
        var nextRow = current.parent().next();
        var nextCell = current.parent().next().children(".editable-cell:first"); 
      } 
      grid.current(nextCell);
      grid.editCell(nextCell[0])
    }
  } 
};

这当然只解决了寻找下一个所需细胞的部分问题。这个答案可能会让你有一些正确的方向（抱歉没有使用你的dojo项目）。

Answer 2

最后，我们可以通过为单元格提供tabIndex来解决问题。基本问题是TR，TD不会触发keydown事件。在为TD设置TABINDEX之后，我们将关键事件触发并继续进行其他过程。我更新了Telerik Dojo
注意：我们已删除了数字输入的微调器，因此按下向上/向下箭头的值不会被更改。

使用箭头键进行剑道网格导航

2 个答案: