docs/api/Ext.form.field.Field.html

   1 <!DOCTYPE html><html><head><title>Ext.form.field.Field | Ext JS 4.0 Documentation</title><script type="text/javascript" src="../ext-all.js"></script><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../scrollbars.css" type="text/css"><link rel="stylesheet" href="../docs.css" type="text/css"><link id="styleCss" rel="stylesheet" href="../style.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script><link rel="stylesheet" href="../prettify.css" type="text/css"><!-- link(rel: 'stylesheet', href: req.baseURL + '/css/ext4.css', type: 'text/css')--><link rel="shortcut icon" type="image/ico" href="../favicon.ico"><!--[if IE]>
   2 <style type="text/css">.head-band { display: none; }
   3 .header { border: 0; top: 0; left: 0px; background: url(../header.gif) repeat-x; }
   4 .doc-tab .members .member a.more { background-color: #efefef; }
   5 </style><link rel="stylesheet" href="/new/css/ie.css" type="text/css"><![endif]-->
   6 </head><body id="ext-body" class="iScroll"><div id="notice" class="notice">For up to date documentation and features, visit
   7 <a href="http://docs.sencha.com/ext-js/4-0">http://docs.sencha.com/ext-js/4-0</a></div><div class="wrapper"><div class="head-band"></div><div class="header"><h2><a href="../index.html">Sencha Documentation</a></h2></div><div id="search"><form><input type="text" placeholder="Search" id="search-field" autocomplete="off" name="q"></form><div id="search-box"></div></div><div id="treePanel"></div><div id="container"><script type="text/javascript">
   8
   9     req = {
  10         liveURL: '.',
  11         standAloneMode: true,
  12         origDocClass: 'Ext.form.field.Field',
  13         docClass: 'Ext.form.field.Field',
  14         docReq: 'Ext.form.field.Field',
  15         version: '4.0',
  16         baseURL: '.',
  17         baseDocURL: '.',
  18         baseProdURL: '.'
  19     };
  20
  21     clsInfo = {};
  22
  23
  24
  25 </script>
  26
  27 <script type="text/javascript" src="../search.js"></script>
  28 <!--script type="text/javascript" src="/new/javascripts/app/examples.js"></script-->
  29 <script type="text/javascript" src="../class_tree.js"></script>
  30 <script type="text/javascript" src="../class_doc.js"></script>
  31 <script type="text/javascript">
  32     req.source = 'Field.html#Ext-form.field.Field';
  33     clsInfo = {"methods":["batchChanges","checkChange","checkDirty","extractFileInput","getErrors","getModelData","getName","getSubmitData","getValue","initField","isDirty","isEqual","isFileUpload","isValid","reset","resetOriginalValue","setValue","validate"],"cfgs":["disabled","name","submitValue","validateOnChange","value"],"properties":["clearInvalid","isFormField","markInvalid","originalValue"],"events":["change","dirtychange","validitychange"],"subclasses":[]};
  34     Ext.onReady(function() {
  35         Ext.create('Docs.classPanel');
  36     });
  37 </script><div id="top-block" class="top-block"><h1 id="clsTitle" class="cls"><a href="../source/Field.html#Ext-form.field.Field" target="_blank">Ext.form.field.Field</a></h1></div><div id="docContent"><div id="doc-overview-content"><div class="lft"><p>This mixin provides a common interface for the logical behavior and state of form fields, including:</p>
  38
  39 <ul>
  40 <li>Getter and setter methods for field values</li>
  41 <li>Events and methods for tracking value and validity changes</li>
  42 <li>Methods for triggering validation</li>
  43 </ul>
  44
  45
  46 <p>*NOTE**: When implementing custom fields, it is most likely that you will want to extend the <a href="Ext.form.field.Base.html" rel="Ext.form.field.Base" class="docClass">Ext.form.field.Base</a>
  47 component class rather than using this mixin directly, as BaseField contains additional logic for generating an
  48 actual DOM complete with <a href="Ext.form.Labelable.html" rel="Ext.form.Labelable" class="docClass">label and error message</a> display and a form input field,
  49 plus methods that bind the Field value getters and setters to the input field's value.</p>
  50
  51 <p>If you do want to implement this mixin directly and don't want to extend <a href="Ext.form.field.Base.html" rel="Ext.form.field.Base" class="docClass">Ext.form.field.Base</a>, then
  52 you will most likely want to override the following methods with custom implementations: <a href="Ext.form.field.Field.html#getValue" rel="Ext.form.field.Field#getValue" class="docClass">getValue</a>,
  53 <a href="Ext.form.field.Field.html#setValue" rel="Ext.form.field.Field#setValue" class="docClass">setValue</a>, and <a href="Ext.form.field.Field.html#getErrors" rel="Ext.form.field.Field#getErrors" class="docClass">getErrors</a>. Other methods may be overridden as needed but their base
  54 implementations should be sufficient for common cases. You will also need to make sure that <a href="Ext.form.field.Field.html#initField" rel="Ext.form.field.Field#initField" class="docClass">initField</a>
  55 is called during the component's initialization.</p>
  56 <div class="members"><div class="m-cfgs"><div class="definedBy">Defined By</div><a name="configs"></a><h3 class="cfg p">Config Options</h3><h4 class="cfgGroup">Other Configs</h4><div id="config-disabled" class="member f ni"><a href="Ext.form.field.Field.html#config-disabled" rel="config-disabled" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-cfg-disabled" class="viewSource">view source</a></div><a name="disabled"></a><a name="config-disabled"></a><a href="Ext.form.field.Field.html#" rel="config-disabled" class="cls expand">disabled</a><span> : Boolean</span></div><div class="description"><div class="short"><p>True to disable the field (defaults to false). Disabled Fields will not be
  57 <a href="Ext.form.Basic.html#submit" rel="Ext.form.Basic#submit" class="docClass">submitted</a>.</p></p>
  58 </div><div class="long"><p>True to disable the field (defaults to false). Disabled Fields will not be
  59 <a href="Ext.form.Basic.html#submit" rel="Ext.form.Basic#submit" class="docClass">submitted</a>.</p></p>
  60 </div></div></div><div id="config-name" class="member ni"><a href="Ext.form.field.Field.html#config-name" rel="config-name" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-cfg-name" class="viewSource">view source</a></div><a name="name"></a><a name="config-name"></a><a href="Ext.form.field.Field.html#" rel="config-name" class="cls expand">name</a><span> : String</span></div><div class="description"><div class="short">The name of the field (defaults to undefined). By default this is used as the parameter
  61 name when including the field...</div><div class="long"><p>The name of the field (defaults to undefined). By default this is used as the parameter
  62 name when including the <a href="Ext.form.field.Field.html#getSubmitData" rel="Ext.form.field.Field#getSubmitData" class="docClass">field value</a> in a <a href="Ext.form.Basic.html#submit" rel="Ext.form.Basic#submit" class="docClass">form submit()</a>.
  63 To prevent the field from being included in the form submit, set <a href="Ext.form.field.Field.html#submitValue" rel="Ext.form.field.Field#submitValue" class="docClass">submitValue</a> to <tt>false</tt>.</p>
  64 </div></div></div><div id="config-submitValue" class="member ni"><a href="Ext.form.field.Field.html#config-submitValue" rel="config-submitValue" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-cfg-submitValue" class="viewSource">view source</a></div><a name="submitValue"></a><a name="config-submitValue"></a><a href="Ext.form.field.Field.html#" rel="config-submitValue" class="cls expand">submitValue</a><span> : Boolean</span></div><div class="description"><div class="short"><p>Setting this to <tt>false</tt> will prevent the field from being
  65 <a href="Ext.form.Basic.html#submit" rel="Ext.form.Basic#submit" class="docClass">submitted</a> even when it is not disabled. Defaults to <tt>true</tt>.</p>
  66 </div><div class="long"><p>Setting this to <tt>false</tt> will prevent the field from being
  67 <a href="Ext.form.Basic.html#submit" rel="Ext.form.Basic#submit" class="docClass">submitted</a> even when it is not disabled. Defaults to <tt>true</tt>.</p>
  68 </div></div></div><div id="config-validateOnChange" class="member ni"><a href="Ext.form.field.Field.html#config-validateOnChange" rel="config-validateOnChange" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-cfg-validateOnChange" class="viewSource">view source</a></div><a name="validateOnChange"></a><a name="config-validateOnChange"></a><a href="Ext.form.field.Field.html#" rel="config-validateOnChange" class="cls expand">validateOnChange</a><span> : Boolean</span></div><div class="description"><div class="short">Specifies whether this field should be validated immediately whenever a change in its value is detected.
  69 Defaults to ...</div><div class="long"><p>Specifies whether this field should be validated immediately whenever a change in its value is detected.
  70 Defaults to <tt>true</tt>. If the validation results in a change in the field's validity, a
  71 <a href="Ext.form.field.Field.html#validitychange" rel="Ext.form.field.Field#validitychange" class="docClass">validitychange</a> event will be fired. This allows the field to show feedback about the
  72 validity of its contents immediately as the user is typing.</p>
  73
  74
  75 <p>When set to <tt>false</tt>, feedback will not be immediate. However the form will still be validated
  76 before submitting if the <tt>clientValidation</tt> option to <a href="Ext.form.Basic.html#doAction" rel="Ext.form.Basic#doAction" class="docClass">Ext.form.Basic.doAction</a> is
  77 enabled, or if the field or form are validated manually.</p>
  78
  79
  80 <p>See also <a href="Ext.form.field.Base.html#checkChangeEvents" rel="Ext.form.field.Base#checkChangeEvents" class="docClass">Ext.form.field.Base.checkChangeEvents</a>for controlling how changes to the field's value are detected.</p>
  81
  82 </div></div></div><div id="config-value" class="member ni"><a href="Ext.form.field.Field.html#config-value" rel="config-value" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-cfg-value" class="viewSource">view source</a></div><a name="value"></a><a name="config-value"></a><a href="Ext.form.field.Field.html#" rel="config-value" class="cls expand">value</a><span> : Mixed</span></div><div class="description"><div class="short"><p>A value to initialize this field with (defaults to undefined).</p>
  83 </div><div class="long"><p>A value to initialize this field with (defaults to undefined).</p>
  84 </div></div></div></div><div class="m-properties"><a name="properties"></a><div class="definedBy">Defined By</div><h3 class="prp p">Properties</h3><div id="property-clearInvalid" class="member f ni"><a href="Ext.form.field.Field.html#property-clearInvalid" rel="property-clearInvalid" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-property-clearInvalid" class="viewSource">view source</a></div><a name="clearInvalid"></a><a name="property-clearInvalid"></a><a href="Ext.form.field.Field.html#" rel="property-clearInvalid" class="cls expand">clearInvalid</a><span> : Object</span></div><div class="description"><div class="short">Clear any invalid styles/messages for this field. Components using this mixin should implement
  85 this method to update ...</div><div class="long"><p>Clear any invalid styles/messages for this field. Components using this mixin should implement
  86 this method to update the components rendering to clear any existing messages.</p>
  87
  88
  89 <p><b>Note</b>: this method does not cause the Field's <a href="Ext.form.field.Field.html#validate" rel="Ext.form.field.Field#validate" class="docClass">validate</a> or <a href="Ext.form.field.Field.html#isValid" rel="Ext.form.field.Field#isValid" class="docClass">isValid</a> methods to
  90 return <code>true</code> if the value does not <i>pass</i> validation. So simply clearing a field's errors
  91 will not necessarily allow submission of forms submitted with the <a href="Ext.form.action.Submit.html#clientValidation" rel="Ext.form.action.Submit#clientValidation" class="docClass">Ext.form.action.Submit.clientValidation</a>
  92 option set.</p>
  93
  94 </div></div></div><div id="property-isFormField" class="member ni"><a href="Ext.form.field.Field.html#property-isFormField" rel="property-isFormField" class="expand more"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-property-isFormField" class="viewSource">view source</a></div><a name="isFormField"></a><a name="property-isFormField"></a><a href="Ext.form.field.Field.html#" rel="property-isFormField" class="cls expand">isFormField</a><span> : Boolean</span></div><div class="description"><div class="short"><p>Flag denoting that this component is a Field. Always true.</p>
  95 </div><div class="long"><p>Flag denoting that this component is a Field. Always true.</p>
  96 </div></div></div><div id="property-markInvalid" class="member ni"><a href="Ext.form.field.Field.html#property-markInvalid" rel="property-markInvalid" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-property-markInvalid" class="viewSource">view source</a></div><a name="markInvalid"></a><a name="property-markInvalid"></a><a href="Ext.form.field.Field.html#" rel="property-markInvalid" class="cls expand">markInvalid</a><span> : Object</span></div><div class="description"><div class="short">Associate one or more error messages with this field. Components using this mixin should implement
  97 this method to upd...</div><div class="long"><p>Associate one or more error messages with this field. Components using this mixin should implement
  98 this method to update the component's rendering to display the messages.</p>
  99
 100
 101 <p><b>Note</b>: this method does not cause the Field's <a href="Ext.form.field.Field.html#validate" rel="Ext.form.field.Field#validate" class="docClass">validate</a> or <a href="Ext.form.field.Field.html#isValid" rel="Ext.form.field.Field#isValid" class="docClass">isValid</a> methods to
 102 return <code>false</code> if the value does <i>pass</i> validation. So simply marking a Field as invalid
 103 will not prevent submission of forms submitted with the <a href="Ext.form.action.Submit.html#clientValidation" rel="Ext.form.action.Submit#clientValidation" class="docClass">Ext.form.action.Submit.clientValidation</a>
 104 option set.</p>
 105
 106 </div></div></div><div id="property-originalValue" class="member ni"><a href="Ext.form.field.Field.html#property-originalValue" rel="property-originalValue" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-property-originalValue" class="viewSource">view source</a></div><a name="originalValue"></a><a name="property-originalValue"></a><a href="Ext.form.field.Field.html#" rel="property-originalValue" class="cls expand">originalValue</a><span> : Mixed</span></div><div class="description"><div class="short">The original value of the field as configured in the value configuration, or as loaded by
 107 the last form load operatio...</div><div class="long"><p>The original value of the field as configured in the <a href="Ext.form.field.Field.html#value" rel="Ext.form.field.Field#value" class="docClass">value</a> configuration, or as loaded by
 108 the last form load operation if the form's <a href="Ext.form.Basic.html#trackResetOnLoad" rel="Ext.form.Basic#trackResetOnLoad" class="docClass">trackResetOnLoad</a>
 109 setting is <code>true</code>.</p>
 110 </div></div></div></div><div class="m-methods"><a name="methods"></a><div class="definedBy">Defined By</div><h3 class="mth p">Methods</h3><div id="method-batchChanges" class="member f ni"><a href="Ext.form.field.Field.html#method-batchChanges" rel="method-batchChanges" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-batchChanges" class="viewSource">view source</a></div><a name="batchChanges"></a><a name="method-batchChanges"></a><a href="Ext.form.field.Field.html#" rel="method-batchChanges" class="cls expand">batchChanges</a>(
 111 <span class="pre">Object fn</span>)
 112  : void</div><div class="description"><div class="short">A utility for grouping a set of modifications which may trigger value changes into a single
 113 transaction, to prevent e...</div><div class="long"><p>A utility for grouping a set of modifications which may trigger value changes into a single
 114 transaction, to prevent excessive firing of <a href="Ext.form.field.Field.html#change" rel="Ext.form.field.Field#change" class="docClass">change</a> events. This is useful for instance
 115 if the field has sub-fields which are being updated as a group; you don't want the container
 116 field to check its own changed state for each subfield change.</p>
 117 <h3 class="pa">Parameters</h3><ul><li><span class="pre">fn</span> : Object<div class="sub-desc"><p>A function containing the transaction code</p>
 118 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 119 </li></ul></div></div></div><div id="method-checkChange" class="member ni"><a href="Ext.form.field.Field.html#method-checkChange" rel="method-checkChange" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-checkChange" class="viewSource">view source</a></div><a name="checkChange"></a><a name="method-checkChange"></a><a href="Ext.form.field.Field.html#" rel="method-checkChange" class="cls expand">checkChange</a> : void</div><div class="description"><div class="short">Checks whether the value of the field has changed since the last time it was checked. If the value
 120 has changed, it:
 121
 122 ...</div><div class="long"><p>Checks whether the value of the field has changed since the last time it was checked. If the value
 123 has changed, it:</p>
 124
 125
 126 <ol>
 127 <li>Fires the <a href="Ext.form.field.Field.html#change" rel="Ext.form.field.Field#change" class="docClass">change event</a>,</li>
 128 <li>Performs validation if the <a href="Ext.form.field.Field.html#validateOnChange" rel="Ext.form.field.Field#validateOnChange" class="docClass">validateOnChange</a> config is enabled, firing the
 129 <a href="Ext.form.field.Field.html#validationchange" rel="Ext.form.field.Field#validationchange" class="docClass">validationchange event</a> if the validity has changed, and</li>
 130 <li>Checks the <a href="Ext.form.field.Field.html#isDirty" rel="Ext.form.field.Field#isDirty" class="docClass">dirty state</a> of the field and fires the <a href="Ext.form.field.Field.html#dirtychange" rel="Ext.form.field.Field#dirtychange" class="docClass">dirtychange event</a>
 131 if it has changed.</li>
 132 </ol>
 133
 134 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 135 </li></ul></div></div></div><div id="method-checkDirty" class="member ni"><a href="Ext.form.field.Field.html#method-checkDirty" rel="method-checkDirty" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-checkDirty" class="viewSource">view source</a></div><a name="checkDirty"></a><a name="method-checkDirty"></a><a href="Ext.form.field.Field.html#" rel="method-checkDirty" class="cls expand">checkDirty</a> : void</div><div class="description"><div class="short">Checks the isDirty state of the field and if it has changed since the last time
 136 it was checked, fires the dirtychange...</div><div class="long"><p>Checks the <a href="Ext.form.field.Field.html#isDirty" rel="Ext.form.field.Field#isDirty" class="docClass">isDirty</a> state of the field and if it has changed since the last time
 137 it was checked, fires the <a href="Ext.form.field.Field.html#dirtychange" rel="Ext.form.field.Field#dirtychange" class="docClass">dirtychange</a> event.</p>
 138 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 139 </li></ul></div></div></div><div id="method-extractFileInput" class="member ni"><a href="Ext.form.field.Field.html#method-extractFileInput" rel="method-extractFileInput" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-extractFileInput" class="viewSource">view source</a></div><a name="extractFileInput"></a><a name="method-extractFileInput"></a><a href="Ext.form.field.Field.html#" rel="method-extractFileInput" class="cls expand">extractFileInput</a> : HTMLInputElement</div><div class="description"><div class="short">Only relevant if the instance's isFileUpload method returns true. Returns a reference
 140 to the file input DOM element h...</div><div class="long"><p>Only relevant if the instance's <a href="Ext.form.field.Field.html#isFileUpload" rel="Ext.form.field.Field#isFileUpload" class="docClass">isFileUpload</a> method returns true. Returns a reference
 141 to the file input DOM element holding the user's selected file. The input will be appended into
 142 the submission form and will not be returned, so this method should also create a replacement.</p>
 143 <h3 class="pa">Returns</h3><ul><li><span class="pre">HTMLInputElement</span>&nbsp; &nbsp;
 144 </li></ul></div></div></div><div id="method-getErrors" class="member ni"><a href="Ext.form.field.Field.html#method-getErrors" rel="method-getErrors" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-getErrors" class="viewSource">view source</a></div><a name="getErrors"></a><a name="method-getErrors"></a><a href="Ext.form.field.Field.html#" rel="method-getErrors" class="cls expand">getErrors</a>(
 145 <span class="pre">Mixed value</span>)
 146  : Array</div><div class="description"><div class="short">Runs this field's validators and returns an array of error messages for any validation failures.
 147 This is called inter...</div><div class="long"><p>Runs this field's validators and returns an array of error messages for any validation failures.
 148 This is called internally during validation and would not usually need to be used manually.</p>
 149
 150
 151 <p>Each subclass should override or augment the return value to provide their own errors.</p>
 152
 153 <h3 class="pa">Parameters</h3><ul><li><span class="pre">value</span> : Mixed<div class="sub-desc"><p>The value to get errors for (defaults to the current field value)</p>
 154 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Array</span>&nbsp; &nbsp;<p>All error messages for this field; an empty Array if none.</p>
 155 </li></ul></div></div></div><div id="method-getModelData" class="member ni"><a href="Ext.form.field.Field.html#method-getModelData" rel="method-getModelData" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-getModelData" class="viewSource">view source</a></div><a name="getModelData"></a><a name="method-getModelData"></a><a href="Ext.form.field.Field.html#" rel="method-getModelData" class="cls expand">getModelData</a> : Object</div><div class="description"><div class="short">Returns the value(s) that should be saved to the Ext.data.Model instance for this field, when
 156 Ext.form.Basic.updateRe...</div><div class="long"><p>Returns the value(s) that should be saved to the <a href="Ext.data.Model.html" rel="Ext.data.Model" class="docClass">Ext.data.Model</a> instance for this field, when
 157 <a href="Ext.form.Basic.html#updateRecord" rel="Ext.form.Basic#updateRecord" class="docClass">Ext.form.Basic.updateRecord</a> is called. Typically this will be an object with a single name-value
 158 pair, the name being this field's <a href="Ext.form.field.Field.html#getName" rel="Ext.form.field.Field#getName" class="docClass">name</a> and the value being its current data value. More
 159 advanced field implementations may return more than one name-value pair. The returned values will be
 160 saved to the corresponding field names in the Model.</p>
 161
 162
 163 <p>Note that the values returned from this method are not guaranteed to have been successfully
 164 <a href="Ext.form.field.Field.html#validate" rel="Ext.form.field.Field#validate" class="docClass">validated</a>.</p>
 165
 166 <h3 class="pa">Returns</h3><ul><li><span class="pre">Object</span>&nbsp; &nbsp;<p>A mapping of submit parameter names to values; each value should be a string, or an array
 167 of strings if that particular name has multiple values. It can also return <tt>null</tt> if there are no
 168 parameters to be submitted.</p>
 169 </li></ul></div></div></div><div id="method-getName" class="member ni"><a href="Ext.form.field.Field.html#method-getName" rel="method-getName" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-getName" class="viewSource">view source</a></div><a name="getName"></a><a name="method-getName"></a><a href="Ext.form.field.Field.html#" rel="method-getName" class="cls expand">getName</a> : String</div><div class="description"><div class="short">Returns the name attribute of the field. This is used as the parameter
 170 name when including the field value in a form ...</div><div class="long"><p>Returns the <a href="Ext.form.field.Field.html#name" rel="Ext.form.field.Field#name" class="docClass">name</a> attribute of the field. This is used as the parameter
 171 name when including the field value in a <a href="Ext.form.Basic.html#submit" rel="Ext.form.Basic#submit" class="docClass">form submit()</a>.</p>
 172 <h3 class="pa">Returns</h3><ul><li><span class="pre">String</span>&nbsp; &nbsp;<p>name The field <a href="Ext.form.field.Field.html#name" rel="Ext.form.field.Field#name" class="docClass">name</a></p>
 173 </li></ul></div></div></div><div id="method-getSubmitData" class="member ni"><a href="Ext.form.field.Field.html#method-getSubmitData" rel="method-getSubmitData" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-getSubmitData" class="viewSource">view source</a></div><a name="getSubmitData"></a><a name="method-getSubmitData"></a><a href="Ext.form.field.Field.html#" rel="method-getSubmitData" class="cls expand">getSubmitData</a> : Object</div><div class="description"><div class="short">Returns the parameter(s) that would be included in a standard form submit for this field. Typically this
 174 will be an o...</div><div class="long"><p>Returns the parameter(s) that would be included in a standard form submit for this field. Typically this
 175 will be an object with a single name-value pair, the name being this field's <a href="Ext.form.field.Field.html#getName" rel="Ext.form.field.Field#getName" class="docClass">name</a> and the
 176 value being its current stringified value. More advanced field implementations may return more than one
 177 name-value pair.</p>
 178
 179
 180 <p>Note that the values returned from this method are not guaranteed to have been successfully
 181 <a href="Ext.form.field.Field.html#validate" rel="Ext.form.field.Field#validate" class="docClass">validated</a>.</p>
 182
 183 <h3 class="pa">Returns</h3><ul><li><span class="pre">Object</span>&nbsp; &nbsp;<p>A mapping of submit parameter names to values; each value should be a string, or an array
 184 of strings if that particular name has multiple values. It can also return <tt>null</tt> if there are no
 185 parameters to be submitted.</p>
 186 </li></ul></div></div></div><div id="method-getValue" class="member ni"><a href="Ext.form.field.Field.html#method-getValue" rel="method-getValue" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-getValue" class="viewSource">view source</a></div><a name="getValue"></a><a name="method-getValue"></a><a href="Ext.form.field.Field.html#" rel="method-getValue" class="cls expand">getValue</a> : Mixed</div><div class="description"><div class="short">Returns the current data value of the field. The type of value returned is particular to the type of the
 187 particular f...</div><div class="long"><p>Returns the current data value of the field. The type of value returned is particular to the type of the
 188 particular field (e.g. a Date object for <a href="Ext.form.field.Date.html" rel="Ext.form.field.Date" class="docClass">Ext.form.field.Date</a>).</p>
 189 <h3 class="pa">Returns</h3><ul><li><span class="pre">Mixed</span>&nbsp; &nbsp;<p>value The field value</p>
 190 </li></ul></div></div></div><div id="method-initField" class="member ni"><a href="Ext.form.field.Field.html#method-initField" rel="method-initField" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-initField" class="viewSource">view source</a></div><a name="initField"></a><a name="method-initField"></a><a href="Ext.form.field.Field.html#" rel="method-initField" class="cls expand">initField</a> : void</div><div class="description"><div class="short">Initializes this Field mixin on the current instance. Components using this mixin should call
 191 this method during thei...</div><div class="long"><p>Initializes this Field mixin on the current instance. Components using this mixin should call
 192 this method during their own initialization process.</p>
 193 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 194 </li></ul></div></div></div><div id="method-isDirty" class="member ni"><a href="Ext.form.field.Field.html#method-isDirty" rel="method-isDirty" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-isDirty" class="viewSource">view source</a></div><a name="isDirty"></a><a name="method-isDirty"></a><a href="Ext.form.field.Field.html#" rel="method-isDirty" class="cls expand">isDirty</a> : Boolean</div><div class="description"><div class="short">Returns true if the value of this Field has been changed from its originalValue.
 195 Will always return false if the fiel...</div><div class="long"><p>Returns true if the value of this Field has been changed from its <a href="Ext.form.field.Field.html#originalValue" rel="Ext.form.field.Field#originalValue" class="docClass">originalValue</a>.
 196 Will always return false if the field is disabled.</p>
 197
 198
 199 <p>Note that if the owning <a href="Ext.form.Basic.html" rel="Ext.form.Basic" class="docClass">form</a> was configured with
 200 <a href="Ext.form.Basic.html#trackResetOnLoad" rel="Ext.form.Basic#trackResetOnLoad" class="docClass">trackResetOnLoad</a>
 201 then the <a href="Ext.form.field.Field.html#originalValue" rel="Ext.form.field.Field#originalValue" class="docClass">originalValue</a> is updated when the values are loaded by
 202 <a href="Ext.form.Basic.html" rel="Ext.form.Basic" class="docClass">Ext.form.Basic</a>.<a href="Ext.form.Basic.html#setValues" rel="Ext.form.Basic#setValues" class="docClass">setValues</a>.</p>
 203
 204 <h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;<p>True if this field has been changed from its original value (and
 205 is not disabled), false otherwise.</p>
 206 </li></ul></div></div></div><div id="method-isEqual" class="member ni"><a href="Ext.form.field.Field.html#method-isEqual" rel="method-isEqual" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-isEqual" class="viewSource">view source</a></div><a name="isEqual"></a><a name="method-isEqual"></a><a href="Ext.form.field.Field.html#" rel="method-isEqual" class="cls expand">isEqual</a>(
 207 <span class="pre">Mixed value1, Mixed value2</span>)
 208  : Boolean</div><div class="description"><div class="short">Returns whether two field values are logically equal. Field implementations may override
 209 this to provide custom compa...</div><div class="long"><p>Returns whether two field <a href="Ext.form.field.Field.html#getValue" rel="Ext.form.field.Field#getValue" class="docClass">values</a> are logically equal. Field implementations may override
 210 this to provide custom comparison logic appropriate for the particular field's data type.</p>
 211 <h3 class="pa">Parameters</h3><ul><li><span class="pre">value1</span> : Mixed<div class="sub-desc"><p>The first value to compare</p>
 212 </div></li><li><span class="pre">value2</span> : Mixed<div class="sub-desc"><p>The second value to compare</p>
 213 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;<p>True if the values are equal, false if inequal.</p>
 214 </li></ul></div></div></div><div id="method-isFileUpload" class="member ni"><a href="Ext.form.field.Field.html#method-isFileUpload" rel="method-isFileUpload" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-isFileUpload" class="viewSource">view source</a></div><a name="isFileUpload"></a><a name="method-isFileUpload"></a><a href="Ext.form.field.Field.html#" rel="method-isFileUpload" class="cls expand">isFileUpload</a> : Boolean</div><div class="description"><div class="short">Returns whether this Field is a file upload field; if it returns true, forms will use
 215 special techniques for submitti...</div><div class="long"><p>Returns whether this Field is a file upload field; if it returns true, forms will use
 216 special techniques for <a href="Ext.form.Basic.html#submit" rel="Ext.form.Basic#submit" class="docClass">submitting the form</a> via AJAX. See
 217 <a href="Ext.form.Basic.html#hasUpload" rel="Ext.form.Basic#hasUpload" class="docClass">Ext.form.Basic.hasUpload</a> for details. If this returns true, the <a href="Ext.form.field.Field.html#extractFileInput" rel="Ext.form.field.Field#extractFileInput" class="docClass">extractFileInput</a>
 218 method must also be implemented to return the corresponding file input element.</p>
 219 <h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;
 220 </li></ul></div></div></div><div id="method-isValid" class="member ni"><a href="Ext.form.field.Field.html#method-isValid" rel="method-isValid" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-isValid" class="viewSource">view source</a></div><a name="isValid"></a><a name="method-isValid"></a><a href="Ext.form.field.Field.html#" rel="method-isValid" class="cls expand">isValid</a> : Boolean</div><div class="description"><div class="short">Returns whether or not the field value is currently valid by validating the
 221 field's current value. The validitychange...</div><div class="long"><p>Returns whether or not the field value is currently valid by <a href="Ext.form.field.Field.html#getErrors" rel="Ext.form.field.Field#getErrors" class="docClass">validating</a> the
 222 field's current value. The <a href="Ext.form.field.Field.html#validitychange" rel="Ext.form.field.Field#validitychange" class="docClass">validitychange</a> event will not be fired; use <a href="Ext.form.field.Field.html#validate" rel="Ext.form.field.Field#validate" class="docClass">validate</a>
 223 instead if you want the event to fire. <b>Note</b>: <a href="Ext.form.field.Field.html#disabled" rel="Ext.form.field.Field#disabled" class="docClass">disabled</a> fields are always treated as valid.</p>
 224
 225
 226 <p>Implementations are encouraged to ensure that this method does not have side-effects such as
 227 triggering error message display.</p>
 228
 229 <h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;<p>True if the value is valid, else false</p>
 230 </li></ul></div></div></div><div id="method-reset" class="member ni"><a href="Ext.form.field.Field.html#method-reset" rel="method-reset" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-reset" class="viewSource">view source</a></div><a name="reset"></a><a name="method-reset"></a><a href="Ext.form.field.Field.html#" rel="method-reset" class="cls expand">reset</a> : void</div><div class="description"><div class="short">Resets the current field value to the originally loaded value and clears any validation messages.
 231 See Ext.form.Basic....</div><div class="long"><p>Resets the current field value to the originally loaded value and clears any validation messages.
 232 See <a href="Ext.form.Basic.html" rel="Ext.form.Basic" class="docClass">Ext.form.Basic</a>.<a href="Ext.form.Basic.html#trackResetOnLoad" rel="Ext.form.Basic#trackResetOnLoad" class="docClass">trackResetOnLoad</a></p>
 233 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 234 </li></ul></div></div></div><div id="method-resetOriginalValue" class="member ni"><a href="Ext.form.field.Field.html#method-resetOriginalValue" rel="method-resetOriginalValue" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-resetOriginalValue" class="viewSource">view source</a></div><a name="resetOriginalValue"></a><a name="method-resetOriginalValue"></a><a href="Ext.form.field.Field.html#" rel="method-resetOriginalValue" class="cls expand">resetOriginalValue</a> : void</div><div class="description"><div class="short">Resets the field's originalValue property so it matches the current value.
 235 This is called by Ext.form.Basic.setValues...</div><div class="long"><p>Resets the field's <a href="Ext.form.field.Field.html#originalValue" rel="Ext.form.field.Field#originalValue" class="docClass">originalValue</a> property so it matches the current <a href="Ext.form.field.Field.html#getValue" rel="Ext.form.field.Field#getValue" class="docClass">value</a>.
 236 This is called by <a href="Ext.form.Basic.html" rel="Ext.form.Basic" class="docClass">Ext.form.Basic</a>.<a href="Ext.form.Basic.html#setValues" rel="Ext.form.Basic#setValues" class="docClass">setValues</a> if the form's
 237 <a href="Ext.form.Basic.html#trackResetOnLoad" rel="Ext.form.Basic#trackResetOnLoad" class="docClass">trackResetOnLoad</a> property is set to true.</p>
 238 <h3 class="pa">Returns</h3><ul><li><span class="pre">void</span>&nbsp; &nbsp;
 239 </li></ul></div></div></div><div id="method-setValue" class="member ni"><a href="Ext.form.field.Field.html#method-setValue" rel="method-setValue" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-setValue" class="viewSource">view source</a></div><a name="setValue"></a><a name="method-setValue"></a><a href="Ext.form.field.Field.html#" rel="method-setValue" class="cls expand">setValue</a>(
 240 <span class="pre">Mixed value</span>)
 241  : Ext.form.field.Field</div><div class="description"><div class="short"><p>Sets a data value into the field and runs the change detection and validation.</p>
 242 </div><div class="long"><p>Sets a data value into the field and runs the change detection and validation.</p>
 243 <h3 class="pa">Parameters</h3><ul><li><span class="pre">value</span> : Mixed<div class="sub-desc"><p>The value to set</p>
 244 </div></li></ul><h3 class="pa">Returns</h3><ul><li><span class="pre">Ext.form.field.Field</span>&nbsp; &nbsp;<p>this</p>
 245 </li></ul></div></div></div><div id="method-validate" class="member ni"><a href="Ext.form.field.Field.html#method-validate" rel="method-validate" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-method-validate" class="viewSource">view source</a></div><a name="validate"></a><a name="method-validate"></a><a href="Ext.form.field.Field.html#" rel="method-validate" class="cls expand">validate</a> : Boolean</div><div class="description"><div class="short">Returns whether or not the field value is currently valid by validating the
 246 field's current value, and fires the vali...</div><div class="long"><p>Returns whether or not the field value is currently valid by <a href="Ext.form.field.Field.html#getErrors" rel="Ext.form.field.Field#getErrors" class="docClass">validating</a> the
 247 field's current value, and fires the <a href="Ext.form.field.Field.html#validitychange" rel="Ext.form.field.Field#validitychange" class="docClass">validitychange</a> event if the field's validity has
 248 changed since the last validation. <b>Note</b>: <a href="Ext.form.field.Field.html#disabled" rel="Ext.form.field.Field#disabled" class="docClass">disabled</a> fields are always treated as valid.</p>
 249
 250
 251 <p>Custom implementations of this method are allowed to have side-effects such as triggering error
 252 message display. To validate without side-effects, use <a href="Ext.form.field.Field.html#isValid" rel="Ext.form.field.Field#isValid" class="docClass">isValid</a>.</p>
 253
 254 <h3 class="pa">Returns</h3><ul><li><span class="pre">Boolean</span>&nbsp; &nbsp;<p>True if the value is valid, else false</p>
 255 </li></ul></div></div></div></div><div class="m-events"><a name="events"></a><div class="definedBy">Defined By</div><h3 class="evt p">Events</h3><div id="event-change" class="member f ni"><a href="Ext.form.field.Field.html#event-change" rel="event-change" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-event-change" class="viewSource">view source</a></div><a name="change"></a><a name="event-change"></a><a href="Ext.form.field.Field.html#" rel="event-change" class="cls expand">change</a>(
 256 <span class="pre">Ext.form.field.Field this, Mixed newValue, Mixed oldValue</span>)
 257 </div><div class="description"><div class="short"><p>Fires when a user-initiated change is detected in the value of the field.</p>
 258 </div><div class="long"><p>Fires when a user-initiated change is detected in the value of the field.</p>
 259 <h3 class="pa">Parameters</h3><ul><li><span class="pre">this</span> : Ext.form.field.Field<div class="sub-desc">
 260 </div></li><li><span class="pre">newValue</span> : Mixed<div class="sub-desc"><p>The new value</p>
 261 </div></li><li><span class="pre">oldValue</span> : Mixed<div class="sub-desc"><p>The original value</p>
 262 </div></li></ul></div></div></div><div id="event-dirtychange" class="member ni"><a href="Ext.form.field.Field.html#event-dirtychange" rel="event-dirtychange" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-event-dirtychange" class="viewSource">view source</a></div><a name="dirtychange"></a><a name="event-dirtychange"></a><a href="Ext.form.field.Field.html#" rel="event-dirtychange" class="cls expand">dirtychange</a>(
 263 <span class="pre">Ext.form.field.Field this, Boolean isDirty</span>)
 264 </div><div class="description"><div class="short"><p>Fires when a change in the field's <a href="Ext.form.field.Field.html#isDirty" rel="Ext.form.field.Field#isDirty" class="docClass">isDirty</a> state is detected.</p>
 265 </div><div class="long"><p>Fires when a change in the field's <a href="Ext.form.field.Field.html#isDirty" rel="Ext.form.field.Field#isDirty" class="docClass">isDirty</a> state is detected.</p>
 266 <h3 class="pa">Parameters</h3><ul><li><span class="pre">this</span> : Ext.form.field.Field<div class="sub-desc">
 267 </div></li><li><span class="pre">isDirty</span> : Boolean<div class="sub-desc"><p>Whether or not the field is now dirty</p>
 268 </div></li></ul></div></div></div><div id="event-validitychange" class="member ni"><a href="Ext.form.field.Field.html#event-validitychange" rel="event-validitychange" class="expand more ar"><span>&nbsp;</span></a><div class="title"><div class="meta"><a href="Ext.form.field.Field.html" class="definedIn docClass">Ext.form.field.Field</a><br/><a href="../source/Field.html#Ext-form.field.Field-event-validitychange" class="viewSource">view source</a></div><a name="validitychange"></a><a name="event-validitychange"></a><a href="Ext.form.field.Field.html#" rel="event-validitychange" class="cls expand">validitychange</a>(
 269 <span class="pre">Ext.form.field.Field this, Boolean isValid</span>)
 270 </div><div class="description"><div class="short"><p>Fires when a change in the field's validity is detected.</p>
 271 </div><div class="long"><p>Fires when a change in the field's validity is detected.</p>
 272 <h3 class="pa">Parameters</h3><ul><li><span class="pre">this</span> : Ext.form.field.Field<div class="sub-desc">
 273 </div></li><li><span class="pre">isValid</span> : Boolean<div class="sub-desc"><p>Whether or not the field is now valid</p>
 274 </div></li></ul></div></div></div></div></div></div></div><div id="pageContent"></div></div></div></div></body></html>