Question

我有一个显示一组数据的Kendo UI网格，我需要能够选择特定的单元格（特定列中的单元格），并且在选中时，返回所选单元格所在行的DataItem，以及单击的DataItem的属性。我不知道这是否可能，但我一整天都在努力，并得出结论我需要一些帮助。

这是我的grid和dataBound函数，它当前为我提供了DataItem，但就是这样：

    var hhGrid = hhDiv.kendoGrid({
        dataSource: housing,
        scrollable: false,
        sortable: true,
        selectable: 'cell',
        columns: [
            { field: "Start", title: "Start", format: "{0:MM/dd/yyyy}", type: "date" },
            { field: "Stop", title: "Stop", format: "{0:MM/dd/yyyy}", type: "date" },
            { field: "Facility" },
            { field: "Area" },
            { field: "Pod" },
            { field: "Cell" },
            { field: "Comment" }
        ]
    }).data('kendoGrid');

    hhGrid.bind('change', grid_change);

function grid_change(e) {
    var selectedCells = this.select();
    var dataItem = this.dataItem(selectedCells[0].parentNode);
}

首先，有没有办法'关闭'网格定义中特定列的选择？这样做我找不到任何东西。我只希望用户能够在“Area”，“Pod”和“Cell”列中选择单元格。如果他们点击其他列，则不会发生任何事情。此外，当他们点击那些选定的单元格时，我想获取单元格所在行的DataItem（我目前可以使用该grid_change方法执行），以及选中的列，或者已选择的DataItem。

因此，例如，如果用户单击“Pod”单元格，我想知道它是单击的pod单元格，以及单元格所在行的其他数据。似乎所有的数据是存在的，所以不应该这么困难，但我真的很难找到完成这个所需的数据。

感谢您的帮助！

Answer 1

获取数据项是：

// Get selected cell
var selected = this.select();
// Get the row that the cell belongs to.
var row = this.select().closest("tr");
// Get the data item corresponding to this cell
var item = grid.dataItem(row);

要获取列名，您可以这样做：

// Get cell index (column number)
var idx = selected.index();
// Get column name from Grid column definition
var col = this.options.columns[idx].field;

获取与列关联的字段的另一种方法是：

// Get column name from Grid column header data
var col = $("th", this.thead).eq(idx).data("field");

优点是列可以排序，无论如何都可以使用。为了清除您不希望只需要调用clearSelection()的列的选择。

if (col !== 'Area' && col !== 'Pod' && col !== 'Cell') {
    this.clearSelection();
}

在此处查看示例：http://jsfiddle.net/OnaBai/m5J9J/1/和此处：http://jsfiddle.net/OnaBai/m5J9J/2/（使用列标题获取列名称）

Kendo UI Grid：选择单个单元格，返回DataItem，并阻止选择特定单元格？

1 个答案: