kendo-ui - Kendo网格可调整大小的列宽

网格列可以调整大小。我想存储用户调整的列宽，并在下一个会话开始时恢复它们。

我发现存储列宽的最佳方法如下：

var element = $('#grid').kendoGrid({
   ...
    resizable: true,
    columnResize: function(e) {
        var state = {};
        this.columns.every(function(c,i) {
            state[c.field] = c.width;
            return true;
        });
        var state_txt = JSON.stringify(state);
        localStorage['profile_userprofile_grid_column_width'] = state_txt;
    }
}

现在，我想恢复在上一个用户会话中保存的列宽。我可以从存储读取列宽：

var state = JSON.parse(localStorage['profile_userprofile_grid_column_width']);

如果此时已经创建了网格，是否有人知道将这些值应用回网格的简便方法？调整大小的句柄是在内部执行的，因此可以实现，但是在网格源中执行此操作的代码很丑陋。

最佳答案

您可以在初始化后触发columnResize事件，如下所示

function grid_columnResize(e) {
  // Put your code in here
  console.log(e.column.field, e.newWidth, e.oldWidth);
}
$("#grid").kendoGrid({
  columns: [
    { field: "name" },
    { field: "age" }
  ],
  dataSource: [
    { name: "Jane Doe", age: 30 },
    { name: "John Doe", age: 33 }
  ],
  resizable: true
});
var grid = $("#grid").data("kendoGrid");
grid.bind("columnResize", grid_columnResize);

Documentation

关于kendo-ui - Kendo网格可调整大小的列宽，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/20379967/