projects / roojs1 / blob
? search:


8b2c3ba08dd3243fd8b44c866351d644c5ba80b5
[roojs1] / docs / src / Roo_form_TextField.js.html
1 <html><head><title>Roo/form/TextField.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 /**
14  * @class Roo.form.TextField
15  * @extends Roo.form.Field
16  * Basic text field.  Can be used as a direct replacement for traditional text inputs, or as the base
17  * class for more sophisticated input controls (like {@link Roo.form.TextArea} and {@link Roo.form.ComboBox}).
18  * @constructor
19  * Creates a new TextField
20  * @param {Object} config Configuration options
21  */
22 </span><span class="jsdoc-var">Roo.form.TextField </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">){
23     </span><span class="jsdoc-var">Roo.form.TextField.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">);
24     </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
25         </span><span class="jsdoc-comment">/**
26          * @event autosize
27          * Fires when the autosize function is triggered.  The field may or may not have actually changed size
28          * according to the default logic, but this event provides a hook for the developer to apply additional
29          * logic at runtime to resize the field if needed.
30              * @param {Roo.form.Field} this This text field
31              * @param {Number} width The new field width
32              */
33         </span><span class="jsdoc-var">autosize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
34     </span><span class="jsdoc-syntax">});
35 };
36
37 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.form.TextField</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.form.Field</span><span class="jsdoc-syntax">,  {
38     </span><span class="jsdoc-comment">/**
39      * @cfg {Boolean} grow True if this field should automatically grow and shrink to its content
40      */
41     </span><span class="jsdoc-var">grow </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
42     </span><span class="jsdoc-comment">/**
43      * @cfg {Number} growMin The minimum width to allow when grow = true (defaults to 30)
44      */
45     </span><span class="jsdoc-var">growMin </span><span class="jsdoc-syntax">: 30,
46     </span><span class="jsdoc-comment">/**
47      * @cfg {Number} growMax The maximum width to allow when grow = true (defaults to 800)
48      */
49     </span><span class="jsdoc-var">growMax </span><span class="jsdoc-syntax">: 800,
50     </span><span class="jsdoc-comment">/**
51      * @cfg {String} vtype A validation type name as defined in {@link Roo.form.VTypes} (defaults to null)
52      */
53     </span><span class="jsdoc-var">vtype </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
54     </span><span class="jsdoc-comment">/**
55      * @cfg {String} maskRe An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)
56      */
57     </span><span class="jsdoc-var">maskRe </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
58     </span><span class="jsdoc-comment">/**
59      * @cfg {Boolean} disableKeyFilter True to disable input keystroke filtering (defaults to false)
60      */
61     </span><span class="jsdoc-var">disableKeyFilter </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
62     </span><span class="jsdoc-comment">/**
63      * @cfg {Boolean} allowBlank False to validate that the value length &gt; 0 (defaults to true)
64      */
65     </span><span class="jsdoc-var">allowBlank </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
66     </span><span class="jsdoc-comment">/**
67      * @cfg {Number} minLength Minimum input field length required (defaults to 0)
68      */
69     </span><span class="jsdoc-var">minLength </span><span class="jsdoc-syntax">: 0,
70     </span><span class="jsdoc-comment">/**
71      * @cfg {Number} maxLength Maximum input field length allowed (defaults to Number.MAX_VALUE)
72      */
73     </span><span class="jsdoc-var">maxLength </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">Number.MAX_VALUE</span><span class="jsdoc-syntax">,
74     </span><span class="jsdoc-comment">/**
75      * @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;)
76      */
77     </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">,
78     </span><span class="jsdoc-comment">/**
79      * @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;)
80      */
81     </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">,
82     </span><span class="jsdoc-comment">/**
83      * @cfg {Boolean} selectOnFocus True to automatically select any existing field text when the field receives input focus (defaults to false)
84      */
85     </span><span class="jsdoc-var">selectOnFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
86     </span><span class="jsdoc-comment">/**
87      * @cfg {Boolean} allowLeadingSpace True to prevent the stripping of leading white space 
88      */
89     </span><span class="jsdoc-var">allowLeadingSpace </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
90     </span><span class="jsdoc-comment">/**
91      * @cfg {String} blankText Error text to display if the allow blank validation fails (defaults to &quot;This field is required&quot;)
92      */
93     </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">,
94     </span><span class="jsdoc-comment">/**
95      * @cfg {Function} validator A custom validation function to be called during field validation (defaults to null).
96      * If available, this function will be called only after the basic validators all return true, and will be passed the
97      * current field value and expected to return boolean true if the value is valid or a string error message if invalid.
98      */
99     </span><span class="jsdoc-var">validator </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
100     </span><span class="jsdoc-comment">/**
101      * @cfg {RegExp} regex A JavaScript RegExp object to be tested against the field value during validation (defaults to null).
102      * If available, this regex will be evaluated only after the basic validators all return true, and will be passed the
103      * current field value.  If the test fails, the field will be marked invalid using {@link #regexText}.
104      */
105     </span><span class="jsdoc-var">regex </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
106     </span><span class="jsdoc-comment">/**
107      * @cfg {String} regexText The error text to display if {@link #regex} is used and the test fails during validation (defaults to &quot;&quot;)
108      */
109     </span><span class="jsdoc-var">regexText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">,
110     </span><span class="jsdoc-comment">/**
111      * @cfg {String} emptyText The default text to display in an empty field - placeholder... (defaults to null).
112      */
113     </span><span class="jsdoc-var">emptyText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
114
115
116     </span><span class="jsdoc-comment">// private
117     </span><span class="jsdoc-var">initEvents </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
118     {
119         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.emptyText</span><span class="jsdoc-syntax">) {
120             </span><span class="jsdoc-var">this.el.attr</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'placeholder'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.emptyText</span><span class="jsdoc-syntax">);
121         }
122
123         </span><span class="jsdoc-var">Roo.form.TextField.superclass.initEvents.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
124         </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">){
125             </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">);
126             </span><span class="jsdoc-var">this.el.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">);
127         }
128         </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">){
129             </span><span class="jsdoc-var">this.el.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">});
130         }
131
132         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectOnFocus</span><span class="jsdoc-syntax">){
133             </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">);
134         }
135         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.allowLeadingSpace</span><span class="jsdoc-syntax">) {
136             </span><span class="jsdoc-var">this.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'blur'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.cleanLeadingSpace</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
137         }
138
139         </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">]))){
140             </span><span class="jsdoc-var">this.el.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">);
141         }
142         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.grow</span><span class="jsdoc-syntax">){
143             </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;keyup&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onKeyUp</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">:50});
144             </span><span class="jsdoc-var">this.el.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.autoSize</span><span class="jsdoc-syntax">,  </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
145         }
146         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.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">){
147             </span><span class="jsdoc-var">this.el.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">);
148         }
149     },
150
151     </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">){
152         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.stripCharsRe</span><span class="jsdoc-syntax">){
153             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">newValue </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">value.replace</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.stripCharsRe</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
154             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newValue </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">){
155                 </span><span class="jsdoc-var">this.setRawValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">newValue</span><span class="jsdoc-syntax">);
156                 </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">newValue</span><span class="jsdoc-syntax">;
157             }
158         }
159         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">;
160     },
161
162     </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">){
163         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">e.isNavKeyPress</span><span class="jsdoc-syntax">()){
164             </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">);
165         }
166     },
167
168     </span><span class="jsdoc-comment">// private
169     </span><span class="jsdoc-var">onKeyUp </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">){
170         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">e.isNavKeyPress</span><span class="jsdoc-syntax">()){
171             </span><span class="jsdoc-var">this.autoSize</span><span class="jsdoc-syntax">();
172         }
173     },
174     </span><span class="jsdoc-comment">// private - clean the leading white space
175     </span><span class="jsdoc-var">cleanLeadingSpace </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">)
176     {
177         </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">'file'</span><span class="jsdoc-syntax">) {
178             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
179         }
180
181         </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">((</span><span class="jsdoc-var">this.getValue</span><span class="jsdoc-syntax">() + </span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">)</span><span class="jsdoc-var">.replace</span><span class="jsdoc-syntax">(/^\s+/,</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">));
182     },
183     </span><span class="jsdoc-comment">/**
184      * Resets the current field value to the originally-loaded value and clears any validation messages.
185      *  
186      */
187     </span><span class="jsdoc-var">reset </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
188         </span><span class="jsdoc-var">Roo.form.TextField.superclass.reset.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
189
190     },
191     </span><span class="jsdoc-comment">// private
192     </span><span class="jsdoc-var">preFocus </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
193
194         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selectOnFocus</span><span class="jsdoc-syntax">){
195             </span><span class="jsdoc-var">this.el.dom.select</span><span class="jsdoc-syntax">();
196         }
197     },
198
199
200     </span><span class="jsdoc-comment">// private
201     </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">){
202         </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">();
203         </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))){
204             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
205         }
206         </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">);
207         </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">)){
208             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
209         }
210         </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">)){
211             </span><span class="jsdoc-var">e.stopEvent</span><span class="jsdoc-syntax">();
212         }
213     },
214
215     </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">){
216
217         </span><span class="jsdoc-var">Roo.form.TextField.superclass.setValue.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">arguments</span><span class="jsdoc-syntax">);
218
219         </span><span class="jsdoc-var">this.autoSize</span><span class="jsdoc-syntax">();
220     },
221
222     </span><span class="jsdoc-comment">/**
223      * Validates a value according to the field's validation rules and marks the field as invalid
224      * if the validation fails
225      * @param {Mixed} value The value to validate
226      * @return {Boolean} True if the value is valid, else false
227      */
228     </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">){
229         </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
230              </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.allowBlank</span><span class="jsdoc-syntax">){
231                 </span><span class="jsdoc-var">this.clearInvalid</span><span class="jsdoc-syntax">();
232                 </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
233              }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
234                 </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.blankText</span><span class="jsdoc-syntax">);
235                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
236              }
237         }
238         </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">){
239             </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">));
240             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
241         }
242         </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">){
243             </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">));
244             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
245         }
246         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.vtype</span><span class="jsdoc-syntax">){
247             </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">;
248                         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">value.trim</span><span class="jsdoc-syntax">() != </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">) { </span><span class="jsdoc-comment">// trim before checking email (and other stuf??)
249                                 </span><span class="jsdoc-var">value </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">value.trim</span><span class="jsdoc-syntax">();
250                                 </span><span class="jsdoc-var">this.el.dom.value  </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">value</span><span class="jsdoc-syntax">;
251                         }
252
253             </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">)){
254                 </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">]);
255                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
256             }
257         }
258         </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">){
259             </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">);
260             </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">){
261                 </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">msg</span><span class="jsdoc-syntax">);
262                 </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
263             }
264         }
265         </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">)){
266             </span><span class="jsdoc-var">this.markInvalid</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.regexText</span><span class="jsdoc-syntax">);
267             </span><span class="jsdoc-keyword">return false</span><span class="jsdoc-syntax">;
268         }
269         </span><span class="jsdoc-keyword">return true</span><span class="jsdoc-syntax">;
270     },
271
272     </span><span class="jsdoc-comment">/**
273      * Selects text in this field
274      * @param {Number} start (optional) The index where the selection should start (defaults to 0)
275      * @param {Number} end (optional) The index where the selection should end (defaults to the text length)
276      */
277     </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">){
278         </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">();
279         </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){
280             </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">;
281             </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">;
282             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el.dom</span><span class="jsdoc-syntax">;
283             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d.setSelectionRange</span><span class="jsdoc-syntax">){
284                 </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">);
285             }</span><span class="jsdoc-keyword">else if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">d.createTextRange</span><span class="jsdoc-syntax">){
286                 </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">();
287                 </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">);
288                 </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">);
289                 </span><span class="jsdoc-var">range.select</span><span class="jsdoc-syntax">();
290             }
291         }
292     },
293
294     </span><span class="jsdoc-comment">/**
295      * Automatically grows the field to accomodate the width of the text up to the maximum field width allowed.
296      * This only takes effect if grow = true, and fires the autosize event.
297      */
298     </span><span class="jsdoc-var">autoSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
299         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.grow </span><span class="jsdoc-syntax">|| !</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
300             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
301         }
302         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.metrics</span><span class="jsdoc-syntax">){
303             </span><span class="jsdoc-var">this.metrics </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.util.TextMetrics.createInstance</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">);
304         }
305         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">el </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.el</span><span class="jsdoc-syntax">;
306         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">el.dom.value</span><span class="jsdoc-syntax">;
307         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">document.createElement</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'div'</span><span class="jsdoc-syntax">);
308         </span><span class="jsdoc-var">d.appendChild</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">document.createTextNode</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">));
309         </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">d.innerHTML</span><span class="jsdoc-syntax">;
310         </span><span class="jsdoc-var">d </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">;
311         </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">+= </span><span class="jsdoc-string">&quot;&amp;#160;&quot;</span><span class="jsdoc-syntax">;
312         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">w </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Math.min</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.growMax</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Math.max</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.metrics.getWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">v</span><span class="jsdoc-syntax">) + </span><span class="jsdoc-comment">/* add extra padding */ </span><span class="jsdoc-syntax">10, </span><span class="jsdoc-var">this.growMin</span><span class="jsdoc-syntax">));
313         </span><span class="jsdoc-var">this.el.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">w</span><span class="jsdoc-syntax">);
314         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;autosize&quot;</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">);
315     },
316
317     </span><span class="jsdoc-comment">// private
318     </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">)
319     {
320         </span><span class="jsdoc-comment">// this is a workaround for a password hang bug on chrome/ webkit.
321
322         </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">;
323
324         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.el.dom.selectionEnd </span><span class="jsdoc-syntax">&gt; 0){
325             </span><span class="jsdoc-var">isSelectAll </span><span class="jsdoc-syntax">= (</span><span class="jsdoc-var">this.el.dom.selectionEnd </span><span class="jsdoc-syntax">- </span><span class="jsdoc-var">this.el.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">;
326         }
327         </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
328             </span><span class="jsdoc-var">event.preventDefault</span><span class="jsdoc-syntax">();
329             </span><span class="jsdoc-var">this.setValue</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">''</span><span class="jsdoc-syntax">);
330             </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
331         }
332
333         </span><span class="jsdoc-comment">// skip handling paste
334         </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 &amp;&amp; !(</span><span class="jsdoc-var">event.ctrlKey </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">event.getCharCode</span><span class="jsdoc-syntax">() == 86)){ </span><span class="jsdoc-comment">// backspace and delete key
335
336             </span><span class="jsdoc-var">event.preventDefault</span><span class="jsdoc-syntax">();
337             </span><span class="jsdoc-comment">// this is very hacky as keydown always get's upper case.
338
339             </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">());
340
341
342             </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">());
343
344         }
345
346
347     }
348 });</span></code></body></html>
RooJS - Version 1