从事件处理程序调用对象函数

时间:2012-10-29 15:35:52

标签: javascript extjs

我得到"未捕获的ReferenceError:未定义searchPerson"在下面的代码中。

如何拨打" searchPerson"来自" onTriggerClick"事件处理程序?

Ext.define('App.view.search.Base', {
extend: 'Ext.window.Window',
layout: 'vbox',
items:[
    {
        xtype: 'container',
        height:30,
        layout: 'hbox',
        width: '100%',
        items: [
            comboChoice= Ext.create('Ext.form.ComboBox', {
                width: 150,
                padding: '0 20 0 0'
            }),
            edPerson= Ext.create('Ext.form.field.Trigger', {
                triggerCls: 'x-form-search-trigger',
                flex: 1,
                onTriggerClick: function() {

                    **searchPerson(); //it does not work this way**

                }
            })
        ]
    },
    {
        xtype: 'grid',
        flex: 1,
        width: '100%',
        columns: [
            { text: 'Name',  dataIndex: 'name' },
            { text: 'Email', dataIndex: 'email', flex: 1 },
            { text: 'Phone', dataIndex: 'phone' }
        ]
    }
],
searchPerson: function() {
    alert('done!');
}
});

2 个答案:

答案 0 :(得分:0)

我必须访问顶级容器(App.view.search.Base),这是我想要的对象。 所以,首先我为这个对象添加一个别名:

Ext.define('App.view.search.Base', {
  extend: 'Ext.window.Window',
  layout: 'vbox',
  alias: 'widget.searchbase',

第二,在事件处理程序中访问此对象:

this.up('searchbase').searchPerson(this);

答案 1 :(得分:0)

最好这样做,所以你不必依赖任意查询:

Ext.define('App.view.search.Base', {
    extend: 'Ext.window.Window',
    layout: 'vbox',

    initComponent: function() {
        this.items = [{
            xtype: 'container',
            height: 30,
            layout: 'hbox',
            width: '100%',
            items: [Ext.create('Ext.form.ComboBox', {
                width: 150,
                padding: '0 20 0 0'
            }), Ext.create('Ext.form.field.Trigger', {
                triggerCls: 'x-form-search-trigger',
                flex: 1,
                onTriggerClick: Ext.Function.bind(this.searchPerson, this)
            })]
        }, {
            xtype: 'grid',
            flex: 1,
            width: '100%',
            columns: [{
                text: 'Name',
                dataIndex: 'name'
            }, {
                text: 'Email',
                dataIndex: 'email',
                flex: 1
            }, {
                text: 'Phone',
                dataIndex: 'phone'
            }]
        }];
        this.callParent();
    },

    searchPerson: function() {
        alert('done!');
    }
});