PDA

View Full Version : How to make the container fit it's component's size after component added



wzl002
15 Nov 2011, 8:18 PM
Hi,
As the 'autoHeight' is no longer available, I got a question when render a form.
I have a simple viewpoint with 'column' layout, it's items just like this:



items: [{
id: 'menuColumn',
xtype: 'container',
columnWidth: 0.8,
height: 800,
layout: 'anchor',
items: [{
id: "formContainer",
xtype: 'panel',
title: 'myForm',
collapsible: true,
animCollapse: false,
anchor: '100%',
html: 'click menu first ...'
height: 50
}]



After a click event, it will add a formPanel into the 'formContainer' panel,
Because I don't know how much the form's height will be(the number of fields is depends on the click event), I must reset the 'formContainer' panel's height after formPanel be rendered.


My code is like this

var reportForm = createReportForm();
var container = Ext.getCmp('formContainer');
container.add(reportForm);
container.setHeight(reportForm.getHeight());


But reportForm.getHeight() does not work, just get very small number.
How can I get the form's real height? Is there some good solution for this?

tvanzoelen
16 Nov 2011, 12:14 AM
Try to set height after the add (on container) or activate (on form) event is fired?

wzl002
16 Nov 2011, 1:09 AM
Try to set height after the add (on container) or activate (on form) event is fired?
Thank you very much for your reply.
But, my problem is not How/When to reset the container height but How much px I should set.
It will get a suitable height for the formpanel when use a DIV renderTo, but now a container can't get a auto height for the form.
How can get the automatic and suitable height for the form?


ps: As your suggest, I tryed form.getHeight() in the listeners, a el undefined error occur as was expected.

tvanzoelen
16 Nov 2011, 1:13 AM
If you get an el is undefined error the Form is not rendered and then there is no height available. Try the event afterrender. Then you must have a height.

wzl002
17 Nov 2011, 5:33 PM
If you get an el is undefined error the Form is not rendered and then there is no height available. Try the event afterrender. Then you must have a height.
Thanks for your answer.
I know the reason for the el error, but if I just render the Form with " container.add(reportForm); ", The height I got is just as the container's height, like 80px, it's too small to show the form.