View Full Version : Can't get GridPanel to expand vertically, scroll horizontally

Ian Grainger
2 Jun 2009, 9:27 AM
I would like to create a table that dynamically sizes vertically but not horizontally. I know a lot of people have asked similar questions, but I have searched through the forums, and this seems like a pretty simple question, so:

Here's what I've done:

1) Started with the demo 'array grid', here: http://extjs.com/deploy/dev/examples/grid/array-grid.html (http://extjs.com/forum/../deploy/dev/examples/grid/array-grid.html). (downloaded it to my machine)
2) In array-grid.js, added 'autoHeight: true' and removed height specification (looked ok, height was changed - but didn't need scrollbars at this point)
3) Set 'width: 100' (too small - it crushes all the columns up, and doesn't let them scroll)
4) Set 'viewConfig: {forceFit: false}' (saw this on the forums, but still no scrollbar).

The config of the GridPanel from that demo I'm left with is:

var grid = new Ext.grid.GridPanel({
store: <same as before>,
columns: <same as before>,
stripeRows: true,
//autoExpandColumn: 'company',
autoHeight: true,
width: 100,
viewConfig: { forceFit: false },
title:'Array Grid'

Please help, what am I missing??

2 Jun 2009, 9:54 AM
autoHeight true and scrolling do not work due to issues with some browsers.

Ian Grainger
3 Jun 2009, 12:10 AM
(unhappy face)

We're going to be paying for ExtJS licenses. How can we suggest someone looks at fixing/patching this feature?

3 Jun 2009, 12:30 AM
Size it!

And please don't use those emoticons. They got tiresome a long while ago

Ian Grainger
3 Jun 2009, 12:40 AM
Emoticons removed.

The table sits within a set of other fields (textboxes, checkboxes etc), and may be any height. Obviously this would work if I could set an explicit height and width.

I guess my options are:

Add it to a panel and use the scrolling on that
Write my own sizing code.

3 Jun 2009, 12:50 AM
There must be some kind of rules on what height you need it to be?

Ian Grainger
3 Jun 2009, 12:58 AM
Sorry, to be clearer: this table will sit in a parent panel along with all the other fields, and that one is scrollable. I have seen lots of people being told off for nesting grids too deep and expecting them to work - so I guess this is another one of those type of problems.

3 Jun 2009, 1:02 AM
You just need to give the Panel some kind of height to scroll in.

If it's a FormPanel (or some kind of Panel that uses AnchorLayout), you cuold have ist width managed by the anchor config

Ian Grainger
3 Jun 2009, 1:39 AM
It's in a 'Panel' with autoScroll: true and layout: 'form' (this is then within a tabpanel, but I doubt that matters).

I'm afraid I don't quite follow what you're suggesting. I'm not familiar with Anchors, I'm afraid - Do you suggest that I anchor the right and left of the grid, and that should make it scrollable? Or I fit it within an AnchorLayout panel?

Sorry to be a bit slow. I had a look at the help for AnchorLayout, but what I'm looking for didn't leap out.

3 Jun 2009, 1:45 AM
Yes, to manage the width, you use the anchor config on a child Component to anchor it to the margins in various ways.

As for the height, it's probably best if you just choose a height to display.

A FormPanel uses FormLayout which extends AnchorLayout, so you would get help from http://extjs.com/deploy/ext-3.0-rc2/docs/?class=Ext.layout.AnchorLayout

3 Jun 2009, 4:47 AM
(unhappy face)

We're going to be paying for ExtJS licenses. How can we suggest someone looks at fixing/patching this feature?

Please - no dangling carrots for fixes.

Ian Grainger
5 Jun 2009, 3:10 AM
In the end I took your first suggestion, Animal, and I've made the table a set height. Where can I put a feature request for this?

5 Jun 2009, 3:32 AM
Perhaps a thread in general discussion?

Ian Grainger
5 Jun 2009, 3:52 AM
Please - no dangling carrots for fixes.
I just read this. I meant we're going to buy it anyway, so was wondering how we get our feature request in. I've made a thread on general discussion, here: http://extjs.com/forum/showthread.php?p=338831.