为Ext panel中增加多个tbar展示两种方式:
方法一:
通过render
var subPanel = new Ext.Panel({
title:'测试',
tbar:[{text:'一个按钮'},{}],
bbar:[{xtype:'tbsplit',text'测试'},{}],
listeners:{
'render' : function() {
var bbar1 = new Ext.Toolbar([{
text : "脚本管理",
//iconCls : 'icon-set',
handler : function() {
}
}]);
bbar1.render(subPanel.tbar);
}
}
});
方法二:
利用数组型:
<script type="text/javascript">
Ext.onReady(function(){
var oneTbar = new Ext.Toolbar({
items: ['开始时间',{
xtype:'datefield',
id : 'startDate',
editable:false,
height:20,
format:'Y-m-d'
},{
text:'清空',
handler:function(){
Ext.getCmp("startDate").setValue("");
}
}]
});
var twoTbar = new Ext.Toolbar({
items: ['结束时间',{
xtype:'datefield',
id : 'endDate',
editable:false,
height:20,
format:'Y-m-d'
},{
text:'清空',
handler:function(){
Ext.getCmp("endDate").setValue("");
}
}]
});
var w = new Ext.Window({
title:"消息",
width:520,
height:500,
layout: "anchor",
buttonAlign:"center",
tbar:{
xtype: 'container',
items: [oneTbar,twoTbar]
},
bbar: {
xtype: 'container',
items: [oneTbar,twoTbar]
}
});
w.show();
});
</script>
通过以上方式可以在自己设计panel中增加多个tbar或者bbar工具条。