PDA

View Full Version : grid state restoring all but column widths



Dennis.Gearmesh
10 May 2013, 3:48 PM
I'm using Ext JS 4.2. In 4.1, my grids stored/restored state correctly. In 4.2, it seems that column width is not being restored. Everything else is being restored (grid width, grid height, sort columns, filter columns, etc.).

edit: it looks like it's also not storing column order.

I am having the same result with all of the grids in my project

Here is one of the grids as an example:


Ext.require('Client.store.LodgingReservedGrid');

Ext.define('Client.view.MainTab.EventLodgingReservedGrid',
{
extend: 'Ext.grid.Panel',
alias: 'widget.MainTabEventLodgingReservedGrid',
waitMsgTarget: true,
padding: '5 0 0 0',
resizable: true,
stateful: true,
stateId: 'EventLodgingReservedGrid',
title: 'Lodgings Reserved For This Event',
columnLines: true,
resizable: true,
resizeHandles: 'se',
dockedItems:
[
{
xtype: 'toolbar',
items:
[
{
xtype: 'button',
text: 'Refresh',
action: 'refresh'
}
]
}
],
initComponent: function () {
Ext.apply(this, {
store: Ext.create('Client.store.LodgingReservedGrid'),
plugins: Ext.create('Ext.grid.plugin.CellEditing'),
viewConfig: {
plugins: {
ptype: 'gridviewdragdrop',
dragGroup: 'EventLodgingAvailable',
dropGroup: 'EventLodgingReserved'
}
},
columns:
[
{ text: 'Name', dataIndex: 'Name'},
{ text: 'Number', dataIndex: 'Number' },
{ text: 'Type', dataIndex: 'Type' },
{ text: 'Capacity', dataIndex: 'Capacity' },
{ text: 'Abbreviation', dataIndex: 'Abbreviation' },
{ text: 'Level', dataIndex: 'Level' },
{ text: 'Amenities', dataIndex: 'Amenities' },
{ text: 'Conflicts', dataIndex: 'Conflicts' },
],
});


this.callParent(arguments);
}
}
);

Any idea what's going on?

Thanks!

slemmon
13 May 2013, 10:56 AM
Is the following example working ok for you?
http://docs.sencha.com/extjs/4.2.0/extjs-build/examples/state/state.html

Dennis.Gearmesh
13 May 2013, 12:18 PM
Yes. That example seems to be saving all column state information correctly.

slemmon
13 May 2013, 3:50 PM
You may have to peek at the source on that example and see if it's different from what you're doing in your own app code.

Dennis.Gearmesh
13 May 2013, 11:33 PM
In that example, the only configurations on the grid are

stateful: true,
stateId: 'stateGridExample',
xtype: 'grid',
store: {...},
columns: {...}

I have both the stateful and the stateId configurations defined in all my grids.
The example uses ext-all.js. I'm using ext-all-dev.js.
The example uses the Neptune theme. I'm using the default Ext JS css.

I don't know what else there is to look at. It's obviously not my browser, because that example works fine.

Thanks

slemmon
14 May 2013, 3:20 PM
Can you provide a test case to show the issue by chance?

And how are you setting up your state provider? Like this:
Ext.state.Manager.setProvider(Ext.create('Ext.state.CookieProvider'));

Dennis.Gearmesh
15 May 2013, 8:39 AM
Here's how I'm setting up my state provider:


Ext.state.Manager.setProvider(new Ext.state.CookieProvider({
expires: new Date(new Date().getTime() + (1000*60*60*24*31)) //31 days from now
}));

I will work on an example.

Dennis.Gearmesh
15 May 2013, 9:46 AM
I can't reproduce the problem in a new project, so it must be something in my current project. Thanks for the example link, it was very helpful in getting this far. I'll let you know if I find out what's causing the problem.

Thanks!

Dennis.Gearmesh
2 Jul 2013, 11:25 AM
aha...

I found that I needed to define a stateId for each column. Once I did that, everything worked. I previously thought that giving the grid a stateId would do what I needed.

Thanks!

Dennis