[solved] GridPanel / Grid doesn't resize columns on window resize

When you use the split bar handles to resize the layout, that's not a 'layout' event, but a ContentPanel's or a Region's resized / resize (I don't know why the one letter difference).

Since I have no horizontal split bars in my layout, I didn't notice this. Try to attach autoSizeColumns() on one of those and see how it turns out.

'layout' Is the correct event but not fires when I want.

Code:

---

view.autoSizeColumns.defer(100);

---

Not solved the problem for me.

Any ideas?

What do you mean by not firing when you want?

The 'layout' will fire when a layout redraw happens, I guess. Since the grid columns can only loose their fitting on window or panel resize, you doesn't have too much other possibilities to resize them, but on this event, since panel's resize events doesn't monitor window changes.

Sorry my English is bad.

'layout' event OK. But the problem continues for me. The grid not autoSizeColumns when I want (After 'layout' event) and defer not works for me.

Can you post your code (Only the autoSize lines).

Thanks in advance,

I see. Here's the code, it's very simple:

[CODE]
init: function() {
innerLayout = new Ext.BorderLayout( 'product-grid', {
center: { split: true, collapsible: false, titlebar: false, tabPosition: 'top', alwaysShowTabs: true, closeOnTab: true, hideWhenEmpty: true },
east: { initialSize: 250, split: true, collapsible: true, titlebar: true, hideWhenEmpty: true }
});

// load the grid
this.loadGrid();

// add grid and preview pane into inner layout
g_panel = new Ext.GridPanel( pg, { autoCreate: true, fitToFrame: true, title: 'B

Sorry for my bad English.

I have this application model:

http://extjs.com/forum/attachment.ph...4&d=1176397306

The principal layout with head and left menu and each content load into a tab (iframe).

Whe I expand/collapse the left menu panel my grid not autosizecolumns correctly.

Provisionally I put autosizeColumns in grid "click" event and works fine.

I a tab (iframe) that loads grid, I put this code:

Code:

---

window.parent.layout.addListener('layout', pp)

---

layout is the global variable of principal layout and pp is your function. The event fires OK, but grid not autosizeColumns correctly. Why? When collapse left menu the autosize not works correctly, but when expand left panel the size of columns has a extra width (should be a size of collapse state), posible defer problem??

You tried to attach the autoSizeColumns() to the left (west?) region's proper events?

Like,

Code:

---


r_west = yourLayout.getRegion('west');
r_west.on('resized', pp);
r_west.on('collapsed', pp);
r_west.on('expanded', pp);

---

the best way, that works is use this code

Code:

---

ds.on('load', function(){ grid.getView().autoSizeColumns();} );

---

Thank you for posting this. I spend an hour looking for the answer before I found this post. I just couldn't get the resize event to fire on the NestedLayoutPanel. I appreciate it!!

Hello I have the same problem! it has been a long time, but today I found a similar problem when changing the size of my window did not update the size of the columns in my gridAttachment 33837

I found a solution:

Code:

---

//win is the window and I added the event "resize" when I update the size
win.on('resize', function() {
    var grid = Ext.getCmp('grid_geocode'); //this is my grid             
    if(grid != undefined){
      grid.getView().refresh(); //refresh updated the size of columns to new size
    }
});

---

I hope you understand, my english is not good.

Regards!!