转自:http://blog.sina.com.cn/s/blog_454fbf740100t0xj.html
在应用程序的制作中,我们经常性的会用到工具栏,在Extjs中Panel中提供了tbar和bbar两个内置的工具栏,极大的方便了大家的使用,但是在创建多行工具栏的时候,就会有一些问题产生了,不能正常的显示已经设计好的页面。下面通过对Panel的render事件的监听,在它被渲染的时候添加多条工具栏,这样就不会影响页面的显示了。这一方法对Panel,FormPanel,GridPanel都适用。具体代码如下:
|
另一个方法,设置EditorGridPanel中两个tbar:
Ext.onReady(function(){
var grid = new Ext.grid.EditorGridPanel({
store : ds,
cm : cm,
width : 688,
height : 300,
selModel : new Ext.grid.RowSelectionModel(),
autoScroll : true,
stripeRows : true,
enableColumnMove : false,
clicksToEdit : 1,
tbar : ['->', {
xtype : 'button',
text : '添加',
iconCls : 'icon-add',
handler : function() {}))
}
}, '-', {
xtype : 'button',
text : '删除',
iconCls : 'icon-delete',
handler : function() {}
}, ' '],
listeners : {
'render' : function() {
var tbar1 = new Ext.Toolbar(['->', {
text : "设置",
iconCls : 'icon-set',
handler : function() {
}
}, ' ']);
tbar1.render(grid.tbar);
}
}
});
});