projects / roojs1 / blob
? search:


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