剑道网格可调整大小的列宽

Question

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

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

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']);

如果此时已经创建了网格，是否有人知道将这些值应用回网格的优雅方法？调整大小句柄在内部进行，所以可以，但是在网格源中这样做的代码很难看。

Answer 1

您可以触发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