Question

我正在将多个局部视图加载到同一cshtml页面中。一切顺利，直到需要使用脚本为止。因为我正在使用类似的代码

var grid = $("#grid").data("kendoGrid");
var selected = grid.selected();

此代码可以在一个网格上正常工作，但是当多个网格就位时开始显示问题。问题在于“ #grid”是对剑道网格名称的引用。有没有办法使它动态，以便可以被多个网格使用？

我认为当同一页面中有多个网格时，由于无法区分要引用的网格，也会发生相同的问题。给网格指定不同的ID是可以的，但是脚本中的代码将在grid.selected（）上返回未定义的错误。

更新：

所以使用的解决方案

var grid = $(".k-grid").data("kendoGrid");

在一定程度上起作用。它将数据加载到网格中，但无法执行其他任何操作。例如，我的用于启用“更新和删除”按钮的代码的一部分在第二和第三部分视图上不起作用。

var grid = $(".k-grid").data("kendoGrid");
var selected = grid.select();
if (selected.length > 0) {
    $("#btnCopy,#btnEdit,#btnDelete").removeClass("k-state-disabled");
} else {
    $("#btnCopy,#btnEdit,#btnDelete").addClass("k-state-disabled");
}

以某种方式，代码仅在我在网格1上选择了一行之后才开始对网格2和3起作用。

Answer 1

您可以使用class（.k-grid）代替id（#Grid）：

  var grid = $(".k-grid").data("kendoGrid");

Answer 2

我在高级程序员的帮助下找到的解决方案是将网格数据保存到这样的全局变量中。

var PartialGridData = PartialGridData || {};

之后，每当更改部分视图时，我都要设置和更改变量。

PartialGridData.selectedGrid = $("#PartialGrid1").data("kendoGrid");

其中名称＃PartialGrid1是当前网格的名称。这意味着我需要像使用网格一样多次编写此代码，但这也解决了许多问题。之后，我用它来选择正确的数据。

var grid = PartialGridData.selectedGrid;
var selected = grid.select();
if (selected.length > 0) {
    $("#btnCopy,#btnEdit,#btnDelete").removeClass("k-state-disabled");
} else {
    $("#btnCopy,#btnEdit,#btnDelete").addClass("k-state-disabled");
}

另一种选择是使用e.sender。

function onRowSelect(e) {
    var grid = e.sender;
    var selected = grid.select();
    if (selected.length > 0) {
        $("#btnCopy,#btnEdit,#btnDelete").removeClass("k-state-disabled");
    } else {
        $("#btnCopy,#btnEdit,#btnDelete").addClass("k-state-disabled");
    }
}

这两种解决方案都有其缺点。并非所有方法都获取用于e.sender的变量e，并且以未捕获的方式更改部分视图会导致全局变量无法更新，因此必须加以检查。

使用一个脚本的多个剑道网格

2 个答案: