PDA

View Full Version : How can autoHeight work for a Panel?



aladdinwang
17 May 2010, 12:38 AM
I set a panel's autoHeight property to be true.
But this lead to panel body hidden entirely. The effect are same with IE7, firefox, opera.
But if a assign a fixed height to the panel, this will work.

Problem is, fixed height solution is fine with ff and opera, but not good with ie.


Code are here.




var contentPanel = new Gcp.ui.MainPanel({
//title: tpl.apply(data),
width: 600,
autoHeight: true,
//height: 192,
layout: 'vbox',
renderTo: Ext.get('target'),
layoutConfig: {
align: 'stretch',
pack: 'start'
},
titleTpl: new Ext.XTemplate([
'<div id="content">',
'<p id="left">My Global Continuity Profile</p>',
'<p id="right">{name} | <a href="#help">Help</a></p>',
'<p id="modified_date">Last Modified: {date}</p></div>'
]),
data: {
name: 'Barraon, John H',
date: 'May 03, 2010 14:00'
}

});

Animal
17 May 2010, 1:43 AM
What's all the "layout" stuff doing in there? You have no child Components in there to lay out!

Auto height works for me with this test on the Firebug console command line:



Ext.getBody().update('');
new Ext.Panel({
title: 'Test',
width: 600,
autoHeight: true,
renderTo: document.body,
tpl: new Ext.XTemplate(
'<div id="content">',
'<p id="left">My Global Continuity Profile</p>',
'<p id="right">{name} | <a href="#help">Help</a></p>',
'<p id="modified_date">Last Modified: {date}</p></div>'
),
data: {
name: 'Barraon, John H',
date: 'May 03, 2010 14:00'
}
});

aladdinwang
17 May 2010, 3:48 AM
Hi, Animal.

the whole codes are here:
http://erxz.com/pb/25415 (http://erxz.com/pb/25414)

This include whole html page, javascript codes for MainPanel, style.

aladdinwang
17 May 2010, 6:36 PM
push this thread to the first page :D

aladdinwang
18 May 2010, 3:29 AM
Can anybody help me? :)