时间戳

首页 > 解决方案 > Kendo Grid - 编辑一个单元格并更新选定的单元格

angular - Kendo Grid - 编辑一个单元格并更新选定的单元格

问题描述

目前我在可编辑模式下使用 Kendo Grid，我想从一个网格的列中选择多个单元格，如果我在最后一个选定的单元格中进行更改，最后更改的值应该设置为所有选定的单元格。

我不确定这是否可能。

有人可以帮我吗？

标签： angularkendo-uikendo-gridkendo-ui-angular2

解决方案

你需要做一些事情来完成这项工作

  • 网格
    • 可选：'多个，单元格'
    • 可编辑：真
    • 工具栏：[“创建”、“保存”、“取消”]（如果是远程数据）
    • 更改事件处理程序以存储选定的单元格并将其中一个单元格置于编辑模式
    • 保存事件处理程序以将编辑的值传播到选定的单元格
    • keydown 事件处理程序，用于检测输入键作为编辑保存操作
  • 数据源
    • 批处理模式（如果是远程数据）

关于过度活跃的手指，可能存在一些奇怪的边缘情况。

看看这个dojo，它有这样的编码：

带有在配置选项中内联编码的事件处理程序的网格

change: function (e) {
  selected = (this.select().length > 1) ? this.select() : null;
  if (selected) {
    this.editCell($(selected[selected.length-1]));
  }
},
save: function (e) {
  if (e.values) {
    for (var field in e.values) {
      // propogate edited field value to each selected
      for (var i=0; i<selected.length; i++) {
        var uid = $(selected[i]).closest("tr").data("uid");
        var model = this.dataSource.getByUid(uid);
        model.set(field,e.values[field]);
      }

      // should be only one field
      break;
    }
  }
},

并输入密钥检测

$("#grid tbody").on("keydown", "tr", function (e) {
    var grid = $("#grid").data("kendoGrid");

    //get the pressed key code
    var code = (e.keyCode ? e.keyCode : e.which);
    if (code == 13) { //Enter keycode
        $(e.srcElement).closest("tbody").focus();
        setTimeout(function () {
            grid.saveRow();
        })
    }
});

推荐阅读