Kendo Grid：在columnReorder事件中保存状态

Question

我创建了一些代码来保存和恢复列顺序，如果我可以保存正确的数据，它也可以用于调整大小。似乎，当“columnReorder”事件触发时，新的列顺序实际上还没有保存 - 所以尽管我的列保存和恢复功能确实有效，但它落后了一步。有人知道如何获取“新”列信息，或者在重新订购完成后捕获事件吗？这是魔术的一部分......

    var colCook = getCookieColumns();

    //setup user columns or cookie columns as appropriate
    $("#disputesGrid").kendoGrid({
        dataSource: myDataSource,
        columns: (colCook != null) ? JSON.parse(colCook) : {default column values},
        pageable: {
            refresh: true,
            pageSizes: [10, 25, 50, 100],
            buttonCount: 10,
            input: true
        },
        reorderable: true,
        columnReorder: function (e) { saveColumnsCookie(); },
        sortable: true,
        resizable: true,
        selectable: "multiple row"
    });
}

function getCookieColumns() {
    var cookiesArray = document.cookie.split(';');
    for (var i = 0; i < cookiesArray.length; i++) {
        var c = cookiesArray[i].trim();
        if (c.indexOf("DisputeGridViewColumns=") == 0) return c.substring(23, c.length);
    }
    return null;
}

function saveColumnsCookie() {
    //saves the current column information into a cookie
    try {
        var d = new Date();
        d.setTime(d.getTime() + (365 * 24 * 60 * 60 * 1000));
        var expires = "expires=" + d.toGMTString();
        document.cookie = "DisputeGridViewColumns=" + kendo.stringify($("#disputesGrid").data("kendoGrid").columns) + "; " + expires;
    } catch (x) { 
        //it fails when the grid isn't initialized - we can just ignore that
    }
}

注意：新的列顺序似乎不在事件的“e”中，但这是合理的地方，对吗？

Answer 1

您可以检查e.column（已移动的列），e.newIndex（重新排序后的位置）和e.oldIndex（来自哪里）以在重新排序后派生订单。 做你想做的最简单的方法是使用setTimeout：

columnReorder: function(e) {
    var that = this;
    setTimeout(function() {
        console.log(kendo.stringify(that.columns));
    }, 5);
}

（demo）