I use getOptions() and setOptions() to persist the state of the ajax bound grid that I have.
My toolbar is not a server one, it is this:
.ToolBar(toolbar =>toolbar.Create().HtmlAttributes(new { @class ="k-primary"}))
When I call the setOptions() method, it removes the Add button from the grid header.
The following is what worked for me in version 2023.2.718
var parsedOptions = JSON.parse(options);
parsedOptions.toolbar = kendo.template($("#toolbarTemplate").html());;
grid.setOptions(parsedOptions);
Just inside the toolbar template you can wrap your content in another div element to ensure styling is the same as the original, as in Brandons example some odd styling is being added.
....
}
I was on the phone with support and they mentioned this and they voted for me. I want to add a different spin to this. In my opinion I do not need to request the feature that the toolbar is serialized as a part of getOptions. Rather I think setOptions needs to be fixed to not overwrite things that are not intended on being serialized. The problem might be that for the toolbar it is sometimes supported and sometimes not....this I'm not sure. If the grid knew the toolbar shouldn't be updated when setOptions is called you can use a similar approve to one in another comment to ensure it isn't. You simply get the stored options and before you call setOptions you do the following:
options.toolbar = [{
template: kendo.template($(transfersGrid.element).find(".k-grid-toolbar").html())
}];
In this example transfersGrid is a variable in which I set using jquery and the .data method to get the grid object. I have it referenced for other reasons but you could use jquery to just go straight to the element. Either way this gets the existing toolbar (defined currently on the server in my case) and puts in the options so the options never touch the toolbar. In my case the toolbar definition is not part of the state therefore I wouldn't want it saved anyways.
Hello Logan,
A general way to save all the settings is not yet available. Consider casting your vote for this feature. Currently it has gathered only 3 votes. If it gets traction, we will consider it for a future release.
Regards,
Ivan Danchev
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Hello, Meliton Pablo,
Thank you for your feedback.
Until we implement the toolbar serialization in such a way that it works out of the box, you can use the following workaround to restore the button.
var grid = $("#grid").getKendoGrid();
var options = grid.getOptions();
options.toolbar = [{ name: "create", attr: { "class": "k-primary"} }];
grid.setOptions(options);
Any of the other alternatives in the Grid API will also work. For a reference of the expected structure, check this section of the API:
https://docs.telerik.com/kendo-ui/api/javascript/ui/grid/configuration/toolbar
Kind Regards,
Alex Hajigeorgieva
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.