grid.setOptions(JSON.parse(options)); makes datasource empty

Question

I am trying to save user's grid settings with using localstorage but when loading user settings datasource is empty.

$(document).ready(function () {
    var grid = $("#grid").data("kendoGrid");
    var options = localStorage["kendo-grid-options-" + "@Request.RawUrl"];
    if (options) {
        grid.setOptions(JSON.parse(options));
    }

    $("#save").click(function (e) {
        e.preventDefault();
        localStorage["kendo-grid-options-" + "@Request.RawUrl"] = kendo.stringify(grid.getOptions());

    });


});

Answer 1

Setoptions method was causing empty datasource.Because of this before I call this method I get datasource of grid:

var gridData = $("#grid").data("kendoGrid").dataSource;

After this when I called setoptions and after setoptions when I call this line , it worked like a charm.

grid.setDataSource(gridData);

Here is the final code :

    $(document).ready(function () {
    var grid = $("#grid").data("kendoGrid");
    var gridData = $("#grid").data("kendoGrid").dataSource;

    var options = localStorage["kendo-grid-options-" + "@Request.RawUrl"];
        if (options) {
            grid.setOptions(JSON.parse(options));
            grid.setDataSource(gridData); 
        }

    $("#save").click(function (e) {
        e.preventDefault();
        localStorage["kendo-grid-options-" + "@Request.RawUrl"] = kendo.stringify(grid.getOptions());
        location.reload();
    });


});