View Full Version : Form in tab panel not shown, grid has no scrollbars

26 Nov 2007, 4:01 AM
What I'm trying to do is to create a tab panel with a border layout on it including a form in north region and a grid in center region. There are two problems:

1) The form panel is not shown. Debugging with FireBug shows that the upper left corner of the grid panel is equal the one of the form panel, so the form seems to be there but is underlaying the grid.

2) The grid panel has no scrollbars. Adding autoScroll:true to the tab panel shows an empty panel, but no error occurs.

Here's the code:

var someForm = new Ext.FormPanel({
region: 'north',
autoHeight: true,
labelWidth: 40,
title: 'some form',
defaults: {width: 230},
items: [ ... some date fields ... ],

var grid = new Ext.grid.GridPanel({
region: 'center',
store: ds,
view: new Ext.grid.GroupingView({
hideGroupedColumn: true,
showGroupName: false,
autoWidth: true,
trackMouseOver: true,
plugins: [ new Ext.grid.GroupSummary() ],
colModel: columnModel,
autoExpandColumn: 'name',
loadMask: true

var tabPanel = new Ext.TabPanel({
el: 'tabs_container',
activeTab: 0,
height: 600,
defaults:{autoHeight: true},
layout: 'border',
title: 'Main Tab',
autoHeight: true,
items: [

Searching the forum shows that there are some people having similar problems with form panel within a tab panel but I found no solutions for the problem.

Does anybody see what i am doing wrong?

26 Nov 2007, 7:06 AM
Meanwhile I found that after a resize to a smaller window as well the form as the scrollbars appear. Resizing to a bigger window everything disappears. :-?

Any ideas? :s

26 Nov 2007, 8:22 AM
Try giving your North region a height.

26 Nov 2007, 8:27 AM
Thanks for reply!

I already gave the form in the north region a height but it doesn't made any difference. Or do you mean something different?

26 Nov 2007, 9:34 AM
Once again it seems there is aproblem with border layout. Changing it to anchor layout works fine. No idea, why? And the scrollbars of the grid won't appear anyway. Not even after resizing the window. Same behaviour in Safari.I'm near to desperate on this ... :((

27 Nov 2007, 1:57 AM
I have the same problem,I have been finding the solution but I failed.

27 Nov 2007, 3:49 AM
I'm having problems just like this with FormPanel + GridPanel within tabs.

27 Nov 2007, 5:14 AM
Can you try giving the GridPanel a height and remove autoHeight ? Faced the same problem for scrollbars

27 Nov 2007, 5:28 AM
Whoops! I really thought I've already tried that. :D
That fixed it. Of course autoHeight would be more convenient but for now ...

Thanks a lot! ;)