7

我有一个可编辑的剑道网格,我可以在其中编辑一个单元格,网格将红色标记添加到单元格的左上角。

我转到另一个页面,然后返回进行编辑的页面,红色标记消失了,但单元格中新添加的值仍然存在。我在 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
                 };
4

1 回答 1

9

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

很有可能我不知道有一种方法可以仅引用网格中的未决更改,但我编写了一个小系统,以便在更细粒度的级别上跟踪此类更改。

在我的系统中,我将网格的未决更改存储在一个名为 PendingChanges 的全局变量中。

然后我指定两个事件。第一个是网格数据源中的更改事件。此代码存储您从刚刚发生的更改中需要的信息:

    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 事件检查周围有哪些待定更改,并将相关单元格设置为显示红色三角形:

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 事件。

于 2013-07-05T15:29:42.100 回答