Persist State In Kendo MVC Grid With Custom Command Columns? -

having issues persisting state in mvc grid when using custom command columns. here grid's wrapper

 @(html.kendo().grid < weighmaster_web.data.entity.destination > ()    .name("grid")    .columns(columns => {      columns.bound(c => c.description);      columns.bound(c => c.code);      columns.command(c => {        if (bupdate) c.custom("edit").click("edititem");        if (bdelete) c.custom("delete").click("deleteitem");      }).width(175);    })    .scrollable()    .groupable()    .sortable()    .toolbar(toolbar => {      if (bcreate) {        toolbar.create().htmlattributes(new {          id = "adddestination"        }).text("add destination");      }    })    .toolbar(t => t.excel())    .excel(excel => excel      .filename("destinations.xlsx")      .filterable(true)      .allpages(true)      .proxyurl(url.action("excel_export_save", "materialtransaction"))    )    .filterable(filterable => filterable.extra(false))    .resizable(resize => resize.columns(true))    .reorderable(reorder => reorder.columns(true))    .pageable(pageable => pageable      .refresh(true)      .pagesizes(true)      .buttoncount(5))    .datasource(datasource => datasource      .ajax()      .events(events => events.error("error_handler"))      .read(read => read.action("destinationindex", "destination").type(httpverbs.post))      .model(model => model.id(p => p.id))      .pagesize(20)      .create(update => update.action("destinationsave", "destination").type(httpverbs.post)))  ) 

here define click event handler in wrapper both edit , delete buttons. using custom commands may define custom edit template.

when @ actual jquery wrapper , can see event handler defined.

then when leave page , code ran save grid's state in cookie :

$(window).unload(function () {     var grid = $("#grid").data("kendogrid");     var datasource = grid.datasource;     var state = {         columns: grid.columns,         page: datasource.page(),         pagesize: datasource.pagesize(),         sort: datasource.sort(),         filter: datasource.filter(),         group: datasource.group()     };      $.cookie(username + "destinationgridstate", json.stringify(state), { expires: 365 });   }) 

the grid's state read cookie in $(document).ready :

$(document).ready(function () {            var grid = $("#grid").data("kendogrid");            var toolbar = $("#grid").find(".k-grid-toolbar").html();      var state = $.cookie(username +  "destinationgridstate");     if (state) {                     state = json.parse(state);                         var options = grid.options;         options.columns = state.columns;         options.datasource.page = state.page;         options.datasource.pagesize = state.pagesize;         options.datasource.sort = state.sort;         options.datasource.filter = state.filter;         options.datasource.group = state.group;         if (grid) {             grid.destroy();             //grid.wrapper.html("");         }          $("#grid").empty().kendogrid(options).find(".k-grid-toolbar").html(toolbar);     }      }); 

after grid's state read cookie, no click event handler defined custom edit command button. , guess question is; how correctly save state of grid custom command buttons retain event handlers?

as mentioned in kendo documentation:

json.stringify() cannot serialize function references (e.g. event handlers), if stringification used retrieved grid state, configuration fields, represent function references, lost.

i once had same issue, when trying save filters values in session. doing you, realized didn't need restore columns state. if remove row options.columns = state.columns; custom command work expected.

hope helps.