examples/ux/SearchField.js

   1 /*!
   2  * Ext JS Library 3.3.1
   3  * Copyright(c) 2006-2010 Sencha Inc.
   4  * licensing@sencha.com
   5  * http://www.sencha.com/license
   6  */
   7 Ext.ns('Ext.ux.form');
   8
   9 Ext.ux.form.SearchField = Ext.extend(Ext.form.TwinTriggerField, {
  10     initComponent : function(){
  11         Ext.ux.form.SearchField.superclass.initComponent.call(this);
  12         this.on('specialkey', function(f, e){
  13             if(e.getKey() == e.ENTER){
  14                 this.onTrigger2Click();
  15             }
  16         }, this);
  17     },
  18
  19     validationEvent:false,
  20     validateOnBlur:false,
  21     trigger1Class:'x-form-clear-trigger',
  22     trigger2Class:'x-form-search-trigger',
  23     hideTrigger1:true,
  24     width:180,
  25     hasSearch : false,
  26     paramName : 'query',
  27
  28     onTrigger1Click : function(){
  29         if(this.hasSearch){
  30             this.el.dom.value = '';
  31             var o = {start: 0};
  32             this.store.baseParams = this.store.baseParams || {};
  33             this.store.baseParams[this.paramName] = '';
  34             this.store.reload({params:o});
  35             this.triggers[0].hide();
  36             this.hasSearch = false;
  37         }
  38     },
  39
  40     onTrigger2Click : function(){
  41         var v = this.getRawValue();
  42         if(v.length < 1){
  43             this.onTrigger1Click();
  44             return;
  45         }
  46         var o = {start: 0};
  47         this.store.baseParams = this.store.baseParams || {};
  48         this.store.baseParams[this.paramName] = v;
  49         this.store.reload({params:o});
  50         this.hasSearch = true;
  51         this.triggers[0].show();
  52     }
  53 });