область действия кнопки extjs

Я пытаюсь понять область действия в приведенном ниже сценарии. При вызове searchTerms this под scope:this относится к функции searchTerms, а не к самой панели. Кажется, это отличается от того, что я наблюдаю на других примерах. Могу ли я узнать, какие ошибки я сделал?

function searchTerms(){
       var searchGrid = new Ext.grid.GridPanel({

        });

        var searchPanel = new Ext.form.FormPanel({
            region: 'south',
            height:150,
            items:[
            {
                xtype: 'textfield',
                fieldLabel: 'Keywords',
            },{
                xtype: 'textfield',
                fieldLabel: 'Label',
            },{
                xtype: 'datefield',
                fieldLabel: 'Valid till'
            },new Ext.Button({
                text: 'crawl',
                scope: this,
                handler: function(b,e){
                    Ext.Ajax.request({^M
                        url: '/discovery/tsearch',^M
                        params: {^M
                            keywords: this.items[0].getValue(),
                            label: this.items[1].getValue(),
                            valid: this.items[2].getValue(),
                        },
                    });
                }
            }),],
        });

        var regionPanel = new Ext.Panel({
            title: 'search',
            layout: 'border',
            items: [searchPanel, searchGrid]
        });

    return regionPanel;
}

javascript extjs extjs3
person goh    schedule 21.12.2011    source источник

Ответы (1)


arrow_upward
5
arrow_downward

Я думаю, вы хотели сделать это:

function searchTerms(){
   var searchGrid = new Ext.grid.GridPanel({

    });

    var searchPanel = new Ext.form.FormPanel({
        region: 'south',
        height:150,
        items:[
        {
            xtype: 'textfield',
            fieldLabel: 'Keywords',
        },{
            xtype: 'textfield',
            fieldLabel: 'Label',
        },{
            xtype: 'datefield',
            fieldLabel: 'Valid till'
        }],
    });
    searchPanel.add(new Ext.Button({
            text: 'crawl',
            scope: searchPanel,
            handler: function(b,e){
                Ext.Ajax.request({
                    url: '/discovery/tsearch',
                    params: {
                        keywords: this.items[0].getValue(),
                        label: this.items[1].getValue(),
                        valid: this.items[2].getValue(),
                    },
                });
            }
        })
    );
    var regionPanel = new Ext.Panel({
        title: 'search',
        layout: 'border',
        items: [searchPanel, searchGrid]
    });

return regionPanel;
}
person RageZ    schedule 21.12.2011
comment
Это проблема области видимости, «это» будет объектом searchTerm, когда вы создаете кнопку, а не searchPanel, вы должны думать о счете, когда код будет выполняться впервые, а не когда наступит событие. - person RageZ; 21.12.2011
comment
Разница в том, что кнопка добавляется в панель поиска, а область действия устанавливается в панель поиска. Чтобы иметь возможность установить область для searchPanel, сначала нужно определить searchPanel, что невозможно, когда вы создаете кнопку inline внутри searchPanel. Имеет ли это смысл? - person Chau; 21.12.2011
comment
@Chau: да, это имеет смысл, поэтому мне пришлось использовать add, если вы хотите сделать это встроенным, я думаю, вы должны получить ссылку на searchPanel с помощью parentContainer или с помощью некоторого идентификатора и getCmp - person RageZ; 21.12.2011
comment
@RageZ: комментарий предназначался не вам :) Я никогда не думал об использовании эталонной функции, такой как getCmp, но она действительно может работать. - person Chau; 21.12.2011
comment
хм @RageZ Я немного запутался из-за этой статьи. sencha.com/learn/legacy/ Позвольте мне уточнить, 'this' для примера ссылки определяется только тогда, когда вызывается функция объекта, следовательно, сам объект. Принимая во внимание, что в моем случае «это» определяется во время создания объекта, следовательно, оно относится к объекту searchTerm.... - person goh; 21.12.2011
comment
Если вы когда-либо использовали getCmp, вы организовывали свое приложение ExtJS абсолютно на 1000% НЕПРАВИЛЬНО - person Dexygen; 21.12.2011