git.roojs.org Git - roojs1/blob - docs/symbols/src/Roo_bootstrap_Input.js.html

   1 <html><head><title>../roojs1/Roo/bootstrap/Input.js</title><link rel="stylesheet" type="text/css" href="../../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
   2  * - LGPL
   3  *
   4  * Input
   5  *
   6  */
   7
   8 /**
   9  * @class Roo.bootstrap.Input
  10  * @extends Roo.bootstrap.Component
  11  * Bootstrap Input class
  12  * @cfg {Boolean} disabled is it disabled
  13  * @cfg {String} fieldLabel - the label associated
  14  * @cfg {String} inputType button | checkbox | email | file | hidden | image | number | password | radio | range | reset | search | submit | text
  15  * @cfg {String} name name of the input
  16  * @cfg {string} fieldLabel - the label associated
  17  * @cfg {string}  inputType - input / file submit ...
  18  * @cfg {string} placeholder - placeholder to put in text.
  19  * @cfg {string}  before - input group add on before
  20  * @cfg {string} after - input group add on after
  21  * @cfg {string} size - (lg|sm) or leave empty..
  22  * @cfg {Number} xs colspan out of 12 for mobile-sized screens
  23  * @cfg {Number} sm colspan out of 12 for tablet-sized screens
  24  * @cfg {Number} md colspan out of 12 for computer-sized screens
  25  * @cfg {Number} lg colspan out of 12 for large computer-sized screens
  26  * @cfg {string} value default value of the input
  27  * @cfg {Number} labelWidth set the width of label (0-12)
  28  * @cfg {String} labelAlign (top|left)
  29  * @cfg {Boolean} readOnly Specifies that the field should be read-only
  30  * @cfg {String} autocomplete - default is new-password see: https://developers.google.com/web/fundamentals/input/form/label-and-name-inputs?hl=en
  31
  32  * @cfg {String} align (left|center|right) Default left
  33  *
  34  *
  35  *
  36  * @constructor
  37  * Create a new Input
  38  * @param {Object} config The config object
  39  */
  40
  41 </span><span class="jsdoc-var">Roo.bootstrap.Input </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
  42     </span><span class="jsdoc-var">Roo.bootstrap.Input.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
  43
  44         </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
  45             </span><span class="jsdoc-comment">/**
  46              * @event focus
  47              * Fires when this field receives input focus.
  48              * @param {Roo.form.Field} this
  49              */
  50             </span><span class="jsdoc-var">focus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  51             </span><span class="jsdoc-comment">/**
  52              * @event blur
  53              * Fires when this field loses input focus.
  54              * @param {Roo.form.Field} this
  55              */
  56             </span><span class="jsdoc-var">blur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  57             </span><span class="jsdoc-comment">/**
  58              * @event specialkey
  59              * Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check
  60              * {@link Roo.EventObject#getKey} to determine which key was pressed.
  61              * @param {Roo.form.Field} this
  62              * @param {Roo.EventObject} e The event object
  63              */
  64             </span><span class="jsdoc-var">specialkey </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  65             </span><span class="jsdoc-comment">/**
  66              * @event change
  67              * Fires just before the field blurs if the field value has changed.
  68              * @param {Roo.form.Field} this
  69              * @param {Mixed} newValue The new value
  70              * @param {Mixed} oldValue The original value
  71              */
  72             </span><span class="jsdoc-var">change </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  73             </span><span class="jsdoc-comment">/**
  74              * @event invalid
  75              * Fires after the field has been marked as invalid.
  76              * @param {Roo.form.Field} this
  77              * @param {String} msg The validation message
  78              */
  79             </span><span class="jsdoc-var">invalid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  80             </span><span class="jsdoc-comment">/**
  81              * @event valid
  82              * Fires after the field has been validated with no errors.
  83              * @param {Roo.form.Field} this
  84              */
  85             </span><span class="jsdoc-var">valid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  86              </span><span class="jsdoc-comment">/**
  87              * @event keyup
  88              * Fires after the key up
  89              * @param {Roo.form.Field} this
  90              * @param {Roo.EventObject}  e The event Object
  91              */
  92             </span><span class="jsdoc-var">keyup </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
  93         </span><span class="jsdoc-syntax">});
  94 };
  95
  96 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.bootstrap.Input</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.bootstrap.Component</span><span class="jsdoc-syntax">,  {
  97      </span><span class="jsdoc-comment">/**
  98      * @cfg {String/Boolean} validationEvent The event that should initiate field validation. Set to false to disable
  99       automatic validation (defaults to &quot;keyup&quot;).
 100      */
 101     </span><span class="jsdoc-var">validationEvent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;keyup&quot;</span><span class="jsdoc-syntax">,
 102      </span><span class="jsdoc-comment">/**
 103      * @cfg {Boolean} validateOnBlur Whether the field should validate when it loses focus (defaults to true).
 104      */
 105     </span><span class="jsdoc-var">validateOnBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 106     </span><span class="jsdoc-comment">/**
 107      * @cfg {Number} validationDelay The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)
 108      */
 109     </span><span class="jsdoc-var">validationDelay </span><span class="jsdoc-syntax">: 250,
 110      </span><span class="jsdoc-comment">/**
 111      * @cfg {String} focusClass The CSS class to use when the field receives focus (defaults to &quot;x-form-focus&quot;)
 112      */
 113     </span><span class="jsdoc-var">focusClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;x-form-focus&quot;</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-comment">// not needed???
 114
 115
 116     /**
 117      * @cfg {String} invalidClass The CSS class to use when marking a field invalid (defaults to &quot;x-form-invalid&quot;)
 118      */
 119     </span><span class="jsdoc-var">invalidClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;has-warning&quot;</span><span class="jsdoc-syntax">,
 120
 121     </span><span class="jsdoc-comment">/**
 122      * @cfg {String} validClass The CSS class to use when marking a field valid (defaults to &quot;x-form-invalid&quot;)
 123      */
 124     </span><span class="jsdoc-var">validClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;has-success&quot;</span><span class="jsdoc-syntax">,
 125
 126     </span><span class="jsdoc-comment">/**
 127      * @cfg {String} hasFeedback default false
 128      */
 129     </span><span class="jsdoc-var">hasFeedback </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 130
 131     </span><span class="jsdoc-comment">/**
 132      * @cfg {String} invalidFeedbackIcon The CSS class to use when create feedback icon (defaults to &quot;x-form-invalid&quot;)
 133      */
 134     </span><span class="jsdoc-var">invalidFeedbackIcon </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;glyphicon-warning-sign&quot;</span><span class="jsdoc-syntax">,
 135
 136     </span><span class="jsdoc-comment">/**
 137      * @cfg {String} validFeedbackIcon The CSS class to use when create feedback icon (defaults to &quot;x-form-invalid&quot;)
 138      */
 139     </span><span class="jsdoc-var">validFeedbackIcon </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;glyphicon-ok&quot;</span><span class="jsdoc-syntax">,
 140
 141     </span><span class="jsdoc-comment">/**
 142      * @cfg {Boolean} selectOnFocus True to automatically select any existing field text when the field receives input focus (defaults to false)
 143      */
 144     </span><span class="jsdoc-var">selectOnFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 145
 146      </span><span class="jsdoc-comment">/**
 147      * @cfg {String} maskRe An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)
 148      */
 149     </span><span class="jsdoc-var">maskRe </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 150        </span><span class="jsdoc-comment">/**
 151      * @cfg {String} vtype A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)
 152      */
 153     </span><span class="jsdoc-var">vtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 154
 155       </span><span class="jsdoc-comment">/**
 156      * @cfg {Boolean} disableKeyFilter True to disable input keystroke filtering (defaults to false)
 157      */
 158     </span><span class="jsdoc-var">disableKeyFilter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 159
 160        </span><span class="jsdoc-comment">/**
 161      * @cfg {Boolean} disabled True to disable the field (defaults to false).
 162      */
 163     </span><span class="jsdoc-var">disabled </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 164      </span><span class="jsdoc-comment">/**
 165      * @cfg {Boolean} allowBlank False to validate that the value length &gt; 0 (defaults to true)
 166      */
 167     </span><span class="jsdoc-var">allowBlank </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 168     </span><span class="jsdoc-comment">/**
 169      * @cfg {String} blankText Error text to display if the allow blank validation fails (defaults to &quot;This field is required&quot;)
 170      */
 171     </span><span class="jsdoc-var">blankText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;This field is required&quot;</span><span class="jsdoc-syntax">,
 172
 173      </span><span class="jsdoc-comment">/**
 174      * @cfg {Number} minLength Minimum input field length required (defaults to 0)
 175      */
 176     </span><span class="jsdoc-var">minLength </span><span class="jsdoc-syntax">: 0,
 177     </span><span class="jsdoc-comment">/**
 178      * @cfg {Number} maxLength Maximum input field length allowed (defaults to Number.MAX_VALUE)
 179      */
 180     </span><span class="jsdoc-var">maxLength </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Number.MAX_VALUE</span><span class="jsdoc-syntax">,
 181     </span><span class="jsdoc-comment">/**
 182      * @cfg {String} minLengthText Error text to display if the minimum length validation fails (defaults to &quot;The minimum length for this field is {minLength}&quot;)
 183      */
 184     </span><span class="jsdoc-var">minLengthText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;The minimum length for this field is {0}&quot;</span><span class="jsdoc-syntax">,
 185     </span><span class="jsdoc-comment">/**
 186      * @cfg {String} maxLengthText Error text to display if the maximum length validation fails (defaults to &quot;The maximum length for this field is {maxLength}&quot;)
 187      */
 188     </span><span class="jsdoc-var">maxLengthText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;The maximum length for this field is {0}&quot;</span><span class="jsdoc-syntax">,
 189
 190
 191     </span><span class="jsdoc-comment">/**
 192      * @cfg {Function} validator A custom validation function to be called during field validation (defaults to null).
 193      * If available, this function will be called only after the basic validators all return true, and will be passed the
 194      * current field value and expected to return boolean true if the value is valid or a string error message if invalid.
 195      */
 196     </span><span class="jsdoc-var">validator </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 197     </span><span class="jsdoc-comment">/**
 198      * @cfg {RegExp} regex A JavaScript RegExp object to be tested against the field value during validation (defaults to null).
 199      * If available, this regex will be evaluated only after the basic validators all return true, and will be passed the
 200      * current field value.  If the test fails, the field will be marked invalid using {@link #regexText}.
 201      */
 202     </span><span class="jsdoc-var">regex </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
 203     </span><span class="jsdoc-comment">/**
 204      * @cfg {String} regexText The error text to display if {@link #regex} is used and the test fails during validation (defaults to &quot;&quot;)
 205      */
 206     </span><span class="jsdoc-var">regexText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">,
 207
 208     </span><span class="jsdoc-var">autocomplete</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 209
 210
 211     </span><span class="jsdoc-var">fieldLabel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 212     </span><span class="jsdoc-var">inputType </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'text'</span><span class="jsdoc-syntax">,
 213
 214     </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 215     </span><span class="jsdoc-var">placeholder</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 216     </span><span class="jsdoc-var">before </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 217     </span><span class="jsdoc-var">after </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 218     </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 219     </span><span class="jsdoc-comment">// private
 220     </span><span class="jsdoc-var">hasFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 221     </span><span class="jsdoc-var">preventMark</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 222     </span><span class="jsdoc-var">isFormField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 223     </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 224     </span><span class="jsdoc-var">labelWidth </span><span class="jsdoc-syntax">: 2,
 225     </span><span class="jsdoc-var">labelAlign </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 226     </span><span class="jsdoc-var">readOnly </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 227     </span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 228     </span><span class="jsdoc-var">formatedValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 229
 230     </span><span class="jsdoc-var">parentLabelAlign </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 231     {
 232         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">parent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 233         </span><span class="jsdoc-keyword">while </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parent.parent</span><span class="jsdoc-syntax">()) {
 234             </span><span class="jsdoc-var">parent </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">parent.parent</span><span class="jsdoc-syntax">();
 235             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">parent.labelAlign</span><span class="jsdoc-syntax">) !=</span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
 236                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">parent.labelAlign</span><span class="jsdoc-syntax">;
 237             }
 238         }
 239         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-string">'left'</span><span class="jsdoc-syntax">;
 240
 241     },
 242
 243     </span><span class="jsdoc-var">getAutoCreate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 244
 245         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">= (!</span><span class="jsdoc-var">this.labelAlign</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.parentLabelAlign</span><span class="jsdoc-syntax">() : </span><span class="jsdoc-var">this.labelAlign</span><span class="jsdoc-syntax">;
 246
 247         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.id</span><span class="jsdoc-syntax">();
 248
 249         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= {};
 250
 251         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.inputType </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'hidden'</span><span class="jsdoc-syntax">){
 252             </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'form-group' </span><span class="jsdoc-comment">//input-group
 253         </span><span class="jsdoc-syntax">}
 254
 255         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">input </span><span class="jsdoc-syntax">=  {
 256             </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">,
 257             </span><span class="jsdoc-var">id </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
 258             </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.inputType</span><span class="jsdoc-syntax">,
 259             </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.value</span><span class="jsdoc-syntax">,
 260             </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'form-control'</span><span class="jsdoc-syntax">,
 261             </span><span class="jsdoc-var">placeholder </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.placeholder </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">,
 262             </span><span class="jsdoc-var">autocomplete </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.autocomplete </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">'new-password'
 263         </span><span class="jsdoc-syntax">};
 264
 265
 266         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.align</span><span class="jsdoc-syntax">){
 267             </span><span class="jsdoc-var">input.style </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">input.style</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) ? (</span><span class="jsdoc-string">'text-align:' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.align</span><span class="jsdoc-syntax">) : (</span><span class="jsdoc-var">input.style </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'text-align:' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.align</span><span class="jsdoc-syntax">);
 268         }
 269
 270         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.maxLength </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.maxLength </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-var">Number.MAX_VALUE</span><span class="jsdoc-syntax">){
 271             </span><span class="jsdoc-var">input.maxLength </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.maxLength</span><span class="jsdoc-syntax">;
 272         }
 273
 274         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">) {
 275             </span><span class="jsdoc-var">input.disabled</span><span class="jsdoc-syntax">=</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 276         }
 277
 278         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.readOnly</span><span class="jsdoc-syntax">) {
 279             </span><span class="jsdoc-var">input.readonly</span><span class="jsdoc-syntax">=</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 280         }
 281
 282         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">) {
 283             </span><span class="jsdoc-var">input.name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">;
 284         }
 285         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.size</span><span class="jsdoc-syntax">) {
 286             </span><span class="jsdoc-var">input.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' input-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.size</span><span class="jsdoc-syntax">;
 287         }
 288         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">settings</span><span class="jsdoc-syntax">=</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 289         [</span><span class="jsdoc-string">'xs'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'sm'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'md'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'lg'</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.map</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">){
 290             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">settings</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">]) {
 291                 </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' col-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">size </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-string">'-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">settings</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">];
 292             }
 293         });
 294
 295         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">inputblock </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">input</span><span class="jsdoc-syntax">;
 296
 297         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hasFeedback</span><span class="jsdoc-syntax">){
 298
 299             </span><span class="jsdoc-var">input.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' has-feedback'</span><span class="jsdoc-syntax">;
 300
 301             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">feedback </span><span class="jsdoc-syntax">= {
 302                 </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 303                 </span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'glyphicon form-control-feedback glyphicon-ok input-group-addon'
 304             </span><span class="jsdoc-syntax">};
 305
 306             </span><span class="jsdoc-var">inputblock </span><span class="jsdoc-syntax">= {
 307                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input-group'</span><span class="jsdoc-syntax">,
 308                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">:  [
 309                     </span><span class="jsdoc-var">input</span><span class="jsdoc-syntax">,
 310                     </span><span class="jsdoc-var">feedback
 311                 </span><span class="jsdoc-syntax">]
 312             };
 313         }
 314
 315
 316
 317 </span><span class="jsdoc-comment">//        var inputblock = input;
 318
 319         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.after</span><span class="jsdoc-syntax">) {
 320
 321             </span><span class="jsdoc-var">inputblock </span><span class="jsdoc-syntax">= {
 322                 </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'input-group'</span><span class="jsdoc-syntax">,
 323                 </span><span class="jsdoc-var">cn </span><span class="jsdoc-syntax">:  []
 324             };
 325             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">) {
 326
 327                 </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">({
 328                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 329                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-input-before input-group-addon'</span><span class="jsdoc-syntax">,
 330                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.before
 331                 </span><span class="jsdoc-syntax">});
 332             }
 333             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'object'</span><span class="jsdoc-syntax">) {
 334                 </span><span class="jsdoc-var">this.before </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before</span><span class="jsdoc-syntax">);
 335                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before</span><span class="jsdoc-syntax">);
 336                 </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">({
 337                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 338                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-input-before input-group-' </span><span class="jsdoc-syntax">+
 339                         (</span><span class="jsdoc-var">this.before.xtype </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'Button' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'btn' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'addon'</span><span class="jsdoc-syntax">)  </span><span class="jsdoc-comment">//?? what about checkboxes - that looks like a bit of a hack thought?
 340                 </span><span class="jsdoc-syntax">});
 341             }
 342
 343             </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">input</span><span class="jsdoc-syntax">);
 344
 345             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.hasFeedback</span><span class="jsdoc-syntax">){
 346                 </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">feedback</span><span class="jsdoc-syntax">);
 347             }
 348
 349             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.after </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.after</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'string'</span><span class="jsdoc-syntax">) {
 350                 </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">({
 351                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 352                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-input-after input-group-addon'</span><span class="jsdoc-syntax">,
 353                     </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.after
 354                 </span><span class="jsdoc-syntax">});
 355             }
 356             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.after </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.after</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'object'</span><span class="jsdoc-syntax">) {
 357                 </span><span class="jsdoc-var">this.after </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.after</span><span class="jsdoc-syntax">);
 358                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.after</span><span class="jsdoc-syntax">);
 359                 </span><span class="jsdoc-var">inputblock.cn.push</span><span class="jsdoc-syntax">({
 360                     </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'span'</span><span class="jsdoc-syntax">,
 361                     </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'roo-input-after input-group-' </span><span class="jsdoc-syntax">+
 362                         (</span><span class="jsdoc-var">this.after.xtype </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'Button' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'btn' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'addon'</span><span class="jsdoc-syntax">)  </span><span class="jsdoc-comment">//?? what about checkboxes - that looks like a bit of a hack thought?
 363                 </span><span class="jsdoc-syntax">});
 364             }
 365         };
 366
 367         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">align </span><span class="jsdoc-syntax">===</span><span class="jsdoc-string">'left' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.fieldLabel.length</span><span class="jsdoc-syntax">) {
 368                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;left and has label&quot;</span><span class="jsdoc-syntax">);
 369                 </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 370
 371                     {
 372                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
 373                         </span><span class="jsdoc-string">'for' </span><span class="jsdoc-syntax">:  </span><span class="jsdoc-var">id</span><span class="jsdoc-syntax">,
 374                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'control-label col-sm-' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.labelWidth</span><span class="jsdoc-syntax">,
 375                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
 376
 377                     </span><span class="jsdoc-syntax">},
 378                     {
 379                         </span><span class="jsdoc-var">cls </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;col-sm-&quot; </span><span class="jsdoc-syntax">+ (12 - </span><span class="jsdoc-var">this.labelWidth</span><span class="jsdoc-syntax">),
 380                         </span><span class="jsdoc-var">cn</span><span class="jsdoc-syntax">: [
 381                             </span><span class="jsdoc-var">inputblock
 382                         </span><span class="jsdoc-syntax">]
 383                     }
 384
 385                 ];
 386         } </span><span class="jsdoc-keyword">else if </span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">this.fieldLabel.length</span><span class="jsdoc-syntax">) {
 387                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot; label&quot;</span><span class="jsdoc-syntax">);
 388                  </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 389
 390                     {
 391                         </span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'label'</span><span class="jsdoc-syntax">,
 392                         </span><span class="jsdoc-comment">//cls : 'input-group-addon',
 393                         </span><span class="jsdoc-var">html </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.fieldLabel
 394
 395                     </span><span class="jsdoc-syntax">},
 396
 397                     </span><span class="jsdoc-var">inputblock
 398
 399                 </span><span class="jsdoc-syntax">];
 400
 401         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
 402
 403                 </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot; no label &amp;&amp; no align&quot;</span><span class="jsdoc-syntax">);
 404                 </span><span class="jsdoc-var">cfg.cn </span><span class="jsdoc-syntax">= [
 405
 406                         </span><span class="jsdoc-var">inputblock
 407
 408                 </span><span class="jsdoc-syntax">];
 409
 410
 411         };
 412         </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'input-parentType: ' </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">this.parentType</span><span class="jsdoc-syntax">);
 413
 414         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.parentType </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-string">'Navbar' </span><span class="jsdoc-syntax">&amp;&amp;  </span><span class="jsdoc-var">this.parent</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.bar</span><span class="jsdoc-syntax">) {
 415            </span><span class="jsdoc-var">cfg.cls </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">' navbar-form'</span><span class="jsdoc-syntax">;
 416            </span><span class="jsdoc-var">Roo.log</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">);
 417         }
 418
 419         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">;
 420
 421     },
 422     </span><span class="jsdoc-comment">/**
 423      * return the real input element.
 424      */
 425     </span><span class="jsdoc-var">inputEl</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">()
 426     {
 427         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'input.form-control'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">();
 428     },
 429
 430     </span><span class="jsdoc-var">tooltipEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 431     {
 432         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">();
 433     },
 434
 435     </span><span class="jsdoc-var">setDisabled </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">)
 436     {
 437         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">i  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom</span><span class="jsdoc-syntax">;
 438         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) {
 439             </span><span class="jsdoc-var">i.removeAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'disabled'</span><span class="jsdoc-syntax">);
 440             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 441
 442         }
 443         </span><span class="jsdoc-var">i.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'disabled'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">'true'</span><span class="jsdoc-syntax">);
 444     },
 445     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 446     {
 447
 448         </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;keydown&quot; </span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.fireKey</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 449         </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;focus&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onFocus</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 450         </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;blur&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onBlur</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 451
 452         </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.relayEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'keyup'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 453
 454         </span><span class="jsdoc-comment">// reference to original value for reset
 455         </span><span class="jsdoc-var">this.originalValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">();
 456         </span><span class="jsdoc-comment">//Roo.form.TextField.superclass.initEvents.call(this);
 457         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.validationEvent </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'keyup'</span><span class="jsdoc-syntax">){
 458             </span><span class="jsdoc-var">this.validationTask </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.util.DelayedTask</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.validate</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 459             </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'keyup'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.filterValidation</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 460         }
 461         </span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.validationEvent </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
 462             </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.validationEvent</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.validate</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">buffer</span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.validationDelay</span><span class="jsdoc-syntax">});
 463         }
 464
 465         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectOnFocus</span><span class="jsdoc-syntax">){
 466             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;focus&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.preFocus</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 467
 468         }
 469         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.maskRe </span><span class="jsdoc-syntax">|| (</span><span class="jsdoc-var">this.vtype </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.disableKeyFilter </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">this.maskRe </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.VTypes</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.vtype</span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'Mask'</span><span class="jsdoc-syntax">]))){
 470             </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;keypress&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.filterKeys</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 471         }
 472        </span><span class="jsdoc-comment">/* if(this.grow){
 473             this.el.on(&quot;keyup&quot;, this.onKeyUp,  this, {buffer:50});
 474             this.el.on(&quot;click&quot;, this.autoSize,  this);
 475         }
 476         */
 477         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.is</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'input[type=password]'</span><span class="jsdoc-syntax">) &amp;&amp; </span><span class="jsdoc-var">Roo.isSafari</span><span class="jsdoc-syntax">){
 478             </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'keydown'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.SafariOnKeyDown</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 479         }
 480
 481         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.before</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'object'</span><span class="jsdoc-syntax">) {
 482             </span><span class="jsdoc-var">this.before.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-input-before'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">());
 483         }
 484         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.after</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'object'</span><span class="jsdoc-syntax">) {
 485             </span><span class="jsdoc-var">this.after.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.select</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.roo-input-after'</span><span class="jsdoc-syntax">,</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.first</span><span class="jsdoc-syntax">());
 486         }
 487
 488
 489     },
 490     </span><span class="jsdoc-var">filterValidation </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
 491         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">e.isNavKeyPress</span><span class="jsdoc-syntax">()){
 492             </span><span class="jsdoc-var">this.validationTask.delay</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.validationDelay</span><span class="jsdoc-syntax">);
 493         }
 494     },
 495      </span><span class="jsdoc-comment">/**
 496      * Validates the field value
 497      * @return {Boolean} True if the value is valid, else false
 498      */
 499     </span><span class="jsdoc-var">validate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 500         </span><span class="jsdoc-comment">//if(this.disabled || this.validateValue(this.processValue(this.getRawValue()))){
 501         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.validateValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getRawValue</span><span class="jsdoc-syntax">())){
 502             </span><span class="jsdoc-var">this.clearInvalid</span><span class="jsdoc-syntax">();
 503             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 504         }
 505         </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 506     },
 507
 508
 509     </span><span class="jsdoc-comment">/**
 510      * Validates a value according to the field's validation rules and marks the field as invalid
 511      * if the validation fails
 512      * @param {Mixed} value The value to validate
 513      * @return {Boolean} True if the value is valid, else false
 514      */
 515     </span><span class="jsdoc-var">validateValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">){
 516         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value.length </span><span class="jsdoc-syntax">&lt; 1)  { </span><span class="jsdoc-comment">// if it's blank
 517              </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.allowBlank</span><span class="jsdoc-syntax">){
 518                 </span><span class="jsdoc-var">this.clearInvalid</span><span class="jsdoc-syntax">();
 519                 </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 520              }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
 521                 </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.blankText</span><span class="jsdoc-syntax">);
 522                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 523              }
 524         }
 525         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value.length </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">this.minLength</span><span class="jsdoc-syntax">){
 526             </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">String.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.minLengthText</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.minLength</span><span class="jsdoc-syntax">));
 527             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 528         }
 529         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value.length </span><span class="jsdoc-syntax">&gt; </span><span class="jsdoc-var">this.maxLength</span><span class="jsdoc-syntax">){
 530             </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">String.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.maxLengthText</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.maxLength</span><span class="jsdoc-syntax">));
 531             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 532         }
 533         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.vtype</span><span class="jsdoc-syntax">){
 534             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">vt </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.VTypes</span><span class="jsdoc-syntax">;
 535             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">vt</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.vtype</span><span class="jsdoc-syntax">](</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">)){
 536                 </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.vtypeText </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">vt</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.vtype </span><span class="jsdoc-syntax">+</span><span class="jsdoc-string">'Text'</span><span class="jsdoc-syntax">]);
 537                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 538             }
 539         }
 540         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">this.validator </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">&quot;function&quot;</span><span class="jsdoc-syntax">){
 541             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.validator</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">);
 542             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
 543                 </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">);
 544                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 545             }
 546         }
 547         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.regex </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">this.regex.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">)){
 548             </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.regexText</span><span class="jsdoc-syntax">);
 549             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 550         }
 551         </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 552     },
 553
 554
 555
 556      </span><span class="jsdoc-comment">// private
 557     </span><span class="jsdoc-var">fireKey </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
 558         </span><span class="jsdoc-comment">//Roo.log('field ' + e.getKey());
 559         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.isNavKeyPress</span><span class="jsdoc-syntax">()){
 560             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;specialkey&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
 561         }
 562     },
 563     </span><span class="jsdoc-var">focus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selectText</span><span class="jsdoc-syntax">){
 564         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
 565             </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.focus</span><span class="jsdoc-syntax">();
 566             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">selectText </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
 567                 </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.select</span><span class="jsdoc-syntax">();
 568             }
 569         }
 570         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 571     } ,
 572
 573     </span><span class="jsdoc-var">onFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 574         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">Roo.isOpera </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.focusClass</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// don't touch in Opera
 575            // this.el.addClass(this.focusClass);
 576         </span><span class="jsdoc-syntax">}
 577         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hasFocus</span><span class="jsdoc-syntax">){
 578             </span><span class="jsdoc-var">this.hasFocus </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 579             </span><span class="jsdoc-var">this.startValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">();
 580             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;focus&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 581         }
 582     },
 583
 584     </span><span class="jsdoc-var">beforeBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.emptyFn</span><span class="jsdoc-syntax">,
 585
 586
 587     </span><span class="jsdoc-comment">// private
 588     </span><span class="jsdoc-var">onBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 589         </span><span class="jsdoc-var">this.beforeBlur</span><span class="jsdoc-syntax">();
 590         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">Roo.isOpera </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.focusClass</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// don't touch in Opera
 591             //this.el.removeClass(this.focusClass);
 592         </span><span class="jsdoc-syntax">}
 593         </span><span class="jsdoc-var">this.hasFocus </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 594         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.validationEvent </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.validateOnBlur </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.validationEvent </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">&quot;blur&quot;</span><span class="jsdoc-syntax">){
 595             </span><span class="jsdoc-var">this.validate</span><span class="jsdoc-syntax">();
 596         }
 597         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">();
 598         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) !== </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.startValue</span><span class="jsdoc-syntax">)){
 599             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'change'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.startValue</span><span class="jsdoc-syntax">);
 600         }
 601         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;blur&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 602     },
 603
 604     </span><span class="jsdoc-comment">/**
 605      * Resets the current field value to the originally loaded value and clears any validation messages
 606      */
 607     </span><span class="jsdoc-var">reset </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 608         </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.originalValue</span><span class="jsdoc-syntax">);
 609         </span><span class="jsdoc-var">this.clearInvalid</span><span class="jsdoc-syntax">();
 610     },
 611      </span><span class="jsdoc-comment">/**
 612      * Returns the name of the field
 613      * @return {Mixed} name The name field
 614      */
 615     </span><span class="jsdoc-var">getName</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 616         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">;
 617     },
 618      </span><span class="jsdoc-comment">/**
 619      * Returns the normalized data value (undefined or emptyText will be returned as '').  To return the raw value see {@link #getRawValue}.
 620      * @return {Mixed} value The field value
 621      */
 622     </span><span class="jsdoc-var">getValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 623
 624         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getValue</span><span class="jsdoc-syntax">();
 625
 626         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 627     },
 628     </span><span class="jsdoc-comment">/**
 629      * Returns the raw data value which may or may not be a valid, defined value.  To return a normalized value see {@link #getValue}.
 630      * @return {Mixed} value The field value
 631      */
 632     </span><span class="jsdoc-var">getRawValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 633         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getValue</span><span class="jsdoc-syntax">();
 634
 635         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 636     },
 637
 638     </span><span class="jsdoc-comment">/**
 639      * Sets the underlying DOM field's value directly, bypassing validation.  To set the value with validation see {@link #setValue}.
 640      * @param {Mixed} value The value to set
 641      */
 642     </span><span class="jsdoc-var">setRawValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">){
 643         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.value </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">null </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">);
 644     },
 645
 646     </span><span class="jsdoc-var">selectText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">end</span><span class="jsdoc-syntax">){
 647         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getRawValue</span><span class="jsdoc-syntax">();
 648         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v.length </span><span class="jsdoc-syntax">&gt; 0){
 649             </span><span class="jsdoc-var">start </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">start </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">? 0 : </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">;
 650             </span><span class="jsdoc-var">end </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">end </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">v.length </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">end</span><span class="jsdoc-syntax">;
 651             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom</span><span class="jsdoc-syntax">;
 652             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d.setSelectionRange</span><span class="jsdoc-syntax">){
 653                 </span><span class="jsdoc-var">d.setSelectionRange</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">end</span><span class="jsdoc-syntax">);
 654             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d.createTextRange</span><span class="jsdoc-syntax">){
 655                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">range </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">d.createTextRange</span><span class="jsdoc-syntax">();
 656                 </span><span class="jsdoc-var">range.moveStart</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;character&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">start</span><span class="jsdoc-syntax">);
 657                 </span><span class="jsdoc-var">range.moveEnd</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;character&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">v.length</span><span class="jsdoc-syntax">-</span><span class="jsdoc-var">end</span><span class="jsdoc-syntax">);
 658                 </span><span class="jsdoc-var">range.select</span><span class="jsdoc-syntax">();
 659             }
 660         }
 661     },
 662
 663     </span><span class="jsdoc-comment">/**
 664      * Sets a data value into the field and validates it.  To set the value directly without validation see {@link #setRawValue}.
 665      * @param {Mixed} value The value to set
 666      */
 667     </span><span class="jsdoc-var">setValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">){
 668         </span><span class="jsdoc-var">this.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 669         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
 670             </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.value </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">null </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-var">undefined </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">);
 671             </span><span class="jsdoc-var">this.validate</span><span class="jsdoc-syntax">();
 672         }
 673     },
 674
 675     </span><span class="jsdoc-comment">/*
 676     processValue : function(value){
 677         if(this.stripCharsRe){
 678             var newValue = value.replace(this.stripCharsRe, '');
 679             if(newValue !== value){
 680                 this.setRawValue(newValue);
 681                 return newValue;
 682             }
 683         }
 684         return value;
 685     },
 686   */
 687     </span><span class="jsdoc-var">preFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 688
 689         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectOnFocus</span><span class="jsdoc-syntax">){
 690             </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.select</span><span class="jsdoc-syntax">();
 691         }
 692     },
 693     </span><span class="jsdoc-var">filterKeys </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
 694         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.getKey</span><span class="jsdoc-syntax">();
 695         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">e.isNavKeyPress</span><span class="jsdoc-syntax">() || </span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">e.BACKSPACE </span><span class="jsdoc-syntax">|| (</span><span class="jsdoc-var">k </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">e.DELETE </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">e.button </span><span class="jsdoc-syntax">== -1))){
 696             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 697         }
 698         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.getCharCode</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">cc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">String.fromCharCode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">);
 699         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">e.isSpecialKey</span><span class="jsdoc-syntax">() || !</span><span class="jsdoc-var">cc</span><span class="jsdoc-syntax">)){
 700             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 701         }
 702         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.maskRe.test</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cc</span><span class="jsdoc-syntax">)){
 703             </span><span class="jsdoc-var">e.stopEvent</span><span class="jsdoc-syntax">();
 704         }
 705     },
 706      </span><span class="jsdoc-comment">/**
 707      * Clear any invalid styles/messages for this field
 708      */
 709     </span><span class="jsdoc-var">clearInvalid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 710
 711         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.preventMark</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// not rendered
 712             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 713         }
 714         </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.invalidClass</span><span class="jsdoc-syntax">);
 715         </span><span class="jsdoc-comment">/*
 716         switch(this.msgTarget){
 717             case 'qtip':
 718                 this.el.dom.qtip = '';
 719                 break;
 720             case 'title':
 721                 this.el.dom.title = '';
 722                 break;
 723             case 'under':
 724                 if(this.errorEl){
 725                     Roo.form.Field.msgFx[this.msgFx].hide(this.errorEl, this);
 726                 }
 727                 break;
 728             case 'side':
 729                 if(this.errorIcon){
 730                     this.errorIcon.dom.qtip = '';
 731                     this.errorIcon.hide();
 732                     this.un('resize', this.alignErrorIcon, this);
 733                 }
 734                 break;
 735             default:
 736                 var t = Roo.getDom(this.msgTarget);
 737                 t.innerHTML = '';
 738                 t.style.display = 'none';
 739                 break;
 740         }
 741         */
 742         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'valid'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 743     },
 744      </span><span class="jsdoc-comment">/**
 745      * Mark this field as invalid
 746      * @param {String} msg The validation message
 747      */
 748     </span><span class="jsdoc-var">markInvalid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">){
 749         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el  </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.preventMark</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// not rendered
 750             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 751         }
 752         </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.invalidClass</span><span class="jsdoc-syntax">);
 753         </span><span class="jsdoc-comment">/*
 754         msg = msg || this.invalidText;
 755         switch(this.msgTarget){
 756             case 'qtip':
 757                 this.el.dom.qtip = msg;
 758                 this.el.dom.qclass = 'x-form-invalid-tip';
 759                 if(Roo.QuickTips){ // fix for floating editors interacting with DND
 760                     Roo.QuickTips.enable();
 761                 }
 762                 break;
 763             case 'title':
 764                 this.el.dom.title = msg;
 765                 break;
 766             case 'under':
 767                 if(!this.errorEl){
 768                     var elp = this.el.findParent('.x-form-element', 5, true);
 769                     this.errorEl = elp.createChild({cls:'x-form-invalid-msg'});
 770                     this.errorEl.setWidth(elp.getWidth(true)-20);
 771                 }
 772                 this.errorEl.update(msg);
 773                 Roo.form.Field.msgFx[this.msgFx].show(this.errorEl, this);
 774                 break;
 775             case 'side':
 776                 if(!this.errorIcon){
 777                     var elp = this.el.findParent('.x-form-element', 5, true);
 778                     this.errorIcon = elp.createChild({cls:'x-form-invalid-icon'});
 779                 }
 780                 this.alignErrorIcon();
 781                 this.errorIcon.dom.qtip = msg;
 782                 this.errorIcon.dom.qclass = 'x-form-invalid-tip';
 783                 this.errorIcon.show();
 784                 this.on('resize', this.alignErrorIcon, this);
 785                 break;
 786             default:
 787                 var t = Roo.getDom(this.msgTarget);
 788                 t.innerHTML = msg;
 789                 t.style.display = this.msgDisplay;
 790                 break;
 791         }
 792         */
 793         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'invalid'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">);
 794     },
 795     </span><span class="jsdoc-comment">// private
 796     </span><span class="jsdoc-var">SafariOnKeyDown </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event</span><span class="jsdoc-syntax">)
 797     {
 798         </span><span class="jsdoc-comment">// this is a workaround for a password hang bug on chrome/ webkit.
 799
 800         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">isSelectAll </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 801
 802         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.selectionEnd </span><span class="jsdoc-syntax">&gt; 0){
 803             </span><span class="jsdoc-var">isSelectAll </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.selectionEnd </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.inputEl</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.dom.selectionStart </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.length </span><span class="jsdoc-syntax">== 0) ? </span><span class="jsdoc-keyword">true </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 804         }
 805         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(((</span><span class="jsdoc-var">event.getKey</span><span class="jsdoc-syntax">() == 8 || </span><span class="jsdoc-var">event.getKey</span><span class="jsdoc-syntax">() == 46) &amp;&amp; </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.length </span><span class="jsdoc-syntax">==1)){ </span><span class="jsdoc-comment">// backspace and delete key
 806             </span><span class="jsdoc-var">event.preventDefault</span><span class="jsdoc-syntax">();
 807             </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
 808             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 809         }
 810
 811         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">isSelectAll  </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">event.getCharCode</span><span class="jsdoc-syntax">() &gt; 31){ </span><span class="jsdoc-comment">// not backspace and delete key
 812
 813             </span><span class="jsdoc-var">event.preventDefault</span><span class="jsdoc-syntax">();
 814             </span><span class="jsdoc-comment">// this is very hacky as keydown always get's upper case.
 815             //
 816             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cc </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">String.fromCharCode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">event.getCharCode</span><span class="jsdoc-syntax">());
 817             </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">( </span><span class="jsdoc-var">event.shiftKey </span><span class="jsdoc-syntax">?  </span><span class="jsdoc-var">cc </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">cc.toLowerCase</span><span class="jsdoc-syntax">());
 818
 819         }
 820     },
 821     </span><span class="jsdoc-var">adjustWidth </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">){
 822         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tag.toLowerCase</span><span class="jsdoc-syntax">();
 823         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'number' </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">Roo.isStrict </span><span class="jsdoc-syntax">&amp;&amp; !</span><span class="jsdoc-var">Roo.isSafari</span><span class="jsdoc-syntax">){
 824             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isIE </span><span class="jsdoc-syntax">&amp;&amp; (</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'input' </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'textarea'</span><span class="jsdoc-syntax">)){
 825                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">){
 826                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">+ 2;
 827                 }
 828                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'textarea'</span><span class="jsdoc-syntax">){
 829                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">-2;
 830                 }
 831             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isOpera</span><span class="jsdoc-syntax">){
 832                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'input'</span><span class="jsdoc-syntax">){
 833                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">+ 2;
 834                 }
 835                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'textarea'</span><span class="jsdoc-syntax">){
 836                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">-2;
 837                 }
 838             }
 839         }
 840         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
 841     }
 842
 843 });
 844
 845
 846 </span></code></body></html>