Why will my ExtJS tab will not show items with a border layout

Question

As of right now I have a working tab panel in my website, and when I perform an action a tab gets added to the tabpanel. Right now the tab renders all the items correctly with the following items definition

    return [{
        xtype: 'panel',
        region: 'north',
        autoHeight: true,
        items: this.buildToolbar()
    }, {
        xtype: 'panel',
        region: 'center',
        autoHeight: true,
        items: [{
            xtype: 'fieldset',
            title: 'Details:',
            collapsible: true,
            autoHeight: true,
            items: [this.detailForm]
        }]
    }];

However, I now want to add an eastern collapsible panel to this tab only, so in the panel's config I added layout: 'border',. Now nothing is rendered inside of my tab. If I then comment out my layout call, everything renders fine.

Why does nothing render when this panel is set to be a border layout?

Answer 1

Remove autoHeight: true (at every level -- don't ever use this inside a BorderLayout) and add layout: 'fit' to your center region. Also, not sure that adding a form into your fieldset is what you want -- probably the other way around would make more sense.