浏览 1701 次
|
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
最后更新时间：2008-03-06
刚刚接触Ext2，在做一个Panel嵌套Panel的时候发现子Panel无法显示，在Javaeye上找到一篇文章说是将parent的autoHeight设置为true可以解决，在我的代码上子panel倒是显示了，但是没有按照父panel要求的布局来排列，请教有经验的xdjm帮帮忙，代码如下：
html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Typing Test System beta 1.0</title>
<link rel="stylesheet" type="text/css" href="lib/ext/resources/css/ext-all.css" />
<script type="text/javascript" src="lib/ext/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="lib/ext/ext-all.js"></script>
<!-- Common Styles for the examples -->
<script type="text/javascript" src="main.js"></script>
<style type="text/css">
.user-img {
background-image:url( /images/115.bmp )
}
.logo-img { background-image:url( images/qq.ico ) !important;}
</style>
</head>
<body>
<button id='win'>win</button>
</body>
</html>
JS代码
/*
* Ext JS Library 2.0
* Copyright(c) 2006-2007, Ext JS, LLC.
* licensing@extjs.com
*
* http://extjs.com/license
*/
Ext.BLANK_IMAGE_URL = "lib/ext/resources/images/default/s.gif";
Ext.onReady(function(){
var btn = Ext.get('win');
btn.on('click',function(){
var win = new Ext.Window({
id:'main-win',
title:"QQ2008",
iconCls:'logo-img',
layout: 'border',
width:220,
height:440,
animCollapse:true,
constrainHeader:true,
border:false,
maximizable:true,
minimizable:true,
items:[
/* personal information */
//这个子panel的内容无法显示
{
xtype:'panel',
region:'north',
items:[{title:'west',region:'west'},{title:'center', region:'center'},{title:'east', region:'east'}]
},
/* main func panel */
new Ext.TabPanel({
activeTab:0,
region:'center',
tabPosition:'bottom',
items:[{
title: 'tab1',
html:'<p>tab1</p>',
header:false,
border:false
},{
title:'tab1',
html:'<p>tab1</p>',
header:false,
border:false
}]
}),
/* settings panel */
{title:'foot', region:'south'}
]
});
win.show();
});
});
声明：JavaEye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
|
| 返回顶楼 | |
|
最后更新时间：2008-03-06
试着加入height:300 配置项
|
| 返回顶楼 | |
|
最后更新时间：2008-03-06
你这个Window的north区域写得不对，给一段改好的代码 {
xtype:'panel',
region:'north',
height:80,
layout:'border',
items:[{title:'west',region:'west',width:20},{title:'center', region:'center'},{title:'east', region:'east',width:30}]
},
|
| 返回顶楼 | |
|
最后更新时间：2008-03-06
我也遇到嵌套的问题，在ff下是可以的，但在ie就不能显示报错：下面是我的代码，
Ext.onReady(function(){
var centerHtml = new Ext.Panel({
region: 'center',
title: "面板头部header",
hideBorders:false,
html:'<iframe name="html_frame" frameborder=0 width="100%" height="100%" ="6px" marginwidth="6px"></iframe>'
});
var root1=new Ext.tree.TreeNode({
id:"root",
text:"根节点"});
var ContextPath = Ext.get('Ext-ContextPath').dom.value;
root1.appendChild(new Ext.tree.TreeNode({
id:"c11",
href: ContextPath+'/portlet_action/system_admin/OrgNav/render',
efTarget: "html_frame",
text:"角色管理"
}));
root1.appendChild(new Ext.tree.TreeNode({
id:"c12",
href: ContextPath+'/portlet_action/system_admin/PortletNav/render',
hrefTarget: "html_frame",
text:"Portlet管理"
}));
var navTree=new Ext.tree.TreePanel({
root:root1,
region: 'west',
title: '导航条',
rootVisible: false,
lines:true,
autoScroll:true,
width:100
});
new Ext.Panel({
renderTo:"main",
header:false,
height:400,
hideBorders:false,
layout: 'border',
items: [navTree, centerHtml]
});
});
|
| 返回顶楼 | |
|
最后更新时间：2008-03-07
我在用Panel时一般在html中加上div，然后Panel配置上el或者renderTo
|
| 返回顶楼 | |
|
最后更新时间：2008-03-07
wiwika 写道 我在用Panel时一般在html中加上div，然后Panel配置上el或者renderTo
你是讲替换这行 items: [navTree, centerHtml] 试试 |
| 返回顶楼 | |
|
最后更新时间：2008-03-07
sp42 写道 试着加入height:300 配置项
测试发现还是存在问题，加入了height配置子panel可以显示出来，不过没有按照设定的那样，west显示在north的位置，而east现实在south的位置.... |
| 返回顶楼 | |
|
最后更新时间：2008-03-07
stworthy 写道 你这个Window的north区域写得不对，给一段改好的代码 {
xtype:'panel',
region:'north',
height:80,
layout:'border',
items:[{title:'west',region:'west',width:20},{title:'center', region:'center'},{title:'east', region:'east',width:30}]
},
|
| 返回顶楼 | |
