View Full Version : Border Layout Grid Panel resizing issue

23 Feb 2011, 11:02 AM
I have a grid panel as the "north" region of my border layout.

new Ext.grid.GridPanel({


However, i'd like to customize the behavior of this a bit more and can't seem to get it to work just right.
Things I'd like to make happen:

When the datastore loads new data (store.load()), i'd like the grid panel to resize to display this data. Currently, it maintains the same size and I have to adjust the height manually (by split panel resize) in order to view it.
Set a max-height in the grid panel that will activate vertical scroll bars when exceeded.
Set a min-height in the grid panel that will display blank space when not enough records are present.

Any suggestions as to how I can implement these display features?

24 Feb 2011, 7:58 AM
From the store 'load' event or the 'viewready' event you can check how high the grid body actually is. If you add all the padding (titles etc.) to that you can use that value set call setHeight on the north panel.

24 Feb 2011, 9:08 AM
I actually started down that road of computing the size myself. However, I realized that if I resize some of the other panels in the border-layout (by grabbing the split-bar and moving it), it correctly computes the grid size and updates the height automatically. I figured there must be some sort of function that it is using under the covers to quickly compute the size, so was hoping I could take advantage of that code already written. If I have to attached it manually to the load event, that's fine.

And would the border-layout abide by the min and max-style definitions?

24 Feb 2011, 11:27 PM
Unfortunately, the min and max height are for the splitter only. You will have to factor in these limits in your height calculation.

It sound like you configured your grid with autoHeight:true. You can't do that, because it disables scrolling (which you want when the grid is > max height).

25 Feb 2011, 8:53 AM
A splitter may be what I want. I have a grid showing records up top (the north), and a panel below (the center) showing each records details. When the record above gets clicked, it displays details below. Since the details are the focal point, I want to use the max height of the grid to ensure that the display panel has enough space if the grid/record count gets big.

I also have a west panel (with a splitter) showing some meta data. This is the splitter that I can currently grab and drag that causes the grid to auto-resize to the number of records. And yes, I am using autoHeight -> true. And that makes sense to disable. I forgot I have that set (it's not in my grid config, so slipped my mind), and that would explain why my height definitions aren't having any effect.