PDA

View Full Version : Resizable columns with custom header container?



da_b0uncer
15 May 2013, 1:33 AM
I extended Ext.grid.header.Container to add some custom functionality for the column headers.

But even when I don't add this functionality and make a simple extend, the column configs don't work right.

I see the columns and the data bindings are all okay, but stuff like "resizeable: true" doesn't make the columns resizeable.

If I insert the same config array in "columns" of the grid panel, it works.
If I insert the config array in "items" of the header container, it doesn't.

mitchellsimoens
17 May 2013, 6:25 AM
If I insert the config array in "items" of the header container, it doesn't.

What do you mean by this? Can I see the code?

da_b0uncer
17 May 2013, 6:59 AM
Ext.grid.header.Container expects an "items" config parameter:

(http://docs.sencha.com/extjs/4.1.1/#!/api/Ext.panel.Header)http://docs.sencha.com/extjs/4.1.1/#!/api/Ext.grid.header.Container-cfg-items
(http://docs.sencha.com/extjs/4.1.1/#!/api/Ext.grid.header.Container-cfg-items)
Ext.grid.Panel expects a "columns" config parameter, which can also be a Ext.grid.header.Container:

http://docs.sencha.com/extjs/4.1.1/#!/api/Ext.grid.Panel-cfg-columns

So I tried to convert something like this:


var oTablePanel = Ext.create( 'Ext.grid.Panel', {
store : oStore,
columns : aoColumns
} );


To something like this:

var oHeaderContainer = Ext.create( 'Ext.grid.header.Container', {
items: aoColumns
} );

var oTablePanel = Ext.create( 'Ext.grid.Panel', {
store : oStore,
columns : oHeaderContainer
} );


aoColumns is the always the same, an array of config objects with some column xtypes.

In the first version a "resizable: true" options in the column config works.
In the second version all columns remain "resizeable: false"