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

   1 <html><head><title>Roo/form/Field.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  * Based on:
   3  * Ext JS Library 1.1.1
   4  * Copyright(c) 2006-2007, Ext JS, LLC.
   5  *
   6  * Originally Released Under LGPL - original licence link has changed is not relivant.
   7  *
   8  * Fork - LGPL
   9  * &lt;script type=&quot;text/javascript&quot;&gt;
  10  */
  11
  12 /**
  13  * @class Roo.form.Field
  14  * @extends Roo.BoxComponent
  15  * Base class for form fields that provides default event handling, sizing, value handling and other functionality.
  16  * @constructor
  17  * Creates a new Field
  18  * @param {Object} config Configuration options
  19  */
  20 </span><span class="jsdoc-var">Roo.form.Field </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">){
  21     </span><span class="jsdoc-var">Roo.form.Field.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">);
  22 };
  23
  24 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.form.Field</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.BoxComponent</span><span class="jsdoc-syntax">,  {
  25     </span><span class="jsdoc-comment">/**
  26      * @cfg {String} fieldLabel Label to use when rendering a form.
  27      */
  28         /**
  29      * @cfg {String} labelSeparator the ':' after a field label (default :)  = set it to empty string to hide the field label.
  30      */
  31        /**
  32      * @cfg {String} qtip Mouse over tip
  33      */
  34
  35     /**
  36      * @cfg {String} invalidClass The CSS class to use when marking a field invalid (defaults to &quot;x-form-invalid&quot;)
  37      */
  38     </span><span class="jsdoc-var">invalidClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;x-form-invalid&quot;</span><span class="jsdoc-syntax">,
  39     </span><span class="jsdoc-comment">/**
  40      * @cfg {String} invalidText The error text to use when marking a field invalid and no message is provided (defaults to &quot;The value in this field is invalid&quot;)
  41      */
  42     </span><span class="jsdoc-var">invalidText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;The value in this field is invalid&quot;</span><span class="jsdoc-syntax">,
  43     </span><span class="jsdoc-comment">/**
  44      * @cfg {String} focusClass The CSS class to use when the field receives focus (defaults to &quot;x-form-focus&quot;)
  45      */
  46     </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">,
  47     </span><span class="jsdoc-comment">/**
  48      * @cfg {String/Boolean} validationEvent The event that should initiate field validation. Set to false to disable
  49       automatic validation (defaults to &quot;keyup&quot;).
  50      */
  51     </span><span class="jsdoc-var">validationEvent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;keyup&quot;</span><span class="jsdoc-syntax">,
  52     </span><span class="jsdoc-comment">/**
  53      * @cfg {Boolean} validateOnBlur Whether the field should validate when it loses focus (defaults to true).
  54      */
  55     </span><span class="jsdoc-var">validateOnBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
  56     </span><span class="jsdoc-comment">/**
  57      * @cfg {Number} validationDelay The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)
  58      */
  59     </span><span class="jsdoc-var">validationDelay </span><span class="jsdoc-syntax">: 250,
  60     </span><span class="jsdoc-comment">/**
  61      * @cfg {String/Object} autoCreate A DomHelper element spec, or true for a default element spec (defaults to
  62      * {tag: &quot;input&quot;, type: &quot;text&quot;, size: &quot;20&quot;, autocomplete: &quot;off&quot;})
  63      */
  64     </span><span class="jsdoc-var">defaultAutoCreate </span><span class="jsdoc-syntax">: {</span><span class="jsdoc-var">tag</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;input&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;text&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">size</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;20&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">autocomplete</span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;new-password&quot;</span><span class="jsdoc-syntax">},
  65     </span><span class="jsdoc-comment">/**
  66      * @cfg {String} fieldClass The default CSS class for the field (defaults to &quot;x-form-field&quot;)
  67      */
  68     </span><span class="jsdoc-var">fieldClass </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;x-form-field&quot;</span><span class="jsdoc-syntax">,
  69     </span><span class="jsdoc-comment">/**
  70      * @cfg {String} msgTarget The location where error text should display.  Should be one of the following values (defaults to 'qtip'):
  71      *&lt;pre&gt;
  72 Value         Description
  73 -----------   ----------------------------------------------------------------------
  74 qtip          Display a quick tip when the user hovers over the field
  75 title         Display a default browser title attribute popup
  76 under         Add a block div beneath the field containing the error text
  77 side          Add an error icon to the right of the field with a popup on hover
  78 [element id]  Add the error text directly to the innerHTML of the specified element
  79 &lt;/pre&gt;
  80      */
  81     </span><span class="jsdoc-var">msgTarget </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'qtip'</span><span class="jsdoc-syntax">,
  82     </span><span class="jsdoc-comment">/**
  83      * @cfg {String} msgFx &lt;b&gt;Experimental&lt;/b&gt; The effect used when displaying a validation message under the field (defaults to 'normal').
  84      */
  85     </span><span class="jsdoc-var">msgFx </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'normal'</span><span class="jsdoc-syntax">,
  86
  87     </span><span class="jsdoc-comment">/**
  88      * @cfg {Boolean} readOnly True to mark the field as readOnly in HTML (defaults to false) -- Note: this only sets the element's readOnly DOM attribute.
  89      */
  90     </span><span class="jsdoc-var">readOnly </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  91
  92     </span><span class="jsdoc-comment">/**
  93      * @cfg {Boolean} disabled True to disable the field (defaults to false).
  94      */
  95     </span><span class="jsdoc-var">disabled </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
  96
  97     </span><span class="jsdoc-comment">/**
  98      * @cfg {String} inputType The type attribute for input fields -- e.g. radio, text, password (defaults to &quot;text&quot;).
  99      */
 100     </span><span class="jsdoc-var">inputType </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">,
 101
 102     </span><span class="jsdoc-comment">/**
 103      * @cfg {Number} tabIndex The tabIndex for this field. Note this only applies to fields that are rendered, not those which are built via applyTo (defaults to undefined).
 104          */
 105         </span><span class="jsdoc-var">tabIndex </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">,
 106
 107     </span><span class="jsdoc-comment">// private
 108     </span><span class="jsdoc-var">isFormField </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 109
 110     </span><span class="jsdoc-comment">// private
 111     </span><span class="jsdoc-var">hasFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 112     </span><span class="jsdoc-comment">/**
 113      * @property {Roo.Element} fieldEl
 114      * Element Containing the rendered Field (with label etc.)
 115      */
 116     /**
 117      * @cfg {Mixed} value A value to initialize this field with.
 118      */
 119     </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">,
 120
 121     </span><span class="jsdoc-comment">/**
 122      * @cfg {String} name The field's HTML name attribute.
 123      */
 124     /**
 125      * @cfg {String} cls A CSS class to apply to the field's underlying element.
 126      */
 127     // private
 128     </span><span class="jsdoc-var">loadedValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
 129
 130
 131         </span><span class="jsdoc-comment">// private ??
 132         </span><span class="jsdoc-var">initComponent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 133         </span><span class="jsdoc-var">Roo.form.Field.superclass.initComponent.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 134         </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
 135             </span><span class="jsdoc-comment">/**
 136              * @event focus
 137              * Fires when this field receives input focus.
 138              * @param {Roo.form.Field} this
 139              */
 140             </span><span class="jsdoc-var">focus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 141             </span><span class="jsdoc-comment">/**
 142              * @event blur
 143              * Fires when this field loses input focus.
 144              * @param {Roo.form.Field} this
 145              */
 146             </span><span class="jsdoc-var">blur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 147             </span><span class="jsdoc-comment">/**
 148              * @event specialkey
 149              * Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed.  You can check
 150              * {@link Roo.EventObject#getKey} to determine which key was pressed.
 151              * @param {Roo.form.Field} this
 152              * @param {Roo.EventObject} e The event object
 153              */
 154             </span><span class="jsdoc-var">specialkey </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 155             </span><span class="jsdoc-comment">/**
 156              * @event change
 157              * Fires just before the field blurs if the field value has changed.
 158              * @param {Roo.form.Field} this
 159              * @param {Mixed} newValue The new value
 160              * @param {Mixed} oldValue The original value
 161              */
 162             </span><span class="jsdoc-var">change </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 163             </span><span class="jsdoc-comment">/**
 164              * @event invalid
 165              * Fires after the field has been marked as invalid.
 166              * @param {Roo.form.Field} this
 167              * @param {String} msg The validation message
 168              */
 169             </span><span class="jsdoc-var">invalid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 170             </span><span class="jsdoc-comment">/**
 171              * @event valid
 172              * Fires after the field has been validated with no errors.
 173              * @param {Roo.form.Field} this
 174              */
 175             </span><span class="jsdoc-var">valid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
 176              </span><span class="jsdoc-comment">/**
 177              * @event keyup
 178              * Fires after the key up
 179              * @param {Roo.form.Field} this
 180              * @param {Roo.EventObject}  e The event Object
 181              */
 182             </span><span class="jsdoc-var">keyup </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
 183         </span><span class="jsdoc-syntax">});
 184     },
 185
 186     </span><span class="jsdoc-comment">/**
 187      * Returns the name attribute of the field if available
 188      * @return {String} name The field name
 189      */
 190     </span><span class="jsdoc-var">getName</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 191          </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.rendered </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.el.dom.name </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.el.dom.name </span><span class="jsdoc-syntax">: (</span><span class="jsdoc-var">this.hiddenName </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
 192     },
 193
 194     </span><span class="jsdoc-comment">// private
 195     </span><span class="jsdoc-var">onRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">){
 196         </span><span class="jsdoc-var">Roo.form.Field.superclass.onRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">ct</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
 197         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">){
 198             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cfg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getAutoCreate</span><span class="jsdoc-syntax">();
 199             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">cfg.name</span><span class="jsdoc-syntax">){
 200                 </span><span class="jsdoc-var">cfg.name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-var">this.id </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this.name</span><span class="jsdoc-syntax">;
 201             }
 202             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">cfg.name.length</span><span class="jsdoc-syntax">) {
 203                 </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">cfg.name</span><span class="jsdoc-syntax">;
 204             }
 205             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.inputType</span><span class="jsdoc-syntax">){
 206                 </span><span class="jsdoc-var">cfg.type </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.inputType</span><span class="jsdoc-syntax">;
 207             }
 208             </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ct.createChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cfg</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">position</span><span class="jsdoc-syntax">);
 209         }
 210         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.dom.type</span><span class="jsdoc-syntax">;
 211         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">){
 212             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'password'</span><span class="jsdoc-syntax">){
 213                 </span><span class="jsdoc-var">type </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'text'</span><span class="jsdoc-syntax">;
 214             }
 215             </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-form-'</span><span class="jsdoc-syntax">+</span><span class="jsdoc-var">type</span><span class="jsdoc-syntax">);
 216         }
 217         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.readOnly</span><span class="jsdoc-syntax">){
 218             </span><span class="jsdoc-var">this.el.dom.readOnly </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 219         }
 220         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.tabIndex </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
 221             </span><span class="jsdoc-var">this.el.dom.setAttribute</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'tabIndex'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.tabIndex</span><span class="jsdoc-syntax">);
 222         }
 223
 224         </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">([</span><span class="jsdoc-var">this.fieldClass</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.cls</span><span class="jsdoc-syntax">]);
 225         </span><span class="jsdoc-var">this.initValue</span><span class="jsdoc-syntax">();
 226     },
 227
 228     </span><span class="jsdoc-comment">/**
 229      * Apply the behaviors of this component to an existing element. &lt;b&gt;This is used instead of render().&lt;/b&gt;
 230      * @param {String/HTMLElement/Element} el The id of the node, a DOM node or an existing Element
 231      * @return {Roo.form.Field} this
 232      */
 233     </span><span class="jsdoc-var">applyTo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">){
 234         </span><span class="jsdoc-var">this.allowDomMove </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 235         </span><span class="jsdoc-var">this.el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">target</span><span class="jsdoc-syntax">);
 236         </span><span class="jsdoc-var">this.render</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom.parentNode</span><span class="jsdoc-syntax">);
 237         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
 238     },
 239
 240     </span><span class="jsdoc-comment">// private
 241     </span><span class="jsdoc-var">initValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 242         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.value </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">undefined</span><span class="jsdoc-syntax">){
 243             </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.value</span><span class="jsdoc-syntax">);
 244         }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom.value.length </span><span class="jsdoc-syntax">&gt; 0){
 245             </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom.value</span><span class="jsdoc-syntax">);
 246         }
 247     },
 248
 249     </span><span class="jsdoc-comment">/**
 250      * Returns true if this field has been changed since it was originally loaded and is not disabled.
 251      * DEPRICATED  - it never worked well - use hasChanged/resetHasChanged.
 252      */
 253     </span><span class="jsdoc-var">isDirty </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">() {
 254         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">) {
 255             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 256         }
 257         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">()) !== </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.originalValue</span><span class="jsdoc-syntax">);
 258     },
 259
 260     </span><span class="jsdoc-comment">/**
 261      * stores the current value in loadedValue
 262      */
 263     </span><span class="jsdoc-var">resetHasChanged </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 264     {
 265         </span><span class="jsdoc-var">this.loadedValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">());
 266     },
 267     </span><span class="jsdoc-comment">/**
 268      * checks the current value against the 'loaded' value.
 269      * Note - will return false if 'resetHasChanged' has not been called first.
 270      */
 271     </span><span class="jsdoc-var">hasChanged </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
 272     {
 273         </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.readOnly</span><span class="jsdoc-syntax">) {
 274             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 275         }
 276         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.loadedValue </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">String</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">()) !== </span><span class="jsdoc-var">this.loadedValue</span><span class="jsdoc-syntax">;
 277     },
 278
 279
 280
 281     </span><span class="jsdoc-comment">// private
 282     </span><span class="jsdoc-var">afterRender </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 283         </span><span class="jsdoc-var">Roo.form.Field.superclass.afterRender.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 284         </span><span class="jsdoc-var">this.initEvents</span><span class="jsdoc-syntax">();
 285     },
 286
 287     </span><span class="jsdoc-comment">// private
 288     </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">){
 289         </span><span class="jsdoc-comment">//Roo.log('field ' + e.getKey());
 290         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e.isNavKeyPress</span><span class="jsdoc-syntax">()){
 291             </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">);
 292         }
 293     },
 294
 295     </span><span class="jsdoc-comment">/**
 296      * Resets the current field value to the originally loaded value and clears any validation messages
 297      */
 298     </span><span class="jsdoc-var">reset </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 299         </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.resetValue</span><span class="jsdoc-syntax">);
 300         </span><span class="jsdoc-var">this.originalValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">();
 301         </span><span class="jsdoc-var">this.clearInvalid</span><span class="jsdoc-syntax">();
 302     },
 303
 304     </span><span class="jsdoc-comment">// private
 305     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 306         </span><span class="jsdoc-comment">// safari killled keypress - so keydown is now used..
 307         </span><span class="jsdoc-var">this.el.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">);
 308         </span><span class="jsdoc-var">this.el.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">);
 309         </span><span class="jsdoc-var">this.el.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">);
 310         </span><span class="jsdoc-var">this.el.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">);
 311
 312         </span><span class="jsdoc-comment">// reference to original value for reset
 313         </span><span class="jsdoc-var">this.originalValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">();
 314         </span><span class="jsdoc-var">this.resetValue </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">();
 315     },
 316
 317     </span><span class="jsdoc-comment">// private
 318     </span><span class="jsdoc-var">onFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 319         </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
 320             </span><span class="jsdoc-var">this.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.focusClass</span><span class="jsdoc-syntax">);
 321         }
 322         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.hasFocus</span><span class="jsdoc-syntax">){
 323             </span><span class="jsdoc-var">this.hasFocus </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 324             </span><span class="jsdoc-var">this.startValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">();
 325             </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">);
 326         }
 327     },
 328
 329     </span><span class="jsdoc-var">beforeBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Roo.emptyFn</span><span class="jsdoc-syntax">,
 330
 331     </span><span class="jsdoc-comment">// private
 332     </span><span class="jsdoc-var">onBlur </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 333         </span><span class="jsdoc-var">this.beforeBlur</span><span class="jsdoc-syntax">();
 334         </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
 335             </span><span class="jsdoc-var">this.el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.focusClass</span><span class="jsdoc-syntax">);
 336         }
 337         </span><span class="jsdoc-var">this.hasFocus </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
 338         </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">){
 339             </span><span class="jsdoc-var">this.validate</span><span class="jsdoc-syntax">();
 340         }
 341         </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">();
 342         </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">)){
 343             </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">);
 344         }
 345         </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">);
 346     },
 347
 348     </span><span class="jsdoc-comment">/**
 349      * Returns whether or not the field value is currently valid
 350      * @param {Boolean} preventMark True to disable marking the field invalid
 351      * @return {Boolean} True if the value is valid, else false
 352      */
 353     </span><span class="jsdoc-var">isValid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">preventMark</span><span class="jsdoc-syntax">){
 354         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.disabled</span><span class="jsdoc-syntax">){
 355             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 356         }
 357         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">restore </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.preventMark</span><span class="jsdoc-syntax">;
 358         </span><span class="jsdoc-var">this.preventMark </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">preventMark </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
 359         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.validateValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.processValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getRawValue</span><span class="jsdoc-syntax">()));
 360         </span><span class="jsdoc-var">this.preventMark </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">restore</span><span class="jsdoc-syntax">;
 361         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 362     },
 363
 364     </span><span class="jsdoc-comment">/**
 365      * Validates the field value
 366      * @return {Boolean} True if the value is valid, else false
 367      */
 368     </span><span class="jsdoc-var">validate </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 369         </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.processValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getRawValue</span><span class="jsdoc-syntax">()))){
 370             </span><span class="jsdoc-var">this.clearInvalid</span><span class="jsdoc-syntax">();
 371             </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 372         }
 373         </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
 374     },
 375
 376     </span><span class="jsdoc-var">processValue </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">){
 377         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">;
 378     },
 379
 380     </span><span class="jsdoc-comment">// private
 381     // Subclasses should provide the validation implementation by overriding this
 382     </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">){
 383         </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
 384     },
 385
 386     </span><span class="jsdoc-comment">/**
 387      * Mark this field as invalid
 388      * @param {String} msg The validation message
 389      */
 390     </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">){
 391         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.rendered </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.preventMark</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// not rendered
 392             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 393         }
 394
 395         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">obj </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.combo</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.combo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// fix the combox array!!
 396
 397         </span><span class="jsdoc-var">obj.el.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.invalidClass</span><span class="jsdoc-syntax">);
 398         </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">msg </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.invalidText</span><span class="jsdoc-syntax">;
 399         </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.msgTarget</span><span class="jsdoc-syntax">){
 400             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'qtip'</span><span class="jsdoc-syntax">:
 401                 </span><span class="jsdoc-var">obj.el.dom.qtip </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">;
 402                 </span><span class="jsdoc-var">obj.el.dom.qclass </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'x-form-invalid-tip'</span><span class="jsdoc-syntax">;
 403                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.QuickTips</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// fix for floating editors interacting with DND
 404                     </span><span class="jsdoc-var">Roo.QuickTips.enable</span><span class="jsdoc-syntax">();
 405                 }
 406                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 407             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'title'</span><span class="jsdoc-syntax">:
 408                 </span><span class="jsdoc-var">this.el.dom.title </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">;
 409                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 410             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'under'</span><span class="jsdoc-syntax">:
 411                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.errorEl</span><span class="jsdoc-syntax">){
 412                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">elp </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.findParent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.x-form-element'</span><span class="jsdoc-syntax">, 5, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 413                     </span><span class="jsdoc-var">this.errorEl </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">elp.createChild</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'x-form-invalid-msg'</span><span class="jsdoc-syntax">});
 414                     </span><span class="jsdoc-var">this.errorEl.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">elp.getWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">)-20);
 415                 }
 416                 </span><span class="jsdoc-var">this.errorEl.update</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">);
 417                 </span><span class="jsdoc-var">Roo.form.Field.msgFx</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.msgFx</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.show</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.errorEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 418                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 419             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'side'</span><span class="jsdoc-syntax">:
 420                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.errorIcon</span><span class="jsdoc-syntax">){
 421                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">elp </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.findParent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'.x-form-element'</span><span class="jsdoc-syntax">, 5, </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
 422                     </span><span class="jsdoc-var">this.errorIcon </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">elp.createChild</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">cls</span><span class="jsdoc-syntax">:</span><span class="jsdoc-string">'x-form-invalid-icon'</span><span class="jsdoc-syntax">});
 423                 }
 424                 </span><span class="jsdoc-var">this.alignErrorIcon</span><span class="jsdoc-syntax">();
 425                 </span><span class="jsdoc-var">this.errorIcon.dom.qtip </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">;
 426                 </span><span class="jsdoc-var">this.errorIcon.dom.qclass </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'x-form-invalid-tip'</span><span class="jsdoc-syntax">;
 427                 </span><span class="jsdoc-var">this.errorIcon.show</span><span class="jsdoc-syntax">();
 428                 </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'resize'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.alignErrorIcon</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 429                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 430             </span><span class="jsdoc-keyword">default</span><span class="jsdoc-syntax">:
 431                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.msgTarget</span><span class="jsdoc-syntax">);
 432                 </span><span class="jsdoc-var">t.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">;
 433                 </span><span class="jsdoc-var">t.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.msgDisplay</span><span class="jsdoc-syntax">;
 434                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 435         }
 436         </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">);
 437     },
 438
 439     </span><span class="jsdoc-comment">// private
 440     </span><span class="jsdoc-var">alignErrorIcon </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 441         </span><span class="jsdoc-var">this.errorIcon.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'tl-tr'</span><span class="jsdoc-syntax">, [2, 0]);
 442     },
 443
 444     </span><span class="jsdoc-comment">/**
 445      * Clear any invalid styles/messages for this field
 446      */
 447     </span><span class="jsdoc-var">clearInvalid </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 448         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.rendered </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this.preventMark</span><span class="jsdoc-syntax">){ </span><span class="jsdoc-comment">// not rendered
 449             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
 450         }
 451         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">obj </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.combo</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) ? </span><span class="jsdoc-var">this.combo </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">; </span><span class="jsdoc-comment">// fix the combox array!!
 452
 453         </span><span class="jsdoc-var">obj.el.removeClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.invalidClass</span><span class="jsdoc-syntax">);
 454         </span><span class="jsdoc-keyword">switch</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.msgTarget</span><span class="jsdoc-syntax">){
 455             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'qtip'</span><span class="jsdoc-syntax">:
 456                 </span><span class="jsdoc-var">obj.el.dom.qtip </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 457                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 458             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'title'</span><span class="jsdoc-syntax">:
 459                 </span><span class="jsdoc-var">this.el.dom.title </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 460                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 461             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'under'</span><span class="jsdoc-syntax">:
 462                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.errorEl</span><span class="jsdoc-syntax">){
 463                     </span><span class="jsdoc-var">Roo.form.Field.msgFx</span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">this.msgFx</span><span class="jsdoc-syntax">]</span><span class="jsdoc-var">.hide</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.errorEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 464                 }
 465                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 466             </span><span class="jsdoc-keyword">case </span><span class="jsdoc-string">'side'</span><span class="jsdoc-syntax">:
 467                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.errorIcon</span><span class="jsdoc-syntax">){
 468                     </span><span class="jsdoc-var">this.errorIcon.dom.qtip </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 469                     </span><span class="jsdoc-var">this.errorIcon.hide</span><span class="jsdoc-syntax">();
 470                     </span><span class="jsdoc-var">this.un</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'resize'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.alignErrorIcon</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
 471                 }
 472                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 473             </span><span class="jsdoc-keyword">default</span><span class="jsdoc-syntax">:
 474                 </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.getDom</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.msgTarget</span><span class="jsdoc-syntax">);
 475                 </span><span class="jsdoc-var">t.innerHTML </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">;
 476                 </span><span class="jsdoc-var">t.style.display </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'none'</span><span class="jsdoc-syntax">;
 477                 </span><span class="jsdoc-keyword">break</span><span class="jsdoc-syntax">;
 478         }
 479         </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">);
 480     },
 481
 482     </span><span class="jsdoc-comment">/**
 483      * Returns the raw data value which may or may not be a valid, defined value.  To return a normalized value see {@link #getValue}.
 484      * @return {Mixed} value The field value
 485      */
 486     </span><span class="jsdoc-var">getRawValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 487         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getValue</span><span class="jsdoc-syntax">();
 488
 489         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 490     },
 491
 492     </span><span class="jsdoc-comment">/**
 493      * Returns the normalized data value (undefined or emptyText will be returned as '').  To return the raw value see {@link #getRawValue}.
 494      * @return {Mixed} value The field value
 495      */
 496     </span><span class="jsdoc-var">getValue </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
 497         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.getValue</span><span class="jsdoc-syntax">();
 498
 499         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 500     },
 501
 502     </span><span class="jsdoc-comment">/**
 503      * Sets the underlying DOM field's value directly, bypassing validation.  To set the value with validation see {@link #setValue}.
 504      * @param {Mixed} value The value to set
 505      */
 506     </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">){
 507         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.el.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">);
 508     },
 509
 510     </span><span class="jsdoc-comment">/**
 511      * Sets a data value into the field and validates it.  To set the value directly without validation see {@link #setRawValue}.
 512      * @param {Mixed} value The value to set
 513      */
 514     </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">){
 515         </span><span class="jsdoc-var">this.value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">;
 516         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
 517             </span><span class="jsdoc-var">this.el.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">);
 518              </span><span class="jsdoc-var">this.validate</span><span class="jsdoc-syntax">();
 519         }
 520     },
 521
 522     </span><span class="jsdoc-var">adjustSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">){
 523         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">s </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.form.Field.superclass.adjustSize.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">h</span><span class="jsdoc-syntax">);
 524         </span><span class="jsdoc-var">s.width </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.adjustWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom.tagName</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">s.width</span><span class="jsdoc-syntax">);
 525         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">s</span><span class="jsdoc-syntax">;
 526     },
 527
 528     </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">){
 529         </span><span class="jsdoc-var">tag </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">tag.toLowerCase</span><span class="jsdoc-syntax">();
 530         </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">){
 531             </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">)){
 532                 </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">){
 533                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">+ 2;
 534                 }
 535                 </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">){
 536                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">-2;
 537                 }
 538             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isOpera</span><span class="jsdoc-syntax">){
 539                 </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">){
 540                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">+ 2;
 541                 }
 542                 </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">){
 543                     </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">-2;
 544                 }
 545             }
 546         }
 547         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">;
 548     }
 549 });
 550
 551
 552 </span><span class="jsdoc-comment">// anything other than normal should be considered experimental
 553 </span><span class="jsdoc-var">Roo.form.Field.msgFx </span><span class="jsdoc-syntax">= {
 554     </span><span class="jsdoc-var">normal </span><span class="jsdoc-syntax">: {
 555         </span><span class="jsdoc-var">show</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msgEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">){
 556             </span><span class="jsdoc-var">msgEl.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'block'</span><span class="jsdoc-syntax">);
 557         },
 558
 559         </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msgEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">){
 560             </span><span class="jsdoc-var">msgEl.setDisplayed</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.update</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
 561         }
 562     },
 563
 564     </span><span class="jsdoc-var">slide </span><span class="jsdoc-syntax">: {
 565         </span><span class="jsdoc-var">show</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msgEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">){
 566             </span><span class="jsdoc-var">msgEl.slideIn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'t'</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">stopFx</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">});
 567         },
 568
 569         </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msgEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">){
 570             </span><span class="jsdoc-var">msgEl.slideOut</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'t'</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">stopFx</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">useDisplay</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">});
 571         }
 572     },
 573
 574     </span><span class="jsdoc-var">slideRight </span><span class="jsdoc-syntax">: {
 575         </span><span class="jsdoc-var">show</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msgEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">){
 576             </span><span class="jsdoc-var">msgEl.fixDisplay</span><span class="jsdoc-syntax">();
 577             </span><span class="jsdoc-var">msgEl.alignTo</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">f.el</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">'tl-tr'</span><span class="jsdoc-syntax">);
 578             </span><span class="jsdoc-var">msgEl.slideIn</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'l'</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">stopFx</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">});
 579         },
 580
 581         </span><span class="jsdoc-var">hide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msgEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">f</span><span class="jsdoc-syntax">){
 582             </span><span class="jsdoc-var">msgEl.slideOut</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'l'</span><span class="jsdoc-syntax">, {</span><span class="jsdoc-var">stopFx</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,</span><span class="jsdoc-var">useDisplay</span><span class="jsdoc-syntax">:</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">});
 583         }
 584     }
 585 };</span></code></body></html>