ExtJS grid save cookies for show/hide columns

[Reimius]

if you want the option to restore default settings, I use this code (a function that returns the default column model so we aren't passing in a reference that would be changed by the grid):

function defaultColumnModel(){
return [
{
id: 'request_row',
header: 'Request ID',
dataIndex: 'request_id',
renderer: renderRequest,
align: 'right',
width: 90,
sortable: true,
columnIndex: 0,
hidden: false
},...
];
}

Then I add the button to the bottom toolbar to reload the old configuration:

grid.getBottomToolbar().add([
'->'
, {
text: 'Reset Column Configuration',
handler: function () {
grid.filters.clearFilters();
grid.getColumnModel().setConfig(defaultColumnModel(), false);
}
}
, {
text: 'Clear Filter Data',
handler: function () {
grid.filters.clearFilters();
}
}
]);

[emmy mathew]

Please tell me how did you save the state of hidden columns in cookie?

[Condor]

1. Register a cookie provider:

Ext.state.Manager.register(new Ext.state.CookieProvider());

2. Disable state management for all components by default:

Ext.Component.prototype.stateful = false;

3. Enable state management for the grid:

stateId: 'mygrid',
stateful: true

4. Give all your columns an id (otherwise they will be stored by number, which would break if you ever add columns).

[emmy mathew]

While using grid.getBottomToolbar().add ..shows error in firebug console

function not defined....

[Condor]

While using grid.getBottomToolbar().add ..shows error in firebug console

function not defined....

Which Ext version?

[emmy mathew]

Ext 2.1

[Condor]

Wow, that's old. Toolbars were completely redesigned in Ext 3, so you need different code for Ext 2.1 (you'll need to check the Ext 2.1 Toolbar API docs because I don't even remember how I did it back then).

[ai2517]

1. Register a cookie provider:

Ext.state.Manager.register(new Ext.state.CookieProvider());

2. Disable state management for all components by default:

Ext.Component.prototype.stateful = false;

3. Enable state management for the grid:

stateId: 'mygrid',
stateful: true

4. Give all your columns an id (otherwise they will be stored by number, which would break if you ever add columns).

Hi with 3.3.0 I cannot make resize and hiddenchange to work properly with above code. It works for column move and sorting but not for show/hide columns and resize. Is this still applicable or I need to do something more?

[Condor]

Is this still applicable or I need to do something more?

Yes it is, but there is a bug in Ext 3.3.0 (see here).

[ai2517]

Yes it is, but there is a bug in Ext 3.3.0 (see here).

Thanks Condor! Looks like I will need to wait until the fixed version is released.