/ext-4.1.0_b3/docs/extjs/examples/ux/form/SearchField.js

 1Ext.define('Ext.ux.form.SearchField', {
 2    extend: 'Ext.form.field.Trigger',
 3    
 4    alias: 'widget.searchfield',
 5    
 6    trigger1Cls: Ext.baseCSSPrefix + 'form-clear-trigger',
 7    
 8    trigger2Cls: Ext.baseCSSPrefix + 'form-search-trigger',
 9    
10    hasSearch : false,
11    paramName : 'query',
12    
13    initComponent: function(){
14        this.callParent(arguments);
15        this.on('specialkey', function(f, e){
16            if(e.getKey() == e.ENTER){
17                this.onTrigger2Click();
18            }
19        }, this);
20    },
21    
22    afterRender: function(){
23        this.callParent();
24        this.triggerCell.item(0).setDisplayed(false);
25    },
26    
27    onTrigger1Click : function(){
28        var me = this,
29            store = me.store,
30            proxy = store.getProxy(),
31            val;
32            
33        if (me.hasSearch) {
34            me.setValue('');
35            proxy.extraParams[me.paramName] = '';
36            store.loadPage(1);
37            me.hasSearch = false;
38            me.triggerCell.item(0).setDisplayed(false);
39            me.doComponentLayout();
40        }
41    },
42
43    onTrigger2Click : function(){
44        var me = this,
45            store = me.store,
46            proxy = store.getProxy(),
47            value = me.getValue();
48            
49        if (value.length < 1) {
50            me.onTrigger1Click();
51            return;
52        }
53        proxy.extraParams[me.paramName] = value;
54        store.loadPage(1);
55        me.hasSearch = true;
56        me.triggerCell.item(0).setDisplayed(true);
57        me.doComponentLayout();
58    }
59});