/*==================================================================
* 通用网格工具栏示例
*===================================================================
* 说明:此工具栏包含了常用的 新增,删除,打印,导出 等按钮和搜索框;
* 本示例包括:工具栏初始化,自定义属性,自定义方法,自定义事件等关键技术点
* 用法:
* 1.创建GridToolBar实例
* #参数:指定Store 用于搜索框搜索数据
* var gridToolBar = new Ext.nRelax.GridToolBar({ store: store });
* 2.onDelete事件,点击删除按钮时触发
* gridToolBar.on('onDelete', doDelete);
*====================================================================
*/ //定义命名空间
Ext.ns('Ext.nRelax'); Ext.nRelax.GridToolBar = function (cfg) {
Ext.nRelax.GridToolBar.superclass.constructor.call(this, {
id: 'tool_bar',
cls: 'top-toolbar',
items: [{
id: "add",
text: "新增",
iconCls: "silk-add" },
{ id: "del",
text: "删除",
iconCls: "silk-delete",
disabled: "true",
handler: doDelete }, "-",
{ id: "print",
xtype: "splitbutton",
iconCls: "silk-printer",
text: "打印" }, "-",
{ id: "expore",
xtype: "splitbutton",
text: "导出" }, "->",
new Ext.ux.form.SearchField({ store: this.store, width: 220 }),
{ xtype: "tbspacer"}] }); //自定义事件
this.addEvents("onDelete"); //自定义方法
this.test = function () { alert('测试自定义方法'); } //自定义属性
this.buttonDel = this.findById("del");
this.buttonAdd = this.findById("add");
this.buttonPrint = this.findById("print");
this.buttonExport = this.findById("expore"); };
doDelete = function () { //这里不能直接用This因为这里的This指删除按钮,可以用this.id测试
//触发事件
this.ownerCt.fireEvent("onDelete"); } //继承父控件
Ext.extend(Ext.nRelax.GridToolBar, Ext.Toolbar); //第一个参数为自定义控件的
xtype Ext.reg('gridtoolbar', Ext.nRelax.GridToolBar);
转载地址:http://www.haogongju.net/art/615697