扩展/自定义 Extjs.Toolbar 组件

来源:互联网 发布:c语言读取dat文件内容 编辑:程序博客网 时间:2024/05/21 14:34
/*==================================================================*                     通用网格工具栏示例*===================================================================* 说明:此工具栏包含了常用的 新增,删除,打印,导出 等按钮和搜索框;
*      本示例包括:工具栏初始化,自定义属性,自定义方法,自定义事件等关键技术点* 用法:* 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);//第一个参数为自定义控件的xtypeExt.reg('gridtoolbar', Ext.nRelax.GridToolBar); 
原创粉丝点击