SearchField events??

[romerve]

Hello,

I am working on this MVC app that uses the ux SearchField. I can render it find and get some results, etc. However, i am trying to make my app more within the "ExtJS MVC" standards and i am having some issues trying to listen for the SearchField events in my controller.

ux SearchField:

/*


This file is part of Ext JS 4


Copyright (c) 2011 Sencha Inc


Contact:  http://www.sencha.com/contact


GNU General Public License Usage
This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file.  Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html.


If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact.


*/
Ext.define('Ext.ux.form.SearchField', {
    extend: 'Ext.form.field.Trigger',
    
    alias: 'widget.searchfield',
    
    trigger1Cls: Ext.baseCSSPrefix + 'form-clear-trigger',
    
    trigger2Cls: Ext.baseCSSPrefix + 'form-search-trigger',
    
    hasSearch : false,
    paramName : 'query',
    
    initComponent: function(){
        this.callParent(arguments);
        this.on('specialkey', function(f, e){
            if(e.getKey() == e.ENTER){
                this.onTrigger2Click();
            }
        }, this);
    },
    
    afterRender: function(){
        this.callParent();
        this.triggerEl.item(0).setDisplayed('none');  
    },
    
    onTrigger1Click : function(){
        var me = this,
            store = me.store,
            proxy = store.getProxy(),
            val;
            
        if (me.hasSearch) {
            me.setValue('');
            proxy.extraParams[me.paramName] = '';
            proxy.extraParams.start = 0;
            store.load();
            me.hasSearch = false;
            me.triggerEl.item(0).setDisplayed('none');
            me.doComponentLayout();
        }
    },


    onTrigger2Click : function(){
        var me = this,
            store = me.store,
            proxy = store.getProxy(),
            value = me.getValue();
            
        if (value.length < 1) {
            me.onTrigger1Click();
            return;
        }
        proxy.extraParams[me.paramName] = value;
        proxy.extraParams.start = 0;
        store.load();
        me.hasSearch = true;
        me.triggerEl.item(0).setDisplayed('block');
        me.doComponentLayout();
    }
});

My controller:

init: function() {
        
        this.control({
            '#quesearch': {
                specialkey: this.myTest
            }
        })        
    },

Now, i wanna listen for the ENTER key event and the search icon and clear icon click events. I have examined the object in the console and the events do not list any click events whatsoever...

Any ideas?

Thanks

[romerve]

Ok,

so it seems that the "onTriggerNClick" are not being exposed to the controller's this.control.

In order to get the trigger click events i have to manually fire the events using "this.fireEvent('triggerNClick')"


Thanks.