1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
4 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
7 <meta http-equiv="content-type" content="text/html; charset=undefined" />
8 <meta name="generator" content="JsDoc Toolkit" />
11 <title>JsDoc Reference - Roo.form.TextField</title>
14 <link rel="stylesheet" type="text/css" href="../../css/roojs.css" />
15 <link rel="stylesheet" type="text/css" href="../default.css" />
18 <script type="text/javascript" src="../page.js">
25 <body onload="RooDocsPage.onload();">
28 <div class="body-wrap">
30 <!-- ============================== links to methods. ================================= -->
32 <div class="top-tools">
34 <a class="inner-link" href="#Roo.form.TextField-props"><img src="resources/s.gif" class="item-icon icon-prop">Properties</a>
35 <a class="inner-link" href="#Roo.form.TextField-methods"><img src="resources/s.gif" class="item-icon icon-method">Methods</a>
36 <a class="inner-link" href="#Roo.form.TextField-events"><img src="resources/s.gif" class="item-icon icon-event">Events</a>
37 <a class="inner-link" href="#Roo.form.TextField-configs"><img src="resources/s.gif" class="item-icon icon-config">Config Options</a>
38 <a class="bookmark" href="NEED_TO_CREATE_DIRECT_LINK_HREF"><img src="resources/s.gif" class="item-icon icon-fav">Direct Link</a>
43 <!-- ============================== inheritance Block. ================================= -->
45 <div class="inheritance res-block">
46 <pre class="res-block-inner"><a href="./Roo.form.Field.html#constructor" roo:cls="Roo.form.Field.html#constructor">Roo.form.Field</a>
47 <img src="../../images/default/s.gif" height="1" width="20"/><img class="elbow" src="../../images/default/tree/elbow-end.gif"/>Roo.form.TextField
52 <!-- ============================== class title / details ============================ -->
55 <h1 class="classTitle">
57 Class Roo.form.TextField
60 <table cellspacing="0" class="class-summary-table">
62 <tr><td class="label">Package:</td><td class="hd-info">Roo.form</td></tr>
64 <tr><td class="label">Defined In:</td><td class="hd-info">
66 <a href="./src/Roo_form_TextField.js.html">Roo/form/TextField.js</a>.
69 <tr><td class="label">Class:</td><td class="hd-info">TextField</td></tr>
74 <tr><td class="label">Extends:</td><td class="hd-info">
75 <a href="./Roo.form.Field.html#constructor" roo:cls="Roo.form.Field.html#constructor">Roo.form.Field</a>
83 <!-- ============================== class summary ========================== -->
84 <div class="description">
85 Basic text field. Can be used as a direct replacement for traditional text inputs, or as the base<br/>class for more sophisticated input controls (like {<b>link</b> Roo.form.TextArea} and {<b>link</b> Roo.form.ComboBox}).
89 <!-- ============================== Class comment block... ========================== -->
91 <div class="comments">
92 <b>Class Comments / Notes</B> =>
93 <u onclick="parent.CommentDialog.showCommentId = 'Roo.form.TextField';">[Add Your comment/notes about this class]</u>
95 <iframe frameborder="0" id="comments-Roo.form" style="border: none;width:100%;"
96 src="/blog.php/GtkDjsComments/Roo.form.TextField.html"></iframe>
101 <!-- ============================== config options ========================== -->
106 <div class="hr"></div>
107 <a id="Roo.form.TextField-configs"></a>
113 <table cellspacing="0" class="member-table">
114 <caption>Config Options (Usually are also Properties)</caption>
118 <th class="sig-header" colspan="2">Options</th>
120 <th class="msource-header">Defined By</th>
127 <tr class="config-row expandable config-row-alt0 notInherited">
128 <td class="micon"><a class="exi" href="#expand"> </a></td>
131 <a id="Roo.form.TextField-cfg-allowBlank" name=".allowBlank"></a>
132 <div class="fixedFont">
133 <b class="itemname">allowBlank</b> : <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a>
139 <div class="short">False to validate that the value length > 0 (defaults to true)</div>
143 <div class="long">False to validate that the value length > 0 (defaults to true)</div>
157 <tr class="config-row expandable config-row-alt1 notInherited">
158 <td class="micon"><a class="exi" href="#expand"> </a></td>
161 <a id="Roo.form.TextField-cfg-blankText" name=".blankText"></a>
162 <div class="fixedFont">
163 <b class="itemname">blankText</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
169 <div class="short">Error text to display if the allow blank validation fails (defaults to "This field is required")</div>
173 <div class="long">Error text to display if the allow blank validation fails (defaults to "This field is required")</div>
187 <tr class="config-row expandable config-row-alt0 notInherited">
188 <td class="micon"><a class="exi" href="#expand"> </a></td>
191 <a id="Roo.form.TextField-cfg-disableKeyFilter" name=".disableKeyFilter"></a>
192 <div class="fixedFont">
193 <b class="itemname">disableKeyFilter</b> : <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a>
199 <div class="short">True to disable input keystroke filtering (defaults to false)</div>
203 <div class="long">True to disable input keystroke filtering (defaults to false)</div>
217 <tr class="config-row expandable config-row-alt1 notInherited">
218 <td class="micon"><a class="exi" href="#expand"> </a></td>
221 <a id="Roo.form.TextField-cfg-emptyClass" name=".emptyClass"></a>
222 <div class="fixedFont">
223 <b class="itemname">emptyClass</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
229 <div class="short">The CSS class to apply to an empty field to style the {<b>link</b> <b>emptyText</b>} (defaults to<br/>'x-form-empty-field').</div>
233 <div class="long">The CSS class to apply to an empty field to style the {<b>link</b> <b>emptyText</b>} (defaults to<br/>'x-form-empty-field'). This class is automatically added and removed as needed depending on the current field value.</div>
247 <tr class="config-row expandable config-row-alt0 notInherited">
248 <td class="micon"><a class="exi" href="#expand"> </a></td>
251 <a id="Roo.form.TextField-cfg-emptyText" name=".emptyText"></a>
252 <div class="fixedFont">
253 <b class="itemname">emptyText</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
259 <div class="short">The default text to display in an empty field (defaults to null).</div>
263 <div class="long">The default text to display in an empty field (defaults to null).</div>
277 <tr class="config-row expandable config-row-alt1 notInherited">
278 <td class="micon"><a class="exi" href="#expand"> </a></td>
281 <a id="Roo.form.TextField-cfg-grow" name=".grow"></a>
282 <div class="fixedFont">
283 <b class="itemname">grow</b> : <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a>
289 <div class="short">True if this field should automatically grow and shrink to its content</div>
293 <div class="long">True if this field should automatically grow and shrink to its content</div>
307 <tr class="config-row expandable config-row-alt0 notInherited">
308 <td class="micon"><a class="exi" href="#expand"> </a></td>
311 <a id="Roo.form.TextField-cfg-growMax" name=".growMax"></a>
312 <div class="fixedFont">
313 <b class="itemname">growMax</b> : <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a>
319 <div class="short">The maximum width to allow when grow = true (defaults to 800)</div>
323 <div class="long">The maximum width to allow when grow = true (defaults to 800)</div>
337 <tr class="config-row expandable config-row-alt1 notInherited">
338 <td class="micon"><a class="exi" href="#expand"> </a></td>
341 <a id="Roo.form.TextField-cfg-growMin" name=".growMin"></a>
342 <div class="fixedFont">
343 <b class="itemname">growMin</b> : <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a>
349 <div class="short">The minimum width to allow when grow = true (defaults to 30)</div>
353 <div class="long">The minimum width to allow when grow = true (defaults to 30)</div>
367 <tr class="config-row expandable config-row-alt0 notInherited">
368 <td class="micon"><a class="exi" href="#expand"> </a></td>
371 <a id="Roo.form.TextField-cfg-maskRe" name=".maskRe"></a>
372 <div class="fixedFont">
373 <b class="itemname">maskRe</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
379 <div class="short">An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)</div>
383 <div class="long">An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)</div>
397 <tr class="config-row expandable config-row-alt1 notInherited">
398 <td class="micon"><a class="exi" href="#expand"> </a></td>
401 <a id="Roo.form.TextField-cfg-maxLength" name=".maxLength"></a>
402 <div class="fixedFont">
403 <b class="itemname">maxLength</b> : <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a>
409 <div class="short">Maximum input field length allowed (defaults to Number.MAX_VALUE)</div>
413 <div class="long">Maximum input field length allowed (defaults to Number.MAX_VALUE)</div>
427 <tr class="config-row expandable config-row-alt0 notInherited">
428 <td class="micon"><a class="exi" href="#expand"> </a></td>
431 <a id="Roo.form.TextField-cfg-maxLengthText" name=".maxLengthText"></a>
432 <div class="fixedFont">
433 <b class="itemname">maxLengthText</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
439 <div class="short">Error text to display if the maximum length validation fails (defaults to "The maximum length for this field is {maxLength}")</div>
443 <div class="long">Error text to display if the maximum length validation fails (defaults to "The maximum length for this field is {maxLength}")</div>
457 <tr class="config-row expandable config-row-alt1 notInherited">
458 <td class="micon"><a class="exi" href="#expand"> </a></td>
461 <a id="Roo.form.TextField-cfg-minLength" name=".minLength"></a>
462 <div class="fixedFont">
463 <b class="itemname">minLength</b> : <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a>
469 <div class="short">Minimum input field length required (defaults to 0)</div>
473 <div class="long">Minimum input field length required (defaults to 0)</div>
487 <tr class="config-row expandable config-row-alt0 notInherited">
488 <td class="micon"><a class="exi" href="#expand"> </a></td>
491 <a id="Roo.form.TextField-cfg-minLengthText" name=".minLengthText"></a>
492 <div class="fixedFont">
493 <b class="itemname">minLengthText</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
499 <div class="short">Error text to display if the minimum length validation fails (defaults to "The minimum length for this field is {minLength}")</div>
503 <div class="long">Error text to display if the minimum length validation fails (defaults to "The minimum length for this field is {minLength}")</div>
517 <tr class="config-row expandable config-row-alt1 notInherited">
518 <td class="micon"><a class="exi" href="#expand"> </a></td>
521 <a id="Roo.form.TextField-cfg-regex" name=".regex"></a>
522 <div class="fixedFont">
523 <b class="itemname">regex</b> : RegExp
529 <div class="short">A JavaScript RegExp object to be tested against the field value during validation (defaults to null).</div>
533 <div class="long">A JavaScript RegExp object to be tested against the field value during validation (defaults to null).<br/>If available, this regex will be evaluated only after the basic validators all return true, and will be passed the<br/>current field value. If the test fails, the field will be marked invalid using {<b>link</b> <b>regexText</b>}.</div>
547 <tr class="config-row expandable config-row-alt0 notInherited">
548 <td class="micon"><a class="exi" href="#expand"> </a></td>
551 <a id="Roo.form.TextField-cfg-regexText" name=".regexText"></a>
552 <div class="fixedFont">
553 <b class="itemname">regexText</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
559 <div class="short">The error text to display if {<b>link</b> <b>regex</b>} is used and the test fails during validation (defaults to "")</div>
563 <div class="long">The error text to display if {<b>link</b> <b>regex</b>} is used and the test fails during validation (defaults to "")</div>
577 <tr class="config-row expandable config-row-alt1 notInherited">
578 <td class="micon"><a class="exi" href="#expand"> </a></td>
581 <a id="Roo.form.TextField-cfg-selectOnFocus" name=".selectOnFocus"></a>
582 <div class="fixedFont">
583 <b class="itemname">selectOnFocus</b> : <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a>
589 <div class="short">True to automatically select any existing field text when the field receives input focus (defaults to false)</div>
593 <div class="long">True to automatically select any existing field text when the field receives input focus (defaults to false)</div>
607 <tr class="config-row expandable config-row-alt0 notInherited">
608 <td class="micon"><a class="exi" href="#expand"> </a></td>
611 <a id="Roo.form.TextField-cfg-validator" name=".validator"></a>
612 <div class="fixedFont">
613 <b class="itemname">validator</b> : <a href="./Function.html#constructor" roo:cls="Function.html#constructor">Function</a>
619 <div class="short">A custom validation function to be called during field validation (defaults to null).</div>
623 <div class="long">A custom validation function to be called during field validation (defaults to null).<br/>If available, this function will be called only after the basic validators all return true, and will be passed the<br/>current field value and expected to return boolean true if the value is valid or a string error message if invalid.</div>
637 <tr class="config-row expandable config-row-alt1 notInherited">
638 <td class="micon"><a class="exi" href="#expand"> </a></td>
641 <a id="Roo.form.TextField-cfg-vtype" name=".vtype"></a>
642 <div class="fixedFont">
643 <b class="itemname">vtype</b> : <a href="./String.html#constructor" roo:cls="String.html#constructor">String</a>
649 <div class="short">A validation type name as defined in {<b>link</b> Roo.form.VTypes} (defaults to null)</div>
653 <div class="long">A validation type name as defined in {<b>link</b> Roo.form.VTypes} (defaults to null)</div>
677 <!-- ============================== public properties ==================== -->
681 <a id="Roo.form.TextField-props"></a>
687 <table cellspacing="0" class="member-table">
688 <caption class="Empty">Public Properties - Has None</caption>
694 <!-- ============================== methods summary / details ======================== -->
697 <a id="Roo.form.TextField-methods"></a>
698 <!-- constructor?? -->
705 <!-- then dynamics first -->
712 <table cellspacing="0" class="member-table">
713 <caption>Public Methods</caption>
715 <th class="sig-header" colspan="2">Method</th>
716 <th class="msource-header">Defined By</th>
726 <tr class="method-row config-row-alt0 expandable notInherited">
727 <td class="micon"><a class="exi" href="#expand"> </a></td>
731 <a id="Roo.form-method-TextField" name=".TextField"></a>
732 <div class="fixedFont">
733 <span class="attributes">new <B>Roo.form.</B></span><b class="itemname">TextField</b>
735 (<a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a> <B><i>config</i></B>)
743 <div class="short">Create a new Roo.form.TextField</div>
750 Create a new Roo.form.TextField
753 <dl class="detailList">
754 <dt class="heading">Parameters:</dt>
757 <span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Object">Object</a></span> <b>config</b>
760 <dd>Configuration options</dd>
784 <tr class="method-row config-row-alt1 expandable notInherited">
785 <td class="micon"><a class="exi" href="#expand"> </a></td>
789 <a id="Roo.form.TextField-method-autoSize" name=".autoSize"></a>
790 <div class="fixedFont">
791 <span class="attributes"></span><b class="itemname">autoSize</b>
800 <div class="short">Automatically grows the field to accomodate the width of the text up to the maximum field width allowed.</div>
806 Automatically grows the field to accomodate the width of the text up to the maximum field width allowed.<br/>This only takes effect if grow = true, and fires the autosize event.
835 <tr class="method-row config-row-alt0 expandable notInherited">
836 <td class="micon"><a class="exi" href="#expand"> </a></td>
840 <a id="Roo.form.TextField-method-reset" name=".reset"></a>
841 <div class="fixedFont">
842 <span class="attributes"></span><b class="itemname">reset</b>
851 <div class="short">Resets the current field value to the originally-loaded value and clears any validation messages.</div>
857 Resets the current field value to the originally-loaded value and clears any validation messages.<br/>Also adds emptyText and emptyClass if the original value was blank.
886 <tr class="method-row config-row-alt1 expandable notInherited">
887 <td class="micon"><a class="exi" href="#expand"> </a></td>
891 <a id="Roo.form.TextField-method-selectText" name=".selectText"></a>
892 <div class="fixedFont">
893 <span class="attributes"></span><b class="itemname">selectText</b>
895 (<a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a> <B><i>start</i></B>, <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a> <B><i>end</i></B>)
902 <div class="short">Selects text in this field</div>
908 Selects text in this field
915 <dl class="detailList">
916 <dt class="heading">Parameters:</dt>
919 <span class="fixedFont"><a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a></span> <b>start</b>
922 <dd>(optional) The index where the selection should start (defaults to 0)</dd>
925 <span class="fixedFont"><a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a></span> <b>end</b>
928 <dd>(optional) The index where the selection should end (defaults to the text length)</dd>
954 <tr class="method-row config-row-alt0 expandable notInherited">
955 <td class="micon"><a class="exi" href="#expand"> </a></td>
959 <a id="Roo.form.TextField-method-validateValue" name=".validateValue"></a>
960 <div class="fixedFont">
961 <span class="attributes"></span><b class="itemname">validateValue</b>
963 (Mixed <B><i>value</i></B>)
969 <a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a>
978 <div class="short">Validates a value according to the field's validation rules and marks the field as invalid<br/>if the validation fails</div>
984 Validates a value according to the field's validation rules and marks the field as invalid<br/>if the validation fails
991 <dl class="detailList">
992 <dt class="heading">Parameters:</dt>
995 <span class="fixedFont">Mixed</span> <b>value</b>
998 <dd>The value to validate</dd>
1006 <dl class="detailList">
1007 <dt class="heading">Returns:</dt>
1009 <dd><span class="fixedFont"><a href="http://developer.mozilla.org/en/docs/Core_JavaScript_1.5_Reference:Global_Objects:Boolean">Boolean</a></span> True if the value is valid, else false</dd>
1023 <td class="msource">
1034 <!-- ============================== events summary / details ======================== -->
1037 <a id="Roo.form.TextField-events"></a>
1046 <table cellspacing="0" class="member-table">
1047 <caption>Events</caption>
1050 <th class="sig-header" colspan="2">Event</th>
1051 <th class="msource-header">Defined By</th>
1060 <tr class="method-row expandable config-row-alt0 notInherited">
1061 <td class="micon"><a class="exi" href="#expand"> </a></td>
1064 <a id="Roo.form.TextField-event-*autosize"></a>
1066 <div class="fixedFont">
1067 <b class="itemname">autosize</b> (<a href="./Roo.form.Field.html#constructor" roo:cls="Roo.form.Field.html#constructor">Roo.form.Field</a> <B><i>this</i></B>, <a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a> <B><i>width</i></B>)
1073 <div class="short">Fires when the autosize function is triggered.
1079 Fires when the autosize function is triggered. The field may or may not have actually changed size<br/>according to the default logic, but this event provides a hook for the developer to apply additional<br/>logic at runtime to resize the field if needed.
1085 <dl class="detailList">
1086 <dt class="heading">Parameters:</dt>
1089 <span class="fixedFont"><a href="./Roo.form.Field.html#constructor" roo:cls="Roo.form.Field.html#constructor">Roo.form.Field</a></span> <b>this</b>
1092 <dd>This text field</dd>
1095 <span class="fixedFont"><a href="./Number.html#constructor" roo:cls="Number.html#constructor">Number</a></span> <b>width</b>
1098 <dd>The new field width</dd>
1116 <td class="msource">
1128 <!-- ============================== footer ================================= -->
1129 <div class="fineprint" style="clear:both">
1131 Documentation generated by <a href="http://www.akbkhome.com" target="_blankt">Introspection Doc Generator</a> on Fri Jul 16 2010 16:43:12 GMT+0800 (HKT)
1133 <a href="http://www.jsdoctoolkit.org/" target="_blank">JsDoc Toolkit</a>