oqapi/webgui
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
webgui/www/extras/extjs/docs/output/Ext.form.TextField.html

1872 lines
No EOL
106 KiB
HTML
Raw Blame History

<!doctype html public "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Ext.form.TextField</title>
<link rel="stylesheet" type="text/css" href="../resources/reset.css"/>
<link rel="stylesheet" type="text/css" href="../resources/style.css" media="screen"/>
<link rel="stylesheet" type="text/css" href="../resources/print.css" media="print">
<!-- GC -->
</head>
<body>
<div class="body-wrap">
<div class="top-tools">
<img src="../resources/print.gif" width="16" height="16" align="absmiddle">&nbsp;<a href="Ext.form.TextField.html" target="_blank">Print Friendly</a><br/>
</div>
<h1>Class Ext.form.TextField</h1>
<table cellspacing="0">
<tr><td class="label">Package:</td><td>Ext.form</td></tr>
<tr><td class="label">Class:</td><td>TextField</td></tr>
<tr><td class="label">Extends:</td><td><a href="Ext.form.Field.html">Field</a></td></tr>
<tr><td class="label">Subclasses:</td><td><a href="Ext.form.NumberField.html">NumberField</a>, <a href="Ext.form.TextArea.html">TextArea</a>, <a href="Ext.form.TriggerField.html">TriggerField</a></td></tr>
<tr><td class="label">Defined In:</td><td><a href="TextField.jss.html">TextField.js</a></td></tr>
</table>
<div class="description">
Basic text field. Can be used as a direct replacement for traditional text inputs, or as the base
class for more sophisticated input controls (like <a href="Ext.form.TextArea.html">Ext.form.TextArea</a> and <a href="Ext.form.ComboBox.html">Ext.form.ComboBox</a>). </div>
<br />
<a href="#properties">Properties</a>
&nbsp;&nbsp;-&nbsp;&nbsp;<a href="#methods">Methods</a>
&nbsp;&nbsp;-&nbsp;&nbsp;<a href="#events">Events</a>
&nbsp;&nbsp;-&nbsp;&nbsp;<a href="#configs">Config Options</a>
<hr />
<a name="properties"></a>
<h2>Public Properties</h2>
<table cellspacing="0" class="member-table">
<tr>
<th class="sig-header" colspan="2">Property</th>
<th class="msource-header">Defined By</th>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#disabled">disabled</a> : Object</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#disabled">Component</a></td>
</tr>
<tr>
<td class="mdesc">true if this component is disabled. Read-only.</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#disabledClass">disabledClass</a> : Object</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#disabledClass">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">CSS class added to the component when it is disabled.</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#hidden">hidden</a> : Object</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#hidden">Component</a></td>
</tr>
<tr>
<td class="mdesc">true if this component is hidden. Read-only.</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#rendered">rendered</a> : Object</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#rendered">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">true if this component has been rendered. Read-only.</td>
</tr>
</table>
<a name="methods"></a>
<h2>Public Methods</h2>
<table cellspacing="0" class="member-table">
<tr>
<th class="sig-header" colspan="2">Method</th>
<th class="msource-header">Defined By</th>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#TextField">TextField</a>(<code>Object config</code>)</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">Creates a new TextField</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#addEvents">addEvents</a>(<code>Object object</code>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.util.Observable.html#addEvents">Observable</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Copies any events from the passed object onto this object if they do not already exist. The passed object
must also ...</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#addListener">addListener</a>(<code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span>, <span class="optional" title="Optional">[<code>Object options</code>]</span>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.util.Observable.html#addListener">Observable</a></td>
</tr>
<tr>
<td class="mdesc">Appends an event handler to this component</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#applyTo">applyTo</a>(<code>String/HTMLElement/Element el</code>) : Ext.form.Field</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#applyTo">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Apply the behaviors of this component to an existing element. <b>This is used instead of render().</b></td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#autoSize">autoSize</a>() : void</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">Automatically grows the field to accomodate the width of the text up to the maximum field width allowed.
This only ta...</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#clearInvalid">clearInvalid</a>() : void</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#clearInvalid">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Clear any invalid styles/messages for this field</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#disable">disable</a>() : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#disable">Component</a></td>
</tr>
<tr>
<td class="mdesc">Disable this component</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#enable">enable</a>() : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#enable">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Enable this component</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#fireEvent">fireEvent</a>(<code>String eventName</code>, <code>Object... args</code>) : Boolean</td>
<td class="msource" rowspan="2"><a href="Ext.util.Observable.html#fireEvent">Observable</a></td>
</tr>
<tr>
<td class="mdesc">Fires the specified event with the passed parameters (minus the event name).</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#focus">focus</a>(<code>Boolean selectText</code>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#focus">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Try to focus this component</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#getEl">getEl</a>() : Ext.Element</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#getEl">Component</a></td>
</tr>
<tr>
<td class="mdesc">Returns the underlying <a href="Ext.Element.html">Ext.Element</a></td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#getId">getId</a>() : String</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#getId">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Returns the id of this component</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#getName">getName</a>() : String</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#getName">Field</a></td>
</tr>
<tr>
<td class="mdesc">Returns the name attribute of the field if available</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#getRawValue">getRawValue</a>() : Mixed</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#getRawValue">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Returns the raw data value which may or may not be a valid, defined value. To return a normalized value see <a href="#getValue">getValue</a>.</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#getValue">getValue</a>() : Mixed</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#getValue">Field</a></td>
</tr>
<tr>
<td class="mdesc">Returns the normalized data value (undefined or emptyText will be returned as ''). To return the raw value see getRa...</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#hasListener">hasListener</a>(<code>String eventName</code>) : Boolean</td>
<td class="msource" rowspan="2"><a href="Ext.util.Observable.html#hasListener">Observable</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Checks to see if this object is currently listening for a specified event</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#hide">hide</a>() : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#hide">Component</a></td>
</tr>
<tr>
<td class="mdesc">Hide this component</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#isValid">isValid</a>(<code>Boolean preventMark</code>) : Boolean</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#isValid">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Returns whether or not the field value is currently valid</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#isVisible">isVisible</a>() : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#isVisible">Component</a></td>
</tr>
<tr>
<td class="mdesc">Returns true if this component is visible</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#markInvalid">markInvalid</a>(<code>String msg</code>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#markInvalid">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Mark this field as invalid</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#on">on</a>(<code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object options</code>]</span>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.util.Observable.html#on">Observable</a></td>
</tr>
<tr>
<td class="mdesc">Appends an event handler to this element (shorthand for addListener)</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#purgeListeners">purgeListeners</a>() : void</td>
<td class="msource" rowspan="2"><a href="Ext.util.Observable.html#purgeListeners">Observable</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Removes all listeners for this object</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#removeListener">removeListener</a>(<code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.util.Observable.html#removeListener">Observable</a></td>
</tr>
<tr>
<td class="mdesc">Removes a listener</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#render">render</a>(<span class="optional" title="Optional">[<code>String/HTMLElement/Element container</code>]</span>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#render">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">If this is a lazy rendering component, render it to its container element</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#reset">reset</a>() : void</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">Resets the current field value to the originally-loaded value and clears any validation messages.
Also adds emptyText...</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#selectText">selectText</a>(<span class="optional" title="Optional">[<code>Number start</code>]</span>, <span class="optional" title="Optional">[<code>Number end</code>]</span>) : void</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">Selects text in this field</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#setDisabled">setDisabled</a>(<code>Boolean disabled</code>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#setDisabled">Component</a></td>
</tr>
<tr>
<td class="mdesc">Convenience function for setting disabled/enabled by boolean</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#setRawValue">setRawValue</a>(<code>Mixed value</code>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#setRawValue">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Sets the underlying DOM field's value directly, bypassing validation. To set the value with validation see <a href="#setValue">setValue</a>.</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#setSize">setSize</a>(<code>Number width</code>, <code>Number height</code>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#setSize">Field</a></td>
</tr>
<tr>
<td class="mdesc">Sets the height and width of the field</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#setValue">setValue</a>(<code>Mixed value</code>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#setValue">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Sets a data value into the field and validates it. To set the value directly without validation see <a href="#setRawValue">setRawValue</a>.</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#setVisible">setVisible</a>(<code>Boolean visible</code>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#setVisible">Component</a></td>
</tr>
<tr>
<td class="mdesc">Convenience function to hide or show this component by boolean</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#show">show</a>() : void</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#show">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Show this component</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#un">un</a>(<code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span>) : void</td>
<td class="msource" rowspan="2"><a href="Ext.util.Observable.html#un">Observable</a></td>
</tr>
<tr>
<td class="mdesc">Removes a listener (shorthand for removeListener)</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#validate">validate</a>() : Boolean</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#validate">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Validates the field value</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#validateValue">validateValue</a>(<code>Mixed value</code>) : Boolean</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">Validates a value according to the field's validation rules and marks the field as invalid
if the validation fails</td>
</tr>
</table>
<a name="events"></a>
<h2>Public Events</h2>
<table cellspacing="0" class="member-table">
<tr>
<th class="sig-header" colspan="2">Event</th>
<th class="msource-header">Defined By</th>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-autosize">autosize</a> : (<code>Ext.form.Field this</code>, <code>Number width</code>)</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">Fires when the autosize function is triggered. The field may or may not have actually changed size
according to the ...</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-beforedestroy">beforedestroy</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-beforedestroy">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Fires before the component is destroyed</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-beforehide">beforehide</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-beforehide">Component</a></td>
</tr>
<tr>
<td class="mdesc">Fires before the component is hidden</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-beforerender">beforerender</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-beforerender">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Fires before the component is rendered</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-beforeshow">beforeshow</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-beforeshow">Component</a></td>
</tr>
<tr>
<td class="mdesc">Fires before the component is shown</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-blur">blur</a> : (<code>Ext.form.Field this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#event-blur">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Fires when</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-change">change</a> : (<code>Ext.form.Field this</code>, <code>Mixed value</code>, <code>Mixed value</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#event-change">Field</a></td>
</tr>
<tr>
<td class="mdesc">Fires just before the field blurs if the field value has changed</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-destroy">destroy</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-destroy">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Fires after the component is destroyed</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-disable">disable</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-disable">Component</a></td>
</tr>
<tr>
<td class="mdesc">Fires after the component is disabled</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-enable">enable</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-enable">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Fires after the component is enabled</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-focus">focus</a> : (<code>Ext.form.Field this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#event-focus">Field</a></td>
</tr>
<tr>
<td class="mdesc">Fires when this field receives input focus</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-hide">hide</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-hide">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Fires after the component is hidden</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-invalid">invalid</a> : (<code>Ext.form.Field this</code>, <code>String msg</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#event-invalid">Field</a></td>
</tr>
<tr>
<td class="mdesc">Fires after the field has been marked as invalid</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-render">render</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-render">Component</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Fires after the component is rendered</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-show">show</a> : (<code>Ext.Component this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.Component.html#event-show">Component</a></td>
</tr>
<tr>
<td class="mdesc">Fires after the component is shown</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-specialkey">specialkey</a> : (<code>Ext.form.Field this</code>, <code>Ext.EventObject e</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#event-specialkey">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed. You can check
Ext.EventObject.g...</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#event-valid">valid</a> : (<code>Ext.form.Field this</code>)</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#event-valid">Field</a></td>
</tr>
<tr>
<td class="mdesc">Fires after the field has been validated with no errors</td>
</tr>
</table>
<a name="configs"></a>
<h2>Config Options</h2>
<table cellspacing="0" class="member-table">
<tr>
<th class="sig-header" colspan="2">Config Options</th>
<th class="msource-header">Defined By</th>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-allowBlank">allowBlank</a> : Boolean</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">False to validate that the value length > 0 (defaults to true)</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-autoCreate">autoCreate</a> : String/Object</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#autoCreate">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">A DomHelper element spec, or true for a default element spec (defaults to {tag: "input", type: "text", size: "20", au...</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-blankText">blankText</a> : String</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">Error text to display if the allow blank validation fails (defaults to "This field is required")</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-disableKeyFilter">disableKeyFilter</a> : Boolean</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">True to disable input keystroke filtering (defaults to false)</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-emptyClass">emptyClass</a> : String</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">The CSS class to apply to an empty field to style the emptyText (defaults to 'x-form-empty-field'). This class is aut...</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-emptyText">emptyText</a> : String</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">The default text to display in an empty field (defaults to null).</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-fieldClass">fieldClass</a> : String</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#fieldClass">Field</a></td>
</tr>
<tr>
<td class="mdesc">The default CSS class for the field (defaults to "x-form-field")</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-focusClass">focusClass</a> : String</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#focusClass">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">The CSS class to use when the field receives focus (defaults to "x-form-focus")</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-grow">grow</a> : Boolean</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">True if this field should automatically grow and shrink to its content</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-growMax">growMax</a> : Number</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">The maximum width to allow when grow = true (defaults to 800)</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-growMin">growMin</a> : Number</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">The minimum width to allow when grow = true (defaults to 30)</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-inputType">inputType</a> : String</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#inputType">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">The type attribute for input fields - e.g. radio, text, password. (defaults to "text")</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-invalidClass">invalidClass</a> : String</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#invalidClass">Field</a></td>
</tr>
<tr>
<td class="mdesc">The CSS class to use when marking a field invalid (defaults to "x-form-invalid")</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-invalidText">invalidText</a> : String</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#invalidText">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">The error text to use when marking a field invalid and no message is provided (defaults to "The value in this field i...</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-maskRe">maskRe</a> : String</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null)</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-maxLength">maxLength</a> : Number</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">Maximum input field length allowed (defaults to Number.MAX_VALUE)</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-maxLengthText">maxLengthText</a> : String</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">Error text to display if the maximum length validation fails (defaults to "The maximum length for this field is {maxL...</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-minLength">minLength</a> : Number</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">Minimum input field length required (defaults to 0)</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-minLengthText">minLengthText</a> : String</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">Error text to display if the minimum length validation fails (defaults to "The minimum length for this field is {minL...</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-msgFx">msgFx</a> : String</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#msgFx">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc"><b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal').</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-msgTarget">msgTarget</a> : String</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#msgTarget">Field</a></td>
</tr>
<tr>
<td class="mdesc">The location where error text should display. Should be one of the following values (defaults to 'qtip'): Value Desc...</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-regex">regex</a> : RegExp</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">A JavaScript RegExp object to be tested against the field value during validation (defaults to null). If available, t...</td>
</tr>
<tr>
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-regexText">regexText</a> : String</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr>
<td class="mdesc">The error text to display if <a href="#regex">regex</a> is used and the test fails during validation (defaults to "")</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-selectOnFocus">selectOnFocus</a> : Boolean</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">True to automatically select any existing field text when the field receives input focus (defaults to false)</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-validateOnBlur">validateOnBlur</a> : String/Boolean</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#validateOnBlur">Field</a></td>
</tr>
<tr>
<td class="mdesc">Defaults to true.</td>
</tr>
<tr class="alt">
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-validationDelay">validationDelay</a> : Number</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#validationDelay">Field</a></td>
</tr>
<tr class="alt">
<td class="mdesc">The length of time in milliseconds after user input begins until validation is initiated (defaults to 250)</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-validationEvent">validationEvent</a> : String/Boolean</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#validationEvent">Field</a></td>
</tr>
<tr>
<td class="mdesc">The event that should initiate field validation. Set to false to disable automatic validation. (defaults to "keyup")</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-validator">validator</a> : Function</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">A custom validation function to be called during field validation (defaults to null). If available, this function wil...</td>
</tr>
<tr>
<td class="micon inherited" title="Inherited" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-value">value</a> : Mixed</td>
<td class="msource" rowspan="2"><a href="Ext.form.Field.html#value">Field</a></td>
</tr>
<tr>
<td class="mdesc">A value to initialize this field with</td>
</tr>
<tr class="alt">
<td class="micon" rowspan="2">&nbsp;</td>
<td class="sig"><a class="mlink" href="#config-vtype">vtype</a> : String</td>
<td class="msource" rowspan="2">TextField</td>
</tr>
<tr class="alt">
<td class="mdesc">A validation type name as defined in <a href="Ext.form.VTypes.html">Ext.form.VTypes</a> (defaults to null)</td>
</tr>
</table>
<h2 class="mdetail-head">Property Details</h2>
<div class="detail-wrap">
<a name="disabled"></a>
<div class="mdetail">
<h3>disabled</i></h3>
<code>public Object disabled</code>
<div class="mdetail-desc">
true if this component is disabled. Read-only. </div>
<div class="mdetail-def">This property is defined by <a href="Ext.Component.html#disabled">Component</a>.</div>
</div>
<a name="disabledClass"></a>
<div class="mdetail alt">
<h3>disabledClass</i></h3>
<code>public Object disabledClass</code>
<div class="mdetail-desc">
CSS class added to the component when it is disabled. </div>
<div class="mdetail-def">This property is defined by <a href="Ext.Component.html#disabledClass">Component</a>.</div>
</div>
<a name="hidden"></a>
<div class="mdetail">
<h3>hidden</i></h3>
<code>public Object hidden</code>
<div class="mdetail-desc">
true if this component is hidden. Read-only. </div>
<div class="mdetail-def">This property is defined by <a href="Ext.Component.html#hidden">Component</a>.</div>
</div>
<a name="rendered"></a>
<div class="mdetail alt">
<h3>rendered</i></h3>
<code>public Object rendered</code>
<div class="mdetail-desc">
true if this component has been rendered. Read-only. </div>
<div class="mdetail-def">This property is defined by <a href="Ext.Component.html#rendered">Component</a>.</div>
</div>
</div>
<a name="TextField"></a>
<h2 class="mdetail-head">Constructor Details</h2>
<div class="detail-wrap">
<div class="mdetail">
<h3>TextField</i></h3>
<code>public function TextField(<code>Object config</code>)</code>
<div class="mdetail-desc">
Creates a new TextField <div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>config</code> : Object<div class="sub-desc">Configuration options</div></li> </ul>
</div>
</div>
</div>
</div>
<h2 class="mdetail-head">Method Details</h2>
<div class="detail-wrap">
<a name="addEvents"></a>
<div class="mdetail">
<h3>addEvents</i></h3>
<code>public function addEvents(<code>Object object</code>)</code>
<div class="mdetail-desc">
Copies any events from the passed object onto this object if they do not already exist. The passed object
must also inherit from Observable for this method to have any effect.
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>object</code> : Object<div class="sub-desc">The object from which to copy events</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.util.Observable.html#addEvents">Observable</a>.</div>
</div>
<a name="addListener"></a>
<div class="mdetail alt">
<h3>addListener</i></h3>
<code>public function addListener(<code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span>, <span class="optional" title="Optional">[<code>Object options</code>]</span>)</code>
<div class="mdetail-desc">
Appends an event handler to this component
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The method the event invokes</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope in which to execute the handler function. The handler function's "this" context.</div></li><li><code>options</code> : Object<div class="sub-desc">(optional) An object containing handler configuration properties. This may contain any of the following properties:<ul> <li>scope {Object} The scope in which to execute the handler function. The handler function's "this" context.</li> <li>delegate {String} A simple selector to filter the target or look for a descendant of the target</li> <li>stopEvent {Boolean} True to stop the event. That is stop propagation, and prevent the default action.</li> <li>preventDefault {Boolean} True to prevent the default action</li> <li>stopPropagation {Boolean} True to prevent event propagation</li> <li>normalized {Boolean} False to pass a browser event to the handler function instead of an Ext.EventObject</li> <li>delay {Number} The number of milliseconds to delay the invocation of the handler after te event fires.</li> <li>single {Boolean} True to add a handler to handle just the next firing of the event, and then remove itself.</li> <li>buffer {Number} Causes the handler to be scheduled to run in an <a href="Ext.util.DelayedTask.html">Ext.util.DelayedTask</a> delayed by the specified number of milliseconds. If the event fires again within that time, the original handler is <em>not</em> invoked, but the new handler is scheduled in its place.</li> </ul> <p> <b>Combining Options</b><br> Using the options argument, it is possible to combine different types of listeners:<br> <br> A normalized, delayed, one-time listener that auto stops the event and passes a custom argument (forumId)<div style="margin: 5px 20px 20px;"> Code: <pre><code>el.on('click', this.onClick, this, { single: true, delay: 100, stopEvent : true, forumId: 4 });</pre> <p> The method also allows for a single argument to be passed which is a config object containing properties which specify multiple handlers. <p> <b>Attaching multiple handlers in 1 call</b><br> Code: <pre><code>el.on({ 'click' : { fn: this.onClick scope: this, delay: 100 }, 'mouseover' : { fn: this.onMouseOver scope: this }, 'mouseout' : { fn: this.onMouseOut scope: this } });</pre> <p> Or a shorthand syntax:<br> Code: <pre><code>el.on({ 'click' : this.onClick, 'mouseover' : this.onMouseOver, 'mouseout' : this.onMouseOut scope: this });</pre></div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.util.Observable.html#addListener">Observable</a>.</div>
</div>
<a name="applyTo"></a>
<div class="mdetail">
<h3>applyTo</i></h3>
<code>public function applyTo(<code>String/HTMLElement/Element el</code>)</code>
<div class="mdetail-desc">
Apply the behaviors of this component to an existing element. <b>This is used instead of render().</b>
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>el</code> : String/HTMLElement/Element<div class="sub-desc">The id of the node, a DOM Node or an existing Element</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Ext.form.Field</code><div class="sub-desc">this</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#applyTo">Field</a>.</div>
</div>
<a name="autoSize"></a>
<div class="mdetail alt">
<h3>autoSize</i></h3>
<code>public function autoSize()</code>
<div class="mdetail-desc">
Automatically grows the field to accomodate the width of the text up to the maximum field width allowed.
This only takes effect if grow = true and fires the autosize event.
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by TextField.</div>
</div>
<a name="clearInvalid"></a>
<div class="mdetail">
<h3>clearInvalid</i></h3>
<code>public function clearInvalid()</code>
<div class="mdetail-desc">
Clear any invalid styles/messages for this field
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#clearInvalid">Field</a>.</div>
</div>
<a name="disable"></a>
<div class="mdetail alt">
<h3>disable</i></h3>
<code>public function disable()</code>
<div class="mdetail-desc">
Disable this component
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#disable">Component</a>.</div>
</div>
<a name="enable"></a>
<div class="mdetail">
<h3>enable</i></h3>
<code>public function enable()</code>
<div class="mdetail-desc">
Enable this component
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#enable">Component</a>.</div>
</div>
<a name="fireEvent"></a>
<div class="mdetail alt">
<h3>fireEvent</i></h3>
<code>public function fireEvent(<code>String eventName</code>, <code>Object... args</code>)</code>
<div class="mdetail-desc">
Fires the specified event with the passed parameters (minus the event name).
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>eventName</code> : String<div class="sub-desc"></div></li><li><code>args</code> : Object...<div class="sub-desc">Variable number of parameters are passed to handlers</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Boolean</code><div class="sub-desc">returns false if any of the handlers return false otherwise it returns true</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.util.Observable.html#fireEvent">Observable</a>.</div>
</div>
<a name="focus"></a>
<div class="mdetail">
<h3>focus</i></h3>
<code>public function focus(<code>Boolean selectText</code>)</code>
<div class="mdetail-desc">
Try to focus this component
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>selectText</code> : Boolean<div class="sub-desc">True to also select the text in this component (if applicable)</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#focus">Component</a>.</div>
</div>
<a name="getEl"></a>
<div class="mdetail alt">
<h3>getEl</i></h3>
<code>public function getEl()</code>
<div class="mdetail-desc">
Returns the underlying <a href="Ext.Element.html">Ext.Element</a>
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Ext.Element</code><div class="sub-desc">The element</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#getEl">Component</a>.</div>
</div>
<a name="getId"></a>
<div class="mdetail">
<h3>getId</i></h3>
<code>public function getId()</code>
<div class="mdetail-desc">
Returns the id of this component
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>String</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#getId">Component</a>.</div>
</div>
<a name="getName"></a>
<div class="mdetail alt">
<h3>getName</i></h3>
<code>public function getName()</code>
<div class="mdetail-desc">
Returns the name attribute of the field if available
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>String</code><div class="sub-desc">name The field name</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#getName">Field</a>.</div>
</div>
<a name="getRawValue"></a>
<div class="mdetail">
<h3>getRawValue</i></h3>
<code>public function getRawValue()</code>
<div class="mdetail-desc">
Returns the raw data value which may or may not be a valid, defined value. To return a normalized value see <a href="#getValue">getValue</a>.
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Mixed</code><div class="sub-desc">value The field value</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#getRawValue">Field</a>.</div>
</div>
<a name="getValue"></a>
<div class="mdetail alt">
<h3>getValue</i></h3>
<code>public function getValue()</code>
<div class="mdetail-desc">
Returns the normalized data value (undefined or emptyText will be returned as ''). To return the raw value see <a href="#getRawValue">getRawValue</a>.
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Mixed</code><div class="sub-desc">value The field value</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#getValue">Field</a>.</div>
</div>
<a name="hasListener"></a>
<div class="mdetail">
<h3>hasListener</i></h3>
<code>public function hasListener(<code>String eventName</code>)</code>
<div class="mdetail-desc">
Checks to see if this object is currently listening for a specified event
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>eventName</code> : String<div class="sub-desc">The name of the event to check for</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Boolean</code><div class="sub-desc">True if the event is being listened for, else false</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.util.Observable.html#hasListener">Observable</a>.</div>
</div>
<a name="hide"></a>
<div class="mdetail alt">
<h3>hide</i></h3>
<code>public function hide()</code>
<div class="mdetail-desc">
Hide this component
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#hide">Component</a>.</div>
</div>
<a name="isValid"></a>
<div class="mdetail">
<h3>isValid</i></h3>
<code>public function isValid(<code>Boolean preventMark</code>)</code>
<div class="mdetail-desc">
Returns whether or not the field value is currently valid
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>preventMark</code> : Boolean<div class="sub-desc">True to disable marking the field invalid</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Boolean</code><div class="sub-desc">True if the value is valid, else false</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#isValid">Field</a>.</div>
</div>
<a name="isVisible"></a>
<div class="mdetail alt">
<h3>isVisible</i></h3>
<code>public function isVisible()</code>
<div class="mdetail-desc">
Returns true if this component is visible
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#isVisible">Component</a>.</div>
</div>
<a name="markInvalid"></a>
<div class="mdetail">
<h3>markInvalid</i></h3>
<code>public function markInvalid(<code>String msg</code>)</code>
<div class="mdetail-desc">
Mark this field as invalid
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>msg</code> : String<div class="sub-desc">The validation message</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#markInvalid">Field</a>.</div>
</div>
<a name="on"></a>
<div class="mdetail alt">
<h3>on</i></h3>
<code>public function on(<code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object options</code>]</span>)</code>
<div class="mdetail-desc">
Appends an event handler to this element (shorthand for addListener)
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The method the event invokes</div></li><li><code>options</code> : Object<div class="sub-desc">(optional)</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.util.Observable.html#on">Observable</a>.</div>
</div>
<a name="purgeListeners"></a>
<div class="mdetail">
<h3>purgeListeners</i></h3>
<code>public function purgeListeners()</code>
<div class="mdetail-desc">
Removes all listeners for this object
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.util.Observable.html#purgeListeners">Observable</a>.</div>
</div>
<a name="removeListener"></a>
<div class="mdetail alt">
<h3>removeListener</i></h3>
<code>public function removeListener(<code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span>)</code>
<div class="mdetail-desc">
Removes a listener
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The handler to remove</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (this object) for the handler</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.util.Observable.html#removeListener">Observable</a>.</div>
</div>
<a name="render"></a>
<div class="mdetail">
<h3>render</i></h3>
<code>public function render(<span class="optional" title="Optional">[<code>String/HTMLElement/Element container</code>]</span>)</code>
<div class="mdetail-desc">
If this is a lazy rendering component, render it to its container element
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>container</code> : String/HTMLElement/Element<div class="sub-desc">(optional) The element this component should be rendered into. If it is being applied to existing markup, this should be left off.</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#render">Component</a>.</div>
</div>
<a name="reset"></a>
<div class="mdetail alt">
<h3>reset</i></h3>
<code>public function reset()</code>
<div class="mdetail-desc">
Resets the current field value to the originally-loaded value and clears any validation messages.
Also adds emptyText and emptyClass if the original value was blank.
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by TextField.</div>
</div>
<a name="selectText"></a>
<div class="mdetail">
<h3>selectText</i></h3>
<code>public function selectText(<span class="optional" title="Optional">[<code>Number start</code>]</span>, <span class="optional" title="Optional">[<code>Number end</code>]</span>)</code>
<div class="mdetail-desc">
Selects text in this field
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>start</code> : Number<div class="sub-desc">(optional) The index where the selection should start (defaults to 0)</div></li><li><code>end</code> : Number<div class="sub-desc">(optional) The index where the selection should end (defaults to the text length)</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by TextField.</div>
</div>
<a name="setDisabled"></a>
<div class="mdetail alt">
<h3>setDisabled</i></h3>
<code>public function setDisabled(<code>Boolean disabled</code>)</code>
<div class="mdetail-desc">
Convenience function for setting disabled/enabled by boolean
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>disabled</code> : Boolean<div class="sub-desc"></div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#setDisabled">Component</a>.</div>
</div>
<a name="setRawValue"></a>
<div class="mdetail">
<h3>setRawValue</i></h3>
<code>public function setRawValue(<code>Mixed value</code>)</code>
<div class="mdetail-desc">
Sets the underlying DOM field's value directly, bypassing validation. To set the value with validation see <a href="#setValue">setValue</a>.
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>value</code> : Mixed<div class="sub-desc">The value to set</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#setRawValue">Field</a>.</div>
</div>
<a name="setSize"></a>
<div class="mdetail alt">
<h3>setSize</i></h3>
<code>public function setSize(<code>Number width</code>, <code>Number height</code>)</code>
<div class="mdetail-desc">
Sets the height and width of the field
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>width</code> : Number<div class="sub-desc">The new field width in pixels</div></li><li><code>height</code> : Number<div class="sub-desc">The new field height in pixels</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#setSize">Field</a>.</div>
</div>
<a name="setValue"></a>
<div class="mdetail">
<h3>setValue</i></h3>
<code>public function setValue(<code>Mixed value</code>)</code>
<div class="mdetail-desc">
Sets a data value into the field and validates it. To set the value directly without validation see <a href="#setRawValue">setRawValue</a>.
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>value</code> : Mixed<div class="sub-desc">The value to set</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#setValue">Field</a>.</div>
</div>
<a name="setVisible"></a>
<div class="mdetail alt">
<h3>setVisible</i></h3>
<code>public function setVisible(<code>Boolean visible</code>)</code>
<div class="mdetail-desc">
Convenience function to hide or show this component by boolean
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>visible</code> : Boolean<div class="sub-desc">True to show, false to hide</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#setVisible">Component</a>.</div>
</div>
<a name="show"></a>
<div class="mdetail">
<h3>show</i></h3>
<code>public function show()</code>
<div class="mdetail-desc">
Show this component
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.Component.html#show">Component</a>.</div>
</div>
<a name="un"></a>
<div class="mdetail alt">
<h3>un</i></h3>
<code>public function un(<code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span>)</code>
<div class="mdetail-desc">
Removes a listener (shorthand for removeListener)
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The handler to remove</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (this object) for the handler</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>void</code></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.util.Observable.html#un">Observable</a>.</div>
</div>
<a name="validate"></a>
<div class="mdetail">
<h3>validate</i></h3>
<code>public function validate()</code>
<div class="mdetail-desc">
Validates the field value
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li>None.</li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Boolean</code><div class="sub-desc">True if the value is valid, else false</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by <a href="Ext.form.Field.html#validate">Field</a>.</div>
</div>
<a name="validateValue"></a>
<div class="mdetail alt">
<h3>validateValue</i></h3>
<code>public function validateValue(<code>Mixed value</code>)</code>
<div class="mdetail-desc">
Validates a value according to the field's validation rules and marks the field as invalid
if the validation fails
<div class="mdetail-params">
<strong>Parameters:</strong>
<ul><li><code>value</code> : Mixed<div class="sub-desc">The value to validate</div></li> </ul>
<strong>Returns:</strong>
<ul>
<li><code>Boolean</code><div class="sub-desc">True if the value is valid, else false</div></li>
</ul>
</div>
</div>
<div class="mdetail-def">This method is defined by TextField.</div>
</div>
</div>
<h2 class="mdetail-head">Event Details</h2>
<div class="detail-wrap">
<a name="event-autosize"></a>
<div class="mdetail">
<h3>autosize</i></h3>
<code>public event autosize</code>
<div class="mdetail-desc">
Fires when the autosize function is triggered. The field may or may not have actually changed size
according to the default logic, but this event provides a hook for the developer to apply additional
logic at runtime to resize the field if needed.
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.form.Field<div class="sub-desc">This text field</div></li><li><code>width</code> : Number<div class="sub-desc">The new field width</div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by TextField.</div>
</div>
<a name="event-beforedestroy"></a>
<div class="mdetail alt">
<h3>beforedestroy</i></h3>
<code>public event beforedestroy</code>
<div class="mdetail-desc">
Fires before the component is destroyed
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-beforedestroy">Component</a>.</div>
</div>
<a name="event-beforehide"></a>
<div class="mdetail">
<h3>beforehide</i></h3>
<code>public event beforehide</code>
<div class="mdetail-desc">
Fires before the component is hidden
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-beforehide">Component</a>.</div>
</div>
<a name="event-beforerender"></a>
<div class="mdetail alt">
<h3>beforerender</i></h3>
<code>public event beforerender</code>
<div class="mdetail-desc">
Fires before the component is rendered
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-beforerender">Component</a>.</div>
</div>
<a name="event-beforeshow"></a>
<div class="mdetail">
<h3>beforeshow</i></h3>
<code>public event beforeshow</code>
<div class="mdetail-desc">
Fires before the component is shown
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-beforeshow">Component</a>.</div>
</div>
<a name="event-blur"></a>
<div class="mdetail alt">
<h3>blur</i></h3>
<code>public event blur</code>
<div class="mdetail-desc">
Fires when
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.form.Field<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.form.Field.html#event-blur">Field</a>.</div>
</div>
<a name="event-change"></a>
<div class="mdetail">
<h3>change</i></h3>
<code>public event change</code>
<div class="mdetail-desc">
Fires just before the field blurs if the field value has changed
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.form.Field<div class="sub-desc"></div></li><li><code>value</code> : Mixed<div class="sub-desc">The changed value</div></li><li><code>value</code> : Mixed<div class="sub-desc">The original value</div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.form.Field.html#event-change">Field</a>.</div>
</div>
<a name="event-destroy"></a>
<div class="mdetail alt">
<h3>destroy</i></h3>
<code>public event destroy</code>
<div class="mdetail-desc">
Fires after the component is destroyed
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-destroy">Component</a>.</div>
</div>
<a name="event-disable"></a>
<div class="mdetail">
<h3>disable</i></h3>
<code>public event disable</code>
<div class="mdetail-desc">
Fires after the component is disabled
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-disable">Component</a>.</div>
</div>
<a name="event-enable"></a>
<div class="mdetail alt">
<h3>enable</i></h3>
<code>public event enable</code>
<div class="mdetail-desc">
Fires after the component is enabled
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-enable">Component</a>.</div>
</div>
<a name="event-focus"></a>
<div class="mdetail">
<h3>focus</i></h3>
<code>public event focus</code>
<div class="mdetail-desc">
Fires when this field receives input focus
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.form.Field<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.form.Field.html#event-focus">Field</a>.</div>
</div>
<a name="event-hide"></a>
<div class="mdetail alt">
<h3>hide</i></h3>
<code>public event hide</code>
<div class="mdetail-desc">
Fires after the component is hidden
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-hide">Component</a>.</div>
</div>
<a name="event-invalid"></a>
<div class="mdetail">
<h3>invalid</i></h3>
<code>public event invalid</code>
<div class="mdetail-desc">
Fires after the field has been marked as invalid
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.form.Field<div class="sub-desc"></div></li><li><code>msg</code> : String<div class="sub-desc">The validation message</div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.form.Field.html#event-invalid">Field</a>.</div>
</div>
<a name="event-render"></a>
<div class="mdetail alt">
<h3>render</i></h3>
<code>public event render</code>
<div class="mdetail-desc">
Fires after the component is rendered
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-render">Component</a>.</div>
</div>
<a name="event-show"></a>
<div class="mdetail">
<h3>show</i></h3>
<code>public event show</code>
<div class="mdetail-desc">
Fires after the component is shown
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.Component.html#event-show">Component</a>.</div>
</div>
<a name="event-specialkey"></a>
<div class="mdetail alt">
<h3>specialkey</i></h3>
<code>public event specialkey</code>
<div class="mdetail-desc">
Fires when any key related to navigation (arrows, tab, enter, esc, etc.) is pressed. You can check
<a href="Ext.EventObject.html#getKey">Ext.EventObject.getKey</a> to determine which key was pressed.
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.form.Field<div class="sub-desc"></div></li><li><code>e</code> : Ext.EventObject<div class="sub-desc">The event object</div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.form.Field.html#event-specialkey">Field</a>.</div>
</div>
<a name="event-valid"></a>
<div class="mdetail">
<h3>valid</i></h3>
<code>public event valid</code>
<div class="mdetail-desc">
Fires after the field has been validated with no errors
<div class="mdetail-params">
<strong style="font-weight:normal;">Subscribers will be called with the following parameters:</strong>
<ul><li><code>this</code> : Ext.form.Field<div class="sub-desc"></div></li> </ul>
</div>
</div>
<div class="mdetail-def">This event is defined by <a href="Ext.form.Field.html#event-valid">Field</a>.</div>
</div>
</div>
<h2 class="mdetail-head">Config Details</h2>
<div class="detail-wrap">
<a name="config-allowBlank"></a>
<div class="mdetail">
<h3>allowBlank</i></h3>
<code>allowBlank : Boolean</code>
<div class="mdetail-desc">
False to validate that the value length > 0 (defaults to true) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-autoCreate"></a>
<div class="mdetail alt">
<h3>autoCreate</i></h3>
<code>autoCreate : String/Object</code>
<div class="mdetail-desc">
A DomHelper element spec, or true for a default element spec (defaults to {tag: "input", type: "text", size: "20", autocomplete: "off"}) </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#autoCreate">Field</a>.</div>
</div>
<a name="config-blankText"></a>
<div class="mdetail">
<h3>blankText</i></h3>
<code>blankText : String</code>
<div class="mdetail-desc">
Error text to display if the allow blank validation fails (defaults to "This field is required") </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-disableKeyFilter"></a>
<div class="mdetail alt">
<h3>disableKeyFilter</i></h3>
<code>disableKeyFilter : Boolean</code>
<div class="mdetail-desc">
True to disable input keystroke filtering (defaults to false) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-emptyClass"></a>
<div class="mdetail">
<h3>emptyClass</i></h3>
<code>emptyClass : String</code>
<div class="mdetail-desc">
The CSS class to apply to an empty field to style the <a href="#emptyText">emptyText</a> (defaults to 'x-form-empty-field'). This class is automatically added and removed as needed depending on the current field value. </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-emptyText"></a>
<div class="mdetail alt">
<h3>emptyText</i></h3>
<code>emptyText : String</code>
<div class="mdetail-desc">
The default text to display in an empty field (defaults to null). </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-fieldClass"></a>
<div class="mdetail">
<h3>fieldClass</i></h3>
<code>fieldClass : String</code>
<div class="mdetail-desc">
The default CSS class for the field (defaults to "x-form-field") </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#fieldClass">Field</a>.</div>
</div>
<a name="config-focusClass"></a>
<div class="mdetail alt">
<h3>focusClass</i></h3>
<code>focusClass : String</code>
<div class="mdetail-desc">
The CSS class to use when the field receives focus (defaults to "x-form-focus") </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#focusClass">Field</a>.</div>
</div>
<a name="config-grow"></a>
<div class="mdetail">
<h3>grow</i></h3>
<code>grow : Boolean</code>
<div class="mdetail-desc">
True if this field should automatically grow and shrink to its content </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-growMax"></a>
<div class="mdetail alt">
<h3>growMax</i></h3>
<code>growMax : Number</code>
<div class="mdetail-desc">
The maximum width to allow when grow = true (defaults to 800) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-growMin"></a>
<div class="mdetail">
<h3>growMin</i></h3>
<code>growMin : Number</code>
<div class="mdetail-desc">
The minimum width to allow when grow = true (defaults to 30) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-inputType"></a>
<div class="mdetail alt">
<h3>inputType</i></h3>
<code>inputType : String</code>
<div class="mdetail-desc">
The type attribute for input fields - e.g. radio, text, password. (defaults to "text") </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#inputType">Field</a>.</div>
</div>
<a name="config-invalidClass"></a>
<div class="mdetail">
<h3>invalidClass</i></h3>
<code>invalidClass : String</code>
<div class="mdetail-desc">
The CSS class to use when marking a field invalid (defaults to "x-form-invalid") </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#invalidClass">Field</a>.</div>
</div>
<a name="config-invalidText"></a>
<div class="mdetail alt">
<h3>invalidText</i></h3>
<code>invalidText : String</code>
<div class="mdetail-desc">
The error text to use when marking a field invalid and no message is provided (defaults to "The value in this field is invalid") </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#invalidText">Field</a>.</div>
</div>
<a name="config-maskRe"></a>
<div class="mdetail">
<h3>maskRe</i></h3>
<code>maskRe : String</code>
<div class="mdetail-desc">
An input mask regular expression that will be used to filter keystrokes that don't match (defaults to null) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-maxLength"></a>
<div class="mdetail alt">
<h3>maxLength</i></h3>
<code>maxLength : Number</code>
<div class="mdetail-desc">
Maximum input field length allowed (defaults to Number.MAX_VALUE) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-maxLengthText"></a>
<div class="mdetail">
<h3>maxLengthText</i></h3>
<code>maxLengthText : String</code>
<div class="mdetail-desc">
Error text to display if the maximum length validation fails (defaults to "The maximum length for this field is {maxLength}") </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-minLength"></a>
<div class="mdetail alt">
<h3>minLength</i></h3>
<code>minLength : Number</code>
<div class="mdetail-desc">
Minimum input field length required (defaults to 0) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-minLengthText"></a>
<div class="mdetail">
<h3>minLengthText</i></h3>
<code>minLengthText : String</code>
<div class="mdetail-desc">
Error text to display if the minimum length validation fails (defaults to "The minimum length for this field is {minLength}") </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-msgFx"></a>
<div class="mdetail alt">
<h3>msgFx</i></h3>
<code>msgFx : String</code>
<div class="mdetail-desc">
<b>Experimental</b> The effect used when displaying a validation message under the field (defaults to 'normal'). </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#msgFx">Field</a>.</div>
</div>
<a name="config-msgTarget"></a>
<div class="mdetail">
<h3>msgTarget</i></h3>
<code>msgTarget : String</code>
<div class="mdetail-desc">
The location where error text should display. Should be one of the following values (defaults to 'qtip'): <pre> Value Description ----------- ---------------------------------------------------------------------- qtip Display a quick tip when the user hovers over the field title Display a default browser title attribute popup under Add a block div beneath the field containing the error text side Add an error icon to the right of the field with a popup on hover [element id] Add the error text directly to the innerHTML of the specified element </pre> </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#msgTarget">Field</a>.</div>
</div>
<a name="config-regex"></a>
<div class="mdetail alt">
<h3>regex</i></h3>
<code>regex : RegExp</code>
<div class="mdetail-desc">
A JavaScript RegExp object to be tested against the field value during validation (defaults to null). If available, this regex will be evaluated only after the basic validators all return true, and will be passed the current field value. If the test fails, the field will be marked invalid using <a href="#regexText">regexText</a>. </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-regexText"></a>
<div class="mdetail">
<h3>regexText</i></h3>
<code>regexText : String</code>
<div class="mdetail-desc">
The error text to display if <a href="#regex">regex</a> is used and the test fails during validation (defaults to "") </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-selectOnFocus"></a>
<div class="mdetail alt">
<h3>selectOnFocus</i></h3>
<code>selectOnFocus : Boolean</code>
<div class="mdetail-desc">
True to automatically select any existing field text when the field receives input focus (defaults to false) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-validateOnBlur"></a>
<div class="mdetail">
<h3>validateOnBlur</i></h3>
<code>validateOnBlur : String/Boolean</code>
<div class="mdetail-desc">
Defaults to true. </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#validateOnBlur">Field</a>.</div>
</div>
<a name="config-validationDelay"></a>
<div class="mdetail alt">
<h3>validationDelay</i></h3>
<code>validationDelay : Number</code>
<div class="mdetail-desc">
The length of time in milliseconds after user input begins until validation is initiated (defaults to 250) </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#validationDelay">Field</a>.</div>
</div>
<a name="config-validationEvent"></a>
<div class="mdetail">
<h3>validationEvent</i></h3>
<code>validationEvent : String/Boolean</code>
<div class="mdetail-desc">
The event that should initiate field validation. Set to false to disable automatic validation. (defaults to "keyup") </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#validationEvent">Field</a>.</div>
</div>
<a name="config-validator"></a>
<div class="mdetail alt">
<h3>validator</i></h3>
<code>validator : Function</code>
<div class="mdetail-desc">
A custom validation function to be called during field validation (defaults to null). If available, this function will be called only after the basic validators all return true, and will be passed the current field value and expected to return boolean true if the value is valid or a string error message if invalid. </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
<a name="config-value"></a>
<div class="mdetail">
<h3>value</i></h3>
<code>value : Mixed</code>
<div class="mdetail-desc">
A value to initialize this field with </div>
<div class="mdetail-def">This config option is defined by <a href="Ext.form.Field.html#value">Field</a>.</div>
</div>
<a name="config-vtype"></a>
<div class="mdetail alt">
<h3>vtype</i></h3>
<code>vtype : String</code>
<div class="mdetail-desc">
A validation type name as defined in <a href="Ext.form.VTypes.html">Ext.form.VTypes</a> (defaults to null) </div>
<div class="mdetail-def">This config option is defined by TextField.</div>
</div>
</div>
</div>
<hr>
<div style="font-size:10px;text-align:center;color:gray;">Ext - Copyright &copy; 2006-2007 Ext JS, LLC<br />All rights reserved.</div>
</body>
</html>
Reference in a new issue View git blame Copy permalink