Kendo grid column width saving and loading

[Ethan]

I am trying to save and load column widths for a kendo Grid.
I have been storing the information in local storage in a format such as this "[{"Name":"Line","Width":78,"Field":"ReceiptLine"},{"Name":"Supplier","Width":97,"Field":"Supplier"}]" and then changing the grid's column fields widths to the widths in the local storage on the dataBound event.
Then I have been getting the grid to resize by doing the rather hacky method of hiding and showing a previously unhidden column. This method works effectively. But is there a better way to do this?

I've tried the grid.setOptions(grid.options) method but that gave me an error.

[Dimo]

Hi Ethan,

Normally, the Grid layout is adjusted with the widget's resize() method. What it does is to adjust the height of the scrollable data area, depending on the Grid wrapper <div>'s height.

http://docs.telerik.com/kendo-ui/using-kendo-in-responsive-web-pages#individual-widget-resizing

What exactly are you trying to achieve by hiding and showing a column? Is the column widths configuration valid?

http://docs.telerik.com/kendo-ui/web/grid/appearance#column-widths

If you are using too small column widths and toggling one column's visibility in order to make the columns shrink, your approach is OK and there is no better one.

Using grid.options as an argument for the setOptions method is not correct. You need an object previously retrieved with getOptions().

http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-getOptions

Finally, note that the Grid property names should be lowercase (Width, Field). I suppose you are transforming the casing currently on the fly, but consider making your job easier by storing the properties directly in the correct casing.

Regards,
Dimo
Telerik

[Ethan]

The column widths configuration does appear to be valid. I am hiding and showing and column because that was the only way I could find to make the grid resize the column widths to the widths I had set them to.

I was under the impression that grid.options brought back the same object as getOptions(). I must have been wrong. doing setOptions() on an object previously retrieved by getOptions seems to just kill my page. But I think the setOptions is an irrelevance to my issue it is just one of the things I found when searching for solutions to my problem online.

[Dimo]

Hello Ethan,

>> "I am hiding and showing and column because that was the only way I could find to make the grid resize the column widths to the widths I had set them to."

This indicates that the sum of all column widths is smaller than the Grid width, which is considered incorrect.

In case you need further assistance, please provide a runnable demo, so that I can gain better understanding of your scenario and implementation.

Regards,
Dimo
Telerik