docs/source/NumericFilter.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"><div id="cls-Ext.ux.grid.filter.NumericFilter"></div>/** \r
   9  * @class Ext.ux.grid.filter.NumericFilter\r
  10  * @extends Ext.ux.grid.filter.Filter\r
  11  * Filters using an Ext.ux.menu.RangeMenu.\r
  12  * <p><b><u>Example Usage:</u></b></p>\r
  13  * <pre><code>    \r
  14 var filters = new Ext.ux.grid.GridFilters({\r
  15     ...\r
  16     filters: [{\r
  17         type: 'numeric',\r
  18         dataIndex: 'price'\r
  19     }]\r
  20 });\r
  21  * </code></pre> \r
  22  */\r
  23 Ext.ux.grid.filter.NumericFilter = Ext.extend(Ext.ux.grid.filter.Filter, {\r
  24 \r
  25     <div id="cfg-Ext.ux.grid.filter.NumericFilter-fieldCls"></div>/**\r
  26      * @cfg {Object} fieldCls\r
  27      * The Class to use to construct each field item within this menu\r
  28      * Defaults to:<pre>\r
  29      * fieldCls : Ext.form.NumberField\r
  30      * </pre>\r
  31      */\r
  32     fieldCls : Ext.form.NumberField,\r
  33     <div id="cfg-Ext.ux.grid.filter.NumericFilter-fieldCfg"></div>/**\r
  34      * @cfg {Object} fieldCfg\r
  35      * The default configuration options for any field item unless superseded\r
  36      * by the <code>{@link #fields}</code> configuration.\r
  37      * Defaults to:<pre>\r
  38      * fieldCfg : {}\r
  39      * </pre>\r
  40      * Example usage:\r
  41      * <pre><code>\r
  42 fieldCfg : {\r
  43     width: 150,\r
  44 },\r
  45      * </code></pre>\r
  46      */\r
  47     <div id="cfg-Ext.ux.grid.filter.NumericFilter-fields"></div>/**\r
  48      * @cfg {Object} fields\r
  49      * The field items may be configured individually\r
  50      * Defaults to <tt>undefined</tt>.\r
  51      * Example usage:\r
  52      * <pre><code>\r
  53 fields : {\r
  54     gt: { // override fieldCfg options\r
  55         width: 200,\r
  56         fieldCls: Ext.ux.form.CustomNumberField // to override default {@link #fieldCls}\r
  57     }\r
  58 },\r
  59      * </code></pre>\r
  60      */\r
  61     <div id="cfg-Ext.ux.grid.filter.NumericFilter-iconCls"></div>/**\r
  62      * @cfg {Object} iconCls\r
  63      * The iconCls to be applied to each comparator field item.\r
  64      * Defaults to:<pre>\r
  65 iconCls : {\r
  66     gt : 'ux-rangemenu-gt',\r
  67     lt : 'ux-rangemenu-lt',\r
  68     eq : 'ux-rangemenu-eq'\r
  69 }\r
  70      * </pre>\r
  71      */\r
  72     iconCls : {\r
  73         gt : 'ux-rangemenu-gt',\r
  74         lt : 'ux-rangemenu-lt',\r
  75         eq : 'ux-rangemenu-eq'\r
  76     },\r
  77 \r
  78     <div id="cfg-Ext.ux.grid.filter.NumericFilter-menuItemCfgs"></div>/**\r
  79      * @cfg {Object} menuItemCfgs\r
  80      * Default configuration options for each menu item\r
  81      * Defaults to:<pre>\r
  82 menuItemCfgs : {\r
  83     emptyText: 'Enter Filter Text...',\r
  84     selectOnFocus: true,\r
  85     width: 125\r
  86 }\r
  87      * </pre>\r
  88      */\r
  89     menuItemCfgs : {\r
  90         emptyText: 'Enter Filter Text...',\r
  91         selectOnFocus: true,\r
  92         width: 125\r
  93     },\r
  94 \r
  95     <div id="cfg-Ext.ux.grid.filter.NumericFilter-menuItems"></div>/**\r
  96      * @cfg {Array} menuItems\r
  97      * The items to be shown in this menu.  Items are added to the menu\r
  98      * according to their position within this array. Defaults to:<pre>\r
  99      * menuItems : ['lt','gt','-','eq']\r
 100      * </pre>\r
 101      */\r
 102     menuItems : ['lt', 'gt', '-', 'eq'],\r
 103 \r
 104     /**  \r
 105      * @private\r
 106      * Template method that is to initialize the filter and install required menu items.\r
 107      */\r
 108     init : function (config) {\r
 109         // if a menu already existed, do clean up first\r
 110         if (this.menu){\r
 111             this.menu.destroy();\r
 112         }        \r
 113         this.menu = new Ext.ux.menu.RangeMenu(Ext.apply(config, {\r
 114             // pass along filter configs to the menu\r
 115             fieldCfg : this.fieldCfg || {},\r
 116             fieldCls : this.fieldCls,\r
 117             fields : this.fields || {},\r
 118             iconCls: this.iconCls,\r
 119             menuItemCfgs: this.menuItemCfgs,\r
 120             menuItems: this.menuItems,\r
 121             updateBuffer: this.updateBuffer\r
 122         }));\r
 123         // relay the event fired by the menu\r
 124         this.menu.on('update', this.fireUpdate, this);\r
 125     },\r
 126     \r
 127     /**\r
 128      * @private\r
 129      * Template method that is to get and return the value of the filter.\r
 130      * @return {String} The value of this filter\r
 131      */\r
 132     getValue : function () {\r
 133         return this.menu.getValue();\r
 134     },\r
 135 \r
 136     /**\r
 137      * @private\r
 138      * Template method that is to set the value of the filter.\r
 139      * @param {Object} value The value to set the filter\r
 140      */ \r
 141     setValue : function (value) {\r
 142         this.menu.setValue(value);\r
 143     },\r
 144 \r
 145     /**\r
 146      * @private\r
 147      * Template method that is to return <tt>true</tt> if the filter\r
 148      * has enough configuration information to be activated.\r
 149      * @return {Boolean}\r
 150      */\r
 151     isActivatable : function () {\r
 152         var values = this.getValue();\r
 153         for (key in values) {\r
 154             if (values[key] !== undefined) {\r
 155                 return true;\r
 156             }\r
 157         }\r
 158         return false;\r
 159     },\r
 160     \r
 161     /**\r
 162      * @private\r
 163      * Template method that is to get and return serialized filter data for\r
 164      * transmission to the server.\r
 165      * @return {Object/Array} An object or collection of objects containing\r
 166      * key value pairs representing the current configuration of the filter.\r
 167      */\r
 168     getSerialArgs : function () {\r
 169         var key,\r
 170             args = [],\r
 171             values = this.menu.getValue();\r
 172         for (key in values) {\r
 173             args.push({\r
 174                 type: 'numeric',\r
 175                 comparison: key,\r
 176                 value: values[key]\r
 177             });\r
 178         }\r
 179         return args;\r
 180     },\r
 181 \r
 182     <div id="method-Ext.ux.grid.filter.NumericFilter-validateRecord"></div>/**\r
 183      * Template method that is to validate the provided Ext.data.Record\r
 184      * against the filters configuration.\r
 185      * @param {Ext.data.Record} record The record to validate\r
 186      * @return {Boolean} true if the record is valid within the bounds\r
 187      * of the filter, false otherwise.\r
 188      */\r
 189     validateRecord : function (record) {\r
 190         var val = record.get(this.dataIndex),\r
 191             values = this.getValue();\r
 192         if (values.eq !== undefined && val != values.eq) {\r
 193             return false;\r
 194         }\r
 195         if (values.lt !== undefined && val >= values.lt) {\r
 196             return false;\r
 197         }\r
 198         if (values.gt !== undefined && val <= values.gt) {\r
 199             return false;\r
 200         }\r
 201         return true;\r
 202     }\r
 203 });</pre>
 204 </body>
 205 </html>