PDA

View Full Version : [FIXED] ExtJS 4.1.3 - Bug with Ext.Grid.Panel Reconfigure Function



joshua.ball@osi.com
8 Apr 2013, 8:34 AM
Hello All,

I've come across some behavior with the reconfigure function that is repeatable and unexpected. In the following example, if grid columns do not have any widths initially they render misaligned. Sort indicators and state keeping is also ignored. I've also noticed that columns sporadically lay out with the order incorrect.

Please see this thread for a history of this bug (worked with jsakalos):

http://www.sencha.com/forum/showthread.php?260403-ExtJS-4.1.3-Possible-Bug-with-Ext.Grid.Panel

Thanks,


* EDITED BY SLEMMON


var gridData = [
[{
id: 1,
text: 'Item 1',
type: 'a'
}, {
id: 2,
text: 'Item 2',
type: 'c'
}, {
id: 3,
text: 'Item 3',
type: 'b'
}, {
id: 4,
text: 'Item 4',
type: 'b'
}, {
id: 5,
text: 'Item 5',
type: 'a'
}, {
id: 6,
text: 'Item 6',
type: 'b'
}, {
id: 7,
text: 'Item 7',
type: 'c'
}, {
id: 8,
text: 'Item 8',
type: 'a'
}, {
id: 9,
text: 'Item 9',
type: 'c'
}, {
id: 10,
text: 'Item 10',
type: 'b'
}
],
[{
id: 1,
city: 'New York',
country: 'U.S.A.'
}, {
id: 2,
city: 'London',
country: 'United Kingdom'
}, {
id: 3,
city: 'Sydney',
country: 'Australia'
}, {
id: 4,
city: 'Los Angeles',
country: 'U.S.A.'
}, {
id: 5,
city: 'Melbourne',
country: 'Australia'
}, {
id: 6,
city: 'Montreal',
country: 'Canada'
}, {
id: 7,
city: 'Paris',
country: 'France'
}, {
id: 8,
city: 'Nice',
country: 'France'
}, {
id: 9,
city: 'Rome',
country: 'Italy'
}, {
id: 10,
city: 'Liverpool',
country: 'United Kingdom'
}
]
];


fields = [
['id', 'text', 'type'],
['id', 'city', 'country']
];
sorters = [
[{
property: 'type',
direction: 'ASC'
}
],
[{
property: 'country',
direction: 'DESC'
}
]
];
// working
// ,gridColumns = [[
// {header:'Item', dataIndex:'text', flex:1},{header:'Type', dataIndex:'type'}
// ],[
// {header:'City', dataIndex:'city', flex:1},{header:'Country', dataIndex:'country'}
// ]]
// misaligned columns and header


gridColumns = [
[{
header: 'Item',
dataIndex: 'text'
}, {
header: 'Type',
dataIndex: 'type'
}
],
[{
header: 'City',
dataIndex: 'city'
}, {
header: 'Country',
dataIndex: 'country'
}
]
];
rIndex = 0;
stores = [];
g = Ext.create('Ext.grid.Panel', {
title: 'Grid reconfigure',
forceFit: true,
renderTo: Ext.getBody(),
width: 300,
height: 400,
columns: [],
stateful: true,
stateId: 'grid',
viewConfig: {
emptyText: 'No records found. Click Reconfigure button.',
deferEmptyText: false
},
tbar: [{
text: 'Reconfigure',
handler: function () {
if (!stores[rIndex]) {
stores[rIndex] = Ext.create('Ext.data.Store', {
fields: fields[rIndex],
data: gridData[rIndex],
sorters: sorters[rIndex]
});
}
this.up('gridpanel').reconfigure(stores[rIndex], gridColumns[rIndex]);
rIndex = rIndex === 0 ? 1 : 0;
}
}
]
});

joshua.ball@osi.com
8 Apr 2013, 10:52 AM
Need to add to this. After a reconfigure, the "columns" option of the grid header's context menu shows all columns checked (meaning that they should be visible). I unchecked all columns except for a single one and triggered a reconfigure. After that, I looked at the "columns" option of the grid header's context menu and found that all columns were still checked even though only a single column should be visible.

If possible, I'd like to request that this bug fix be expedited as I don't have a workaround for this issue.

Thanks!

-Josh

slemmon
8 Apr 2013, 11:51 AM
Thanks for the report! I have opened a bug in our bug tracker.

joshua.ball@osi.com
10 Apr 2013, 9:01 AM
NP, and thanks for the acknowledgement!

evant
10 Apr 2013, 1:06 PM
The problem is because of forceFit, it's a legacy config we've kept that doesn't really gel with the current layout system. The simplest workaround is to manually refresh the view after reconfiguring.

joshua.ball@osi.com
11 Apr 2013, 8:03 AM
Thanks Evan! My workaround involved reloading the store, but this will be much less costly.