Question

用extjs写布局显示不出来

我就在网上弄得布局

<link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" />
<script type="text/javascript" src="extjs/ext-all.js"></script>
<script>
var pnSub1=new Ext.Panel({
height:300,
columnWidth:.3,
html:'这是子panle1'
});
var pnSub2=new Ext.Panel({
height:300,
columnWidth:.7,
html:'这是子panle2'
});
var pn=new Ext.Panel({
id:'pn',
title:'父Panel',
renderTo:'divPanel',
width:800,
height:300,
layout:'column',
items:[
pnSub1,
pnSub2
]
});
</script>
</head>

Answer 1

<script type="text/javascript" >
Ext.onReady(function(){
var pp=new Ext.TabPanel({
id:'tabpanel',
title:document.title+"报表查看",
width: window.document.body.clientWidth * 1.00,
height:window.document.body.clientHeight *1.00,
renderTo:document.body,
activeTab:0,
items: [getPanel1(),getPanel2(),{
'id':'Tel_Import',
'title':'配置',
closable:false, //通过html载入目标页
html:'<iframe scrolling="auto" frameborder="0" width="100%" height="100%" src="ConfigAdd/Tel_Import.jsp"></iframe>'
}]
});
function getPanel1(){
var chtml="<iframe frameborder='0' src='Page/GetDataPage.jsp' ";
chtml+="style='border:1px solid double;width:100%;height:100%' width='100%' height='100%'></iframe>";
var pp=new Ext.Panel({
'id':'GetDataPage','title':'获取',
html:chtml
});
return pp;
}
function getPanel2(){
var chtml="<iframe frameborder='0' src='Page/GetDataPage.jsp' ";
chtml+="style='border:1px solid double;width:100%;height:100%' width='100%' height='100%'></iframe>";
var pp=new Ext.Panel({
'id':'GetDataPage','title':'获取',
html:chtml
});
return pp;
}
});