- <pre class="prettyprint lang-js"><span id='Ext-form-Panel-method-constructor'><span id='Ext-form-Panel'>/**
-</span></span> * @class Ext.form.Panel
- * @extends Ext.panel.Panel
-
-FormPanel provides a standard container for forms. It is essentially a standard {@link Ext.panel.Panel} which
-automatically creates a {@link Ext.form.Basic BasicForm} for managing any {@link Ext.form.field.Field}
-objects that are added as descendants of the panel. It also includes conveniences for configuring and
-working with the BasicForm and the collection of Fields.
-
-__Layout__
-
-By default, FormPanel is configured with `{@link Ext.layout.container.Anchor layout:'anchor'}` for
-the layout of its immediate child items. This can be changed to any of the supported container layouts.
-The layout of sub-containers is configured in {@link Ext.container.Container#layout the standard way}.
-
-__BasicForm__
-
-Although **not listed** as configuration options of FormPanel, the FormPanel class accepts all
-of the config options supported by the {@link Ext.form.Basic} class, and will pass them along to
-the internal BasicForm when it is created.
-
-**Note**: If subclassing FormPanel, any configuration options for the BasicForm must be applied to
-the `initialConfig` property of the FormPanel. Applying {@link Ext.form.Basic BasicForm}
-configuration settings to `this` will *not* affect the BasicForm's configuration.
-
-The following events fired by the BasicForm will be re-fired by the FormPanel and can therefore be
-listened for on the FormPanel itself:
-
-- {@link Ext.form.Basic#beforeaction beforeaction}
-- {@link Ext.form.Basic#actionfailed actionfailed}
-- {@link Ext.form.Basic#actioncomplete actioncomplete}
-- {@link Ext.form.Basic#validitychange validitychange}
-- {@link Ext.form.Basic#dirtychange dirtychange}
-
-__Field Defaults__
-
-The {@link #fieldDefaults} config option conveniently allows centralized configuration of default values
-for all fields added as descendants of the FormPanel. Any config option recognized by implementations
-of {@link Ext.form.Labelable} may be included in this object. See the {@link #fieldDefaults} documentation
-for details of how the defaults are applied.
-
-__Form Validation__
-
-With the default configuration, form fields are validated on-the-fly while the user edits their values.
-This can be controlled on a per-field basis (or via the {@link #fieldDefaults} config) with the field
-config properties {@link Ext.form.field.Field#validateOnChange} and {@link Ext.form.field.Base#checkChangeEvents},
-and the FormPanel's config properties {@link #pollForChanges} and {@link #pollInterval}.
-
-Any component within the FormPanel can be configured with `formBind: true`. This will cause that
-component to be automatically disabled when the form is invalid, and enabled when it is valid. This is most
-commonly used for Button components to prevent submitting the form in an invalid state, but can be used on
-any component type.
-
-For more information on form validation see the following:
-
-- {@link Ext.form.field.Field#validateOnChange}
-- {@link #pollForChanges} and {@link #pollInterval}
-- {@link Ext.form.field.VTypes}
-- {@link Ext.form.Basic#doAction BasicForm.doAction clientValidation notes}
-
-__Form Submission__
-
-By default, Ext Forms are submitted through Ajax, using {@link Ext.form.action.Action}. See the documentation for
-{@link Ext.form.Basic} for details.
-{@img Ext.form.FormPanel/Ext.form.FormPanel.png Ext.form.FormPanel FormPanel component}
-__Example usage:__
-
- Ext.create('Ext.form.Panel', {
- title: 'Simple Form',
- bodyPadding: 5,
- width: 350,
-
- // The form will submit an AJAX request to this URL when submitted
- url: 'save-form.php',
-
- // Fields will be arranged vertically, stretched to full width
- layout: 'anchor',
- defaults: {
- anchor: '100%'
- },
-
- // The fields
- defaultType: 'textfield',
- items: [{
- fieldLabel: 'First Name',
- name: 'first',
- allowBlank: false
- },{
- fieldLabel: 'Last Name',
- name: 'last',
- allowBlank: false
- }],
-
- // Reset and Submit buttons
- buttons: [{
- text: 'Reset',
- handler: function() {
- this.up('form').getForm().reset();
- }
- }, {
- text: 'Submit',
- formBind: true, //only enabled once the form is valid
- disabled: true,
- handler: function() {
- var form = this.up('form').getForm();
- if (form.isValid()) {
- form.submit({
- success: function(form, action) {
- Ext.Msg.alert('Success', action.result.msg);
- },
- failure: function(form, action) {
- Ext.Msg.alert('Failed', action.result.msg);
- }
- });
- }
- }
- }],
- renderTo: Ext.getBody()
- });
-
- * @constructor
- * @param {Object} config Configuration options
- * @xtype form
+ <pre class="prettyprint lang-js"><span id='Ext-form-Panel'>/**
+</span> * @docauthor Jason Johnston <jason@sencha.com>
+ *
+ * FormPanel provides a standard container for forms. It is essentially a standard {@link Ext.panel.Panel} which
+ * automatically creates a {@link Ext.form.Basic BasicForm} for managing any {@link Ext.form.field.Field}
+ * objects that are added as descendants of the panel. It also includes conveniences for configuring and
+ * working with the BasicForm and the collection of Fields.
+ *
+ * # Layout
+ *
+ * By default, FormPanel is configured with `{@link Ext.layout.container.Anchor layout:'anchor'}` for
+ * the layout of its immediate child items. This can be changed to any of the supported container layouts.
+ * The layout of sub-containers is configured in {@link Ext.container.Container#layout the standard way}.
+ *
+ * # BasicForm
+ *
+ * Although **not listed** as configuration options of FormPanel, the FormPanel class accepts all
+ * of the config options supported by the {@link Ext.form.Basic} class, and will pass them along to
+ * the internal BasicForm when it is created.
+ *
+ * **Note**: If subclassing FormPanel, any configuration options for the BasicForm must be applied to
+ * the `initialConfig` property of the FormPanel. Applying {@link Ext.form.Basic BasicForm}
+ * configuration settings to `this` will *not* affect the BasicForm's configuration.
+ *
+ * The following events fired by the BasicForm will be re-fired by the FormPanel and can therefore be
+ * listened for on the FormPanel itself:
+ *
+ * - {@link Ext.form.Basic#beforeaction beforeaction}
+ * - {@link Ext.form.Basic#actionfailed actionfailed}
+ * - {@link Ext.form.Basic#actioncomplete actioncomplete}
+ * - {@link Ext.form.Basic#validitychange validitychange}
+ * - {@link Ext.form.Basic#dirtychange dirtychange}
+ *
+ * # Field Defaults
+ *
+ * The {@link #fieldDefaults} config option conveniently allows centralized configuration of default values
+ * for all fields added as descendants of the FormPanel. Any config option recognized by implementations
+ * of {@link Ext.form.Labelable} may be included in this object. See the {@link #fieldDefaults} documentation
+ * for details of how the defaults are applied.
+ *
+ * # Form Validation
+ *
+ * With the default configuration, form fields are validated on-the-fly while the user edits their values.
+ * This can be controlled on a per-field basis (or via the {@link #fieldDefaults} config) with the field
+ * config properties {@link Ext.form.field.Field#validateOnChange} and {@link Ext.form.field.Base#checkChangeEvents},
+ * and the FormPanel's config properties {@link #pollForChanges} and {@link #pollInterval}.
+ *
+ * Any component within the FormPanel can be configured with `formBind: true`. This will cause that
+ * component to be automatically disabled when the form is invalid, and enabled when it is valid. This is most
+ * commonly used for Button components to prevent submitting the form in an invalid state, but can be used on
+ * any component type.
+ *
+ * For more information on form validation see the following:
+ *
+ * - {@link Ext.form.field.Field#validateOnChange}
+ * - {@link #pollForChanges} and {@link #pollInterval}
+ * - {@link Ext.form.field.VTypes}
+ * - {@link Ext.form.Basic#doAction BasicForm.doAction clientValidation notes}
+ *
+ * # Form Submission
+ *
+ * By default, Ext Forms are submitted through Ajax, using {@link Ext.form.action.Action}. See the documentation for
+ * {@link Ext.form.Basic} for details.
+ *
+ * # Example usage
+ *
+ * @example
+ * Ext.create('Ext.form.Panel', {
+ * title: 'Simple Form',
+ * bodyPadding: 5,
+ * width: 350,
+ *
+ * // The form will submit an AJAX request to this URL when submitted
+ * url: 'save-form.php',
+ *
+ * // Fields will be arranged vertically, stretched to full width
+ * layout: 'anchor',
+ * defaults: {
+ * anchor: '100%'
+ * },
+ *
+ * // The fields
+ * defaultType: 'textfield',
+ * items: [{
+ * fieldLabel: 'First Name',
+ * name: 'first',
+ * allowBlank: false
+ * },{
+ * fieldLabel: 'Last Name',
+ * name: 'last',
+ * allowBlank: false
+ * }],
+ *
+ * // Reset and Submit buttons
+ * buttons: [{
+ * text: 'Reset',
+ * handler: function() {
+ * this.up('form').getForm().reset();
+ * }
+ * }, {
+ * text: 'Submit',
+ * formBind: true, //only enabled once the form is valid
+ * disabled: true,
+ * handler: function() {
+ * var form = this.up('form').getForm();
+ * if (form.isValid()) {
+ * form.submit({
+ * success: function(form, action) {
+ * Ext.Msg.alert('Success', action.result.msg);
+ * },
+ * failure: function(form, action) {
+ * Ext.Msg.alert('Failed', action.result.msg);
+ * }
+ * });
+ * }
+ * }
+ * }],
+ * renderTo: Ext.getBody()
+ * });