Question

我有一个可编辑的Kendo网格，我可以编辑一个单元格，网格将红色标记添加到单元格的左上角。

我转到另一页，然后返回编辑发生的页面，红色标记消失，但单元格中新添加的值仍然存在。我在剑道网站上看到了对此的回应，其中建议：“为了在每次网格反弹时显示”脏标志“，它将必须遍历所有模型，检查所有字段（如果已更改且可见）网格单元格。“

我假设这需要在网格的DataBound()事件上完成（当我切换页面时似乎触发）我将手动将k-dirty-cell类应用于单元格但是我无法弄清楚如何在代码中使这项工作。非常感谢任何想法。

$(function () {
                     $("#grid").kendoGrid({
                         height: 550,
                         scrollable: true,
                         sortable: true,
                         filterable: true,
                         resizable: true,
                         reorderable: true,
                         groupable: false,
                         editable: true, // enable editing
                         columns: [
                                    //REMOVED TO SHORTEN EXAMPLE    
                                    ],
                         toolbar: [{name: "save", text: "Save All Records"}, "cancel"], 
                         dataSource: {
                             schema: {
                                 data: "d", 
                                 total: function(data) {
                                    return data.d.length;
                                 },
                                 model: { 
                                     //REMOVED TO SHORTEN EXAMPLE  
                                     }
                                 }
                             },
                             batch: true,
                             pageSize: 10,
                             transport: {
                                 read: {

                                 },
                                 parameterMap: function (data, operation) {
                                     if (operation == "read") {
                                      //WEB SERVICE CALLS REMOVED... YOU GET THE POINT
                                     }
                                     else if(operation == "update") {
                                       //WEB SERVICE CALLS REMOVED... YOU GET THE POINT 
                                     }
                                 }
                             },
                         },
                         selectable: true,
                         pageable: true,
                         dataBound: function () 
                         {
                              //THIS IS FIRED WHEN I CHANGE PAGEs BUT
                              //NOT SURE WHAT CODE GOES HERE TO 
                              //REAPPLY DIRTY CELL MARKER
                 };

Answer 1

数据绑定事件是重新应用它的好地方，但我记住，当循环遍历网格的dataItems时，每行都有一个脏标志，但不是每个字段。

我很可能没有意识到只引用网格中挂起的更改的方法，但我写了一个小系统，可以在更细粒度的范围内跟踪这些更改。

在我的系统中，我将网格的待定更改存储在一个名为PendingChanges的全局变量中。

然后我指定了两个事件。第一个是网格dataSource中的change event。此代码存储刚刚发生的更改所需的信息：

    var PendingChanges = [];
    function GridEdit(e) {
        var cellHeader = $("#grid").find("th[data-title='" + e.field + "']");
        if (cellHeader[0] != undefined) {
           var pendingChange = new Object();
           //Holds field name
           pendingChange.PropertyName = e.field;
           //Keeps track of which td element to select when re-adding the red triangle
           pendingChange.ColumnIndex = cellHeader[0].cellIndex;
           //used to pull row.  Better than the row's id because you could have
           //multiple rows that have been inserted but not saved (ie. all have
           //ID set to 0
           pendingChange.uid = e.items[0].uid;
           //Remember to clear this out after you save
           PendingChanges.push(pendingChange);
        }
    }

然后，我使用dataBound event检查周围的更改，并设置相关的单元格以显示红色三角形：

function GridDataBound(e) {
    for (var i = 0; i < PendingChanges.length; i++) {
        var row = this.tbody.find("tr[data-uid='" + PendingChanges[i].uid + "']");
        var cell = row.find("td:eq(" + PendingChanges[i].ColumnIndex + ")");

        if (!cell.hasClass("k-dirty-cell")) {
            cell.addClass("k-dirty-cell");
            cell.prepend("<span class='k-dirty'></span>");
        }
    }
}

在上面的代码this中指的是The widget instance which fired the event.。这直接来自Kendo UI Docs。

希望这至少可以指出你正确的方向。如果要保存网格，请不要忘记在成功保存后清除PendingChanges数组。我建议使用RequestEnd事件。

在Kendo网格中的分页上手动维护脏单元格标记

1 个答案: