javascript - Kendo UI Grid从命令功能更改行明细值，而不会折叠明细

我有一个带有详细信息模板的kendo网格，如果用户单击父行中的clear命令，则希望清除它。



我设法使它起作用，但是一旦我set dataItem上的值，行详细信息就会折叠，这会导致用户失去位置。

function clearDetails(e) {
    var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
    dataItem.set("City",""); // causes row detail collapse
}

$(document).ready(function () {
    $("#grid").kendoGrid({
        dataSource: {
            type: "odata",
            transport: {
                read: "https://demos.telerik.com/kendo-ui/service/Northwind.svc/Customers"
            },
        },
        columns: [{
            field: "ContactName",
            title: "Contact Name",
            width: 240
        }, {
            field: "Country",
            width: 150
        }, { command: { text: "Clear", click: clearDetails }, title: " ", width: "180px" }],
        detailTemplate: kendo.template($("#myRowDetailTemplate").html())
    })
});

工作示例：
https://jsbin.com/xuwakol/edit?html,js,output

有没有办法我仍然可以清除行详细信息中的值而不会崩溃。

最佳答案

我在kendo网格中使用dataBinding函数遇到了同样的问题。

基本上，它检查项目更改事件，并将取消默认操作以关闭网格。这使我可以继续使用set方法。

例：

$("#grid").kendoGrid({
        dataBinding: function (e) {
            if (e.action == "itemchange") {
                e.preventDefault();
            }
        },
    });
}

关于javascript - Kendo UI Grid从命令功能更改行明细值，而不会折叠明细，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/45712959/