Question

我正在研究位于whitin tabstrip（tabstrip.select（0））的kendo UI网格。输入字段位于第二个tabstrip（tabstrip.select（1））中。 Crud操作正常。我的按钮保存点击事件看起来像这样：

function saveDataMasterGrid() {
    tabstrip.select(0);
    var field1 = $("#field1").val();
    var field2 = $("#field2").val();
    var field3 = $("#field3").val();
    var field4 = $("#field4").val();
    var field5 = $("#field5").val();
    var field6 = $("#field6").val();
    var field7 = $("#field7").val();
    var field8 = $("#field8").val();

    var gridData = $("#gridMaster").data("kendoGrid");
    var selectedRowData = gridData.dataItem($('.k-grid').find("tr.k-state-selected"));

    if (selectedRowData != null || selectedRowData != undefined) {
        gridData.dataSource.pushUpdate({
            Id: selectedRowData.Id,
            dataField1: field1,
            dataField2: field2,
            dataField3: field3,
            dataField4: field4,
            dataField5: field5,
            dataField6: field6,
            dataField7: field7,
            dataField8: field8
        });
    } else {
        gridData.dataSource.add({
            Id: gridData.dataSource.total() + 1,
            dataField1: field1,
            dataField2: field2,
            dataField3: field3,
            dataField4: field4,
            dataField5: field5,
            dataField6: field6,
            dataField7: field7,
            dataField8: field8
        });
    }

如何在kendo ui网格中标记新添加/编辑的行？任何帮助赞赏。提前谢谢。

Answer 1

dataSource的方法add()返回新添加的行的dataItem。因此，您可以通过其uid属性找到该行：

// After calling add()...

$(grid.tbody)
    .find("tr").removeClass("new-row") // Remove recent added tr's .new-row classes
    .filter('tr[data-uid="' + newRow.uid + '"]').addClass("new-row"); // Add class to the new row

Demo

如何在kendo ui grid中标记新添加的行

1 个答案: