I kept the title generic because i don't care if the answer I get is in jquery, javascript, or specifically to MVC.
I have this code to save and load a grid:
$("#save").click(function() {
var grid = $("#grid").data("kendoGrid");
var dataSource = grid.dataSource;
var state = kendo.stringify(grid.getOptions());
$.ajax({
method: "POST",
url: "/ebol/savegrid",
data: {
data: state
}
});
});
$("#load").click(function () {
var grid = $("#grid").data("kendoGrid");
var dataSource = grid.dataSource;
$.ajax({
url: "/ebol/loadgrid",
success: function (options) {
if (options) {
grid.setOptions(JSON.parse(options));
}
}
});
});
The problem: I can save a grid's state (which includes column order, filters etc) but when i go to restore it with the load button, the grid's command column vanishes.
How do i preserve these buttons as well during the restore?
Another of our developers who was working on this exact issue on another page solved this one for me. You need to detach the toolbar before loading the grid settings. It seems hacky to me but according to Kendo, saving and loading settings is unsupported so this is the best we have. My revised code:
$("#load").click(function () {
var grid = $("#grid").data("kendoGrid");
$.ajax({
url: "/ebol/loadgrid",
success: function(state) {
if (state) {
state = JSON.parse(state);
let toolBar = $("#grid .k-grid-toolbar").detach();
grid.setOptions(state);
$("#grid .k-grid-toolbar").replaceWith(toolBar);
}
}
});
});
Edit(2024) I do not believe this is necessary anymore. They added the ability for the toolbar to be restored in r3 2023, except it was breaking some of the buttons in it. That has been resolved q1 2024.