Javascript 剑道网格更改多个选定单元格的值

Javascript 剑道网格更改多个选定单元格的值,javascript,jquery,kendo-ui,kendo-grid,Javascript,Jquery,Kendo Ui,Kendo Grid,假设我有几行数据填充了数字。我想选择多个单元格,然后单击网格外的按钮,将它们的值更改为其他数字,比如说“8”。看 Telerik的人给了我这个解决方案: $(".change").click(function () { var grid = $("#Grid").data("kendoGrid"); var cellsToChange = grid.select(); for (var i = 0; i < cellsToChange.length; i++) {

假设我有几行数据填充了数字。我想选择多个单元格,然后单击网格外的按钮,将它们的值更改为其他数字,比如说“8”。看

Telerik的人给了我这个解决方案:

$(".change").click(function () {
    var grid = $("#Grid").data("kendoGrid");
    var cellsToChange = grid.select();

    for (var i = 0; i < cellsToChange.length; i++) {
        var item = grid.dataItem($(cellsToChange[i]).closest("tr"));
        item.ProductName = "new value";
    }

    grid.refresh();
});

但问题是,我不知道将选择哪些单元格,因此无法使用item.ProductName。是否有一种方法可以直接设置所有选定单元格的值,例如cellsToChange[i].value?

您必须首先检索网格的列列表,然后循环使用它

$(".change").click(function () {
    var grid = $("#Grid").data("kendoGrid");
    var columnsListOfView = grid.columns;
    var cellsToChange = grid.select();

    for (var j = 0; i < cellsToChange.length; i++) {
        var item = grid.dataItem($(cellsToChange[i]).closest("tr"));
        for (var j = 0; j < columnsListOfView.length; j++) {
         //Here columnsListOfView[j].field will give you the different names that you need 
         var field=columnsListOfView[j].field;
         item[field] = "new value";    
        }
    }

    grid.refresh();
});

您可以从grid.columns或相应的th元素获取列名。使用grid.cellIndex方法选择正确的列:

$("#change").click(function() {
    var selected = grid.select();
    var header = grid.thead;
    for (var i = 0, max = selected.length ; i < max ; i++) {
        var index = grid.cellIndex(selected[i]);
        var th = $(header).find("th").eq(index);
        // could also use grid.columns[index].field 
        // (not sure if this gets reordered on column reorder though)
        var field = $(th).data("field");

        var item = grid.dataItem($(selected[i]).closest("tr"));
        item[field] = "new value";
    }

    grid.refresh();
});

感谢您的输入,但您的解决方案会遍历该行中的所有列。拉尔斯·霍普纳的解决方案正是我所需要的。但是,如果我们希望填充整行而不使用硬编码的列名,那么您的解决方案是很好的。这是一种方法!非常感谢。我只想添加该项。dirty=true应在赋值后添加。这样网格更新/保存就可以正常工作。如果有人想要红色标记指示单元格脏,.k-dirty-cell类应添加到相应的td元素。您也可以使用item.setfield,新值,它将设置脏属性并触发网格的更改事件。在这种情况下,您不需要调用.refresh。如果我使用item.setfield,我获取的新值:JavaScript运行时错误:无法获取未定义或空引用的属性“set”。var项被正常分配,然后触发数据源上的更改事件,然后项突然为空。我不明白为什么会发生这种情况?如果这是一个问题,我会使用第一个方法项[field]=新值;因为它不会导致每个单元格刷新,而刷新会导致您看到的性能问题;如果需要,您仍然可以手动触发更改事件您可能需要手动编写更改事件,但不确定您需要什么
$("#change").click(function () {
    var selected = grid.select(),
        header = grid.thead,
        dataItem,
        index,
        field,
        value,
        th;

    for (var i = 0, max = selected.length; i < max; i++) {
        dataItem = grid.dataItem($(selected[i]).closest("tr"));
        index = $(selected[i]).index();
        th = $(header).find("th").eq(index);
        field = $(th).data("field");
        value = "new value " + i;

        setTimeout(function (dataItem, field, value) {
            return function () {
                dataItem.set(field, value);
            }
        }(dataItem, field, value), 5);
    }
});