docs/source/SearchField.html

   1 <html>
   2 <head>
   3   <title>The source code</title>
   4     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
   5     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
   6 </head>
   7 <body  onload="prettyPrint();">
   8     <pre class="prettyprint lang-js">Ext.ns('Ext.ux.form');\r
   9 \r
  10 Ext.ux.form.SearchField = Ext.extend(Ext.form.TwinTriggerField, {\r
  11     initComponent : function(){\r
  12         Ext.ux.form.SearchField.superclass.initComponent.call(this);\r
  13         this.on('specialkey', function(f, e){\r
  14             if(e.getKey() == e.ENTER){\r
  15                 this.onTrigger2Click();\r
  16             }\r
  17         }, this);\r
  18     },\r
  19 \r
  20     validationEvent:false,\r
  21     validateOnBlur:false,\r
  22     trigger1Class:'x-form-clear-trigger',\r
  23     trigger2Class:'x-form-search-trigger',\r
  24     hideTrigger1:true,\r
  25     width:180,\r
  26     hasSearch : false,\r
  27     paramName : 'query',\r
  28 \r
  29     onTrigger1Click : function(){\r
  30         if(this.hasSearch){\r
  31             this.el.dom.value = '';\r
  32             var o = {start: 0};\r
  33             this.store.baseParams = this.store.baseParams || {};\r
  34             this.store.baseParams[this.paramName] = '';\r
  35             this.store.reload({params:o});\r
  36             this.triggers[0].hide();\r
  37             this.hasSearch = false;\r
  38         }\r
  39     },\r
  40 \r
  41     onTrigger2Click : function(){\r
  42         var v = this.getRawValue();\r
  43         if(v.length < 1){\r
  44             this.onTrigger1Click();\r
  45             return;\r
  46         }\r
  47         var o = {start: 0};\r
  48         this.store.baseParams = this.store.baseParams || {};\r
  49         this.store.baseParams[this.paramName] = v;\r
  50         this.store.reload({params:o});\r
  51         this.hasSearch = true;\r
  52         this.triggers[0].show();\r
  53     }\r
  54 });</pre>
  55 </body>
  56 </html>