Grid Options persist and load - managing column changes between application versions

[Nick]

Hi Guys,

A quick one: I understand the concept of grabbing the grid state via "grid.getOptions", then persisting this, and then applying it again via "grid.setOptions" on form refresh to keep the users' sort/filter/column options, etc between sessions. There are posts and help for this already.

 

My question is this:

• In our situation, we do the above persistence, and store the options string somewhere (e.g. database).
• However, we may well change the set of columns that the grid needs to display when we do an application version update. It's likely that we would remove, or add columns for example.
• So, if we have try to apply an options set to the grid that has some columns missing or added since the "save" of the options... what happens?

Does it:

• Robustly (silently ignore) options we are trying to apply for columns that no longer exist in the grid?
• Robustly (apply a default) for columns that do not have any options being applied? (e.g. newly added columns).
• Throw errors, but still render?
• Fail to render with errors?
• Something else?

cheers

Nick

 

 

 

[Viktor Tachev]

Hi Nick,

When the state is persisted via getOptions the column settings would also be persisted. This means that if some columns are persisted they will be added in the Grid after the state is restored.

You can test by that behavior by saving the state in the example below. Then remove a column from the Grid and restore the state. You will notice that the column is recreated. 

• http://dojo.telerik.com/elIfU

In order to change the behavior I would recommend getting the options that are saved and removing the data for the columns that should not be present manually.


Regards,
Viktor Tachev
Progress Telerik

[hunidoc.com developers]

Hi

This is our problem too. The user save their grid profile into the local storage, after it when he/she open the page we load the profile automatically. We add new columns, because there is always a new user need ... After that he/she not see the new columns to switch on. Is there any js function that regenerate the columns menu ?

thanks

[hunidoc.com developers]

I found the solution. It works for me:

var Partnerlist =
    {
        LoadClientState: function () {
            var grid = $('#grid').data('kendoGrid');
            var tempColumns = grid.columns;
            var options = localStorage['Last_PartnerGridSettings'];
            if (options && options != "undefined") {
                var parsedOptions = JSON.parse(options);
                parsedOptions.toolbar = [
                    {
                        template: $("#toolbarTemplate").html()
                    }
                ];
                grid.setOptions(parsedOptions);
                grid.columns = tempColumns;
                grid.dataSource.read();
                return true;
            }
            return false;
        },

        SaveClientState : function () {
            try {
                var grid = $('#grid').data('kendoGrid');
                localStorage['Last_PartnerGridSettings'] = kendo.stringify(grid.getOptions());
            } catch (ex) {
                console.log("profil error : " + ex);
            }
            return true;
        },

        DeleteGridSettings: function () {
             deleteGridSettings('@VirtualPathUtility.ToAbsolute("~/ ")Partner/List', 'grid');
        }
    };

var Partnerlist =
    {
        LoadClientState: function () {
            var grid = $('#grid').data('kendoGrid');
            var tempColumns = grid.columns;
            var options = localStorage['Last_PartnerGridSettings'];
            if (options && options != "undefined") {
                var parsedOptions = JSON.parse(options);
                parsedOptions.toolbar = [
                    {
                        template: $("#toolbarTemplate").html()
                    }
                ];
                grid.setOptions(parsedOptions);
                grid.columns = tempColumns;
                grid.dataSource.read();               
                return true;
            }
            return false;
        },

        SaveClientState : function () {
            try {
                var grid = $('#grid').data('kendoGrid');
                localStorage['Last_PartnerGridSettings'] = kendo.stringify(grid.getOptions());
            } catch (ex) {
                console.log("profil error : " + ex);
            }
            return true;
        },

        DeleteGridSettings: function () {
             deleteGridSettings('@VirtualPathUtility.ToAbsolute("~/ ")Partner/List', 'grid');      
        }
    };