Kendo UI Grid 如何从DataItem中获取列索引或列名

你无法直接通过自定义编辑器收到的dataItem参数获取对应列的名称或索引，dataItem本质是当前编辑行绑定的数据源实例，仅存储行业务数据，不包含Grid视图层的列元信息。

正确获取当前列名称/索引的实现方式 #

方案1：使用编辑器函数自带的options参数 #

这是最常用的实现方式，Kendo UI Grid自定义编辑器的入参中默认携带options对象，其field属性就是当前编辑列绑定的数据源字段名，匹配Grid的列配置即可拿到列索引。
示例代码如下：

// 自定义编辑器函数
function radioButtonCustomEditor(container, options) {
  // 直接获取当前编辑列的绑定字段名
  const currentColumnField = options.field;
  // 获取Grid实例
  const grid = $("#yourGridId").data("kendoGrid");
  // 查找对应列的索引
  const currentColumnIndex = grid.columns.findIndex(column => column.field === currentColumnField);

  // 此处可继续编写自定义编辑器的渲染逻辑，比如生成单选按钮组等
  $('<input name="' + options.field + '"/>')
    .appendTo(container)
    .kendoRadioGroup({
      dataSource: [/* 单选按钮配置 */]
    });
}

方案2：通过Grid编辑事件提前缓存列信息 #

如果你的业务逻辑需要在编辑器之外的上下文关联dataItem和列信息，可以在Grid的edit事件触发时先缓存当前编辑的列信息，后续直接读取即可：

$("#yourGridId").kendoGrid({
  columns: [
    // 你的列配置
  ],
  editable: "incell",
  edit: function(e) {
    // 缓存当前编辑列的字段名和索引
    e.container.data("currentField", e.sender.columns[e.container.index()].field);
    e.container.data("currentColumnIndex", e.container.index());
  }
});

内容的提问来源于stack exchange，提问作者ForzaLivi