ok, here's an almost-working example:
The main panel (DetailsContainer) below extends a Panel and has a limited vertical area.
This main panel will have a couple children panel (which will get rendered as tabs).
One of these child tabs (let's call it Tab-A) needs to have it's own children - multiple panels, laid out as an accordion. These children get loaded into Tab-A via xtemplate/dataview. Tab-A needs employ a scrollbar to display it's contents if there are too many children and this height extends behind the vertical contraint of the main tab. Sounds pretty simple, right?
I can't get it to work for a tabpanel, however I do have it working fine for a regular panel which I have below. I need the same behavior/etc for a tabpanel as the DetailsContainer.
Code:
Ext.define('DP.view.DetailsContainer', {
extend: 'Ext.Panel', //needs to be a tabpanel here
alias: 'widget.DetailsContainer',
title: 'Details Container (contains more panels - varying height, all derived via xtemplate',
// margins:'5 0 5 5',
height: 150,
autoScroll: true,
items: [
{
items:[
{
xtype: 'container',
layout: 'accordion',
items: [{
title: 'first',
flex: 1,
html: 'this is first<br>more content'
},
{
title: 'second',
flex: 1,
html: 'this is a 2nd panel<br>more content<br>and more content'
},
{
title: 'third',
flex: 2,
html: 'this is a 3rd panel'
},
{
title: 'fourth',
flex: 1,
html: 'this is a 4th panel<br>more content again'
},
{
title: 'fifth',
flex: 2,
html: 'this is a 5th panel'
},
{
title: 'sixth',
flex: 1,
html: 'this is a 6th panel'
},
{
title: 'seventh',
flex: 2,
html: 'this is a 7th panel'
}
]
}
]
}
]
});
Ext.create('DP.view.DetailsContainer', {
renderTo: Ext.getBody()
});
Reply With Quote
or when I expand one of the child panels and a scrollbar (bringing even more need for a scrollbar in the parent panel). Let's say for instance I have 20 child panels instead of the 8 or so shown below. Or if I expand on a child and need more vertical area to display it. In either case I'd like a scrollbar to appear as part of the Filters tab.
