PDA

View Full Version : Help with Viewport + FormPanel + TreePanel



kirkgo
4 Mar 2010, 5:56 AM
I'm buiding a new application using Rails with ExtJS. This is my first application using ExtJS.
My application use viewport to manage the many elements like forms, tabpanel, toolbar, etc.

At this time, I try to building a nested viewport. But I had some problems with this. I try to nested a form panel and tree panel at my viewport region west. At this region (north), I had more two regions nested: north and center. In this case, the north nested region contain the form panel and the center region contain the treepanel. But when I set the layout of north region (super) to border, my form panel hidde. How I fix this? Perhaps I made some thing wrong or I don't understand the right way to use nested viewport.

Follow the code of my viewport:

var viewport = new Ext.Viewport({
layout: 'border',
renderTo: Ext.getBody(),
items: [{
region: 'north',
xtype: 'toolbar',
height: 27,
items: [
{
xtype: 'tbbutton',
text: 'INÍCIO'
},{
xtype: 'tbseparator'
},{
xtype: 'tbbutton',
text: 'LANÇAMENTOS'
},{
xtype: 'tbseparator'
},{
xtype: 'tbbutton',
text: 'AUTORIZADOS'
},{
xtype: 'tbfill'
}
]
},{
region: 'west',
title: 'FILTRO',
layout: 'border',
border: false,
width: 200,
split: true,
collapsible: true,
items: [
{
region: 'north',
layout: 'form',
frame: true,
labelWidth: 50,
items: [
{
xtype: 'textfield',
fieldLabel: 'Visão'
},{
xtype: 'textfield',
fieldLabel: 'De'
},{
xtype: 'textfield',
fieldLabel: 'até'
}
]
},{
region: 'center',
title: 'EMPRESAS',
xtype: 'treepanel',
width: 200,
autoScroll: true,
loader: new Ext.tree.TreeLoader({
dataUrl: '/treepanel'
}),
root: new Ext.tree.AsyncTreeNode({
text:'Cotril',
expanded: false
}),
rootVisible: true
}
]
},{
region: 'center',
xtype: 'panel',
html: 'Conteúdo'
},{
region: 'south',
xtype: 'panel',
frame: true,
html: 'Todos os direitos reservados.'
}]
});

Thanks ALL!

ckr
4 Mar 2010, 6:04 AM
be sure to give north/south regions height, and east/west regions width.

kirkgo
4 Mar 2010, 6:11 AM
be sure to give north/south regions height, and east/west regions width.

Man, you are my hero! I forget this litle detail.

Thanks!