Upgrade to ExtJS 4.0.0 - Released 04/26/2011

[extjs.git] / examples / ux / form / SearchField.js

diff --git a/examples/ux/form/SearchField.js b/examples/ux/form/SearchField.js
new file mode 100644 (file)
index 0000000..f74ab77
--- /dev/null
+++ b/examples/ux/form/SearchField.js
@@ -0,0 +1,61 @@
+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();
+    }
+});
\ No newline at end of file