Dynamically change kendo grid columns wipes element properties values

Question

I need to rebuild my kendo grid columns dynamically per selected filter, so I call this code:

setGridDefinition: function (grid, gridId, gridDef) {
    var options = grid.options;
    options.columns = gridDef.columns;
    options.groupable = gridDef.groupable;
    options.sortable = gridDef.sortable;
    options.selectable = gridDef.selectable;
    options.pageable = gridDef.pageable;
    options.scrollable = gridDef.scrollable;
    options.filterable = gridDef.filterable;
    options.resizable = gridDef.resizable;
    grid.destroy();
    $("#" + gridId).empty().kendoGrid(options);
},

The problem is that the grid is now missing some very important property values, e.g. element, content, etc.

The only properties which still have values are: columns, dataSource, options, _cellId, _data, _events.

Any ideas how to not lose them or maybe to rebuild them?

I build the grid from MVC code and after selecting some filter I rebuild it from JavaScript (if it gives any clue).

Thanks

Answer 1

Thanks to @Orilux I used the setOptions method while before I tried something like 'grid.options = gridDef'.

Now my codes like this and it works:

setGridDefinition: function (grid, gridId, gridDef) {
    grid.setOptions(gridDef);
},