javascript - 剑道网格 : Saving State in columnReorder event

Question

我创建了一些代码来保存和恢复列顺序，如果我能保存正确的数据，它也可以与调整大小一起使用。看起来，当“columnReorder”事件触发时，新的列顺序实际上还没有保存——所以尽管我的列保存和恢复功能确实有效，但它落后了一步。有谁知道如何获取"new"列信息，或在重新排序完成后 捕获事件？这是神奇的部分......

    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 )