Viewport + regions - Recalculate layout

[strickjb]

I have a viewport setup w/ 3 regions - north, south, center.

In the north region, I have a panel (xtype: 'commoninfo') that has a form being populated via an AJAX call. Any fields that have empty values are hidden (w/ display: none).

By the time the form is populated, the viewport + descendants have all rendered so that when I hide fields in the 'commoninfo' panel - it screws up the look (aka a nasty gap between north/center regions).

Is there a way to recalculate the viewport after I've made changes to a containing panel?

I've tried Ext.getCmp('viewport').doLayout();


Ext.create('Ext.container.Viewport', {
id: 'viewport',
layout: 'border',
defaults: {
bodyPadding: 15
},
items: [{
xtype: 'container',
region: 'north',
border: false,
items: [{
xtype: 'wheader',
bodyPadding: '15 15 15 80',
border: false
}, {
xtype: 'navigation',
border: false
}, {
xtype: 'commoninfo',
bodyPadding: 15,
bodyStyle: 'border: none; border-bottom: solid 1px #99BCE8;'
}]
}, {
xtype: 'notes',
region: 'south',
collapsible: true
}, {
xtype: 'content',
region: 'center',
items: { xtype: 'filecab' }
}]
});

Disclaimer: I'm pretty new to ExtJS but proficient w/ JavaScript. Don't go easy on me.

[mitchellsimoens]

Please post in the appropriate forum. I have moved this thread to the Ext JS 4 Q&A forum for you.

[friend]

I noticed that you didn't declare a layout for the container in the north region of the Viewport. This means that the container will default to layout 'auto', where the docs state:


AutoLayout provides only a passthrough of any layout calls to any child containers.

This leads me to believe that the inital render/layout is all that happens, with no further resize handling after you've hidden the desired fields. Trying experimenting with a 'vbox' layout on the north container and check your child components (wheader, navigation, comminfo) for valid layouts as well (assuming that they're based on some sort of container/panel).

On a related note, Viewports seem to be happiest with a declared height for the north and south regions, where the center region is expected to auto-fill the remaining space.

Hope that helps.

[strickjb]

That was the problem, I didn't specify a layout on the northern container. It's still not quite right but I think it will come around after tweaking it a few times.

Thanks for pointing me in the right direction!