X-Git-Url: http://git.ithinksw.org/extjs.git/blobdiff_plain/c930e9176a5a85509c5b0230e2bff5c22a591432..7a654f8d43fdb43d78b63d90528bed6e86b608cc:/src/widgets/form/Form.js diff --git a/src/widgets/form/Form.js b/src/widgets/form/Form.js deleted file mode 100644 index 78359d0a..00000000 --- a/src/widgets/form/Form.js +++ /dev/null @@ -1,335 +0,0 @@ -/*! - * Ext JS Library 3.0.0 - * Copyright(c) 2006-2009 Ext JS, LLC - * licensing@extjs.com - * http://www.extjs.com/license - */ -/** - * @class Ext.form.FormPanel - * @extends Ext.Panel - *

Standard form container.

- * - *

Layout

- *

By default, FormPanel is configured with layout:'form' to use an {@link Ext.layout.FormLayout} - * layout manager, which styles and renders fields and labels correctly. When nesting additional Containers - * within a FormPanel, you should ensure that any descendant Containers which host input Fields use the - * {@link Ext.layout.FormLayout} layout manager.

- * - *

BasicForm

- *

Although not listed as configuration options of FormPanel, the FormPanel class accepts all - * of the config options required to configure its internal {@link Ext.form.BasicForm} for: - *

- * - *

Note: If subclassing FormPanel, any configuration options for the BasicForm must be applied to - * the initialConfig property of the FormPanel. Applying {@link Ext.form.BasicForm BasicForm} - * configuration settings to this will not affect the BasicForm's configuration.

- * - *

Form Validation

- *

For information on form validation see the following:

- *
- * - *

Form Submission

- *

By default, Ext Forms are submitted through Ajax, using {@link Ext.form.Action}. To enable normal browser - * submission of the {@link Ext.form.BasicForm BasicForm} contained in this FormPanel, see the - * {@link Ext.form.BasicForm#standardSubmit standardSubmit} option.

- * - * @constructor - * @param {Object} config Configuration options - * @xtype form - */ -Ext.FormPanel = Ext.extend(Ext.Panel, { - /** - * @cfg {String} formId (optional) The id of the FORM tag (defaults to an auto-generated id). - */ - /** - * @cfg {Boolean} hideLabels - *

true to hide field labels by default (sets display:none). Defaults to - * false.

- *

Also see {@link Ext.Component}.{@link Ext.Component#hideLabel hideLabel}. - */ - /** - * @cfg {Number} labelPad - * The default padding in pixels for field labels (defaults to 5). labelPad only - * applies if {@link #labelWidth} is also specified, otherwise it will be ignored. - */ - /** - * @cfg {String} labelSeparator - * See {@link Ext.Component}.{@link Ext.Component#labelSeparator labelSeparator} - */ - /** - * @cfg {Number} labelWidth The width of labels in pixels. This property cascades to child containers - * and can be overridden on any child container (e.g., a fieldset can specify a different labelWidth - * for its fields) (defaults to 100). - */ - /** - * @cfg {String} itemCls A css class to apply to the x-form-item of fields. This property cascades to child containers. - */ - /** - * @cfg {Array} buttons - * An array of {@link Ext.Button}s or {@link Ext.Button} configs used to add buttons to the footer of this FormPanel.
- *

Buttons in the footer of a FormPanel may be configured with the option formBind: true. This causes - * the form's {@link #monitorValid valid state monitor task} to enable/disable those Buttons depending on - * the form's valid/invalid state.

- */ - - - /** - * @cfg {Number} minButtonWidth Minimum width of all buttons in pixels (defaults to 75). - */ - minButtonWidth : 75, - - /** - * @cfg {String} labelAlign The label alignment value used for the text-align specification - * for the container. Valid values are "left", "top" or "right" - * (defaults to "left"). This property cascades to child containers and can be - * overridden on any child container (e.g., a fieldset can specify a different labelAlign - * for its fields). - */ - labelAlign : 'left', - - /** - * @cfg {Boolean} monitorValid If true, the form monitors its valid state client-side and - * regularly fires the {@link #clientvalidation} event passing that state.
- *

When monitoring valid state, the FormPanel enables/disables any of its configured - * {@link #buttons} which have been configured with formBind: true depending - * on whether the {@link Ext.form.BasicForm#isValid form is valid} or not. Defaults to false

- */ - monitorValid : false, - - /** - * @cfg {Number} monitorPoll The milliseconds to poll valid state, ignored if monitorValid is not true (defaults to 200) - */ - monitorPoll : 200, - - /** - * @cfg {String} layout Defaults to 'form'. Normally this configuration property should not be altered. - * For additional details see {@link Ext.layout.FormLayout} and {@link Ext.Container#layout Ext.Container.layout}. - */ - layout : 'form', - - // private - initComponent : function(){ - this.form = this.createForm(); - Ext.FormPanel.superclass.initComponent.call(this); - - this.bodyCfg = { - tag: 'form', - cls: this.baseCls + '-body', - method : this.method || 'POST', - id : this.formId || Ext.id() - }; - if(this.fileUpload) { - this.bodyCfg.enctype = 'multipart/form-data'; - } - this.initItems(); - - this.addEvents( - /** - * @event clientvalidation - * If the monitorValid config option is true, this event fires repetitively to notify of valid state - * @param {Ext.form.FormPanel} this - * @param {Boolean} valid true if the form has passed client-side validation - */ - 'clientvalidation' - ); - - this.relayEvents(this.form, ['beforeaction', 'actionfailed', 'actioncomplete']); - }, - - // private - createForm : function(){ - var config = Ext.applyIf({listeners: {}}, this.initialConfig); - return new Ext.form.BasicForm(null, config); - }, - - // private - initFields : function(){ - var f = this.form; - var formPanel = this; - var fn = function(c){ - if(formPanel.isField(c)){ - f.add(c); - }if(c.isFieldWrap){ - Ext.applyIf(c, { - labelAlign: c.ownerCt.labelAlign, - labelWidth: c.ownerCt.labelWidth, - itemCls: c.ownerCt.itemCls - }); - f.add(c.field); - }else if(c.doLayout && c != formPanel){ - Ext.applyIf(c, { - labelAlign: c.ownerCt.labelAlign, - labelWidth: c.ownerCt.labelWidth, - itemCls: c.ownerCt.itemCls - }); - //each check required for check/radio groups. - if(c.items && c.items.each){ - c.items.each(fn, this); - } - } - }; - this.items.each(fn, this); - }, - - // private - getLayoutTarget : function(){ - return this.form.el; - }, - - /** - * Provides access to the {@link Ext.form.BasicForm Form} which this Panel contains. - * @return {Ext.form.BasicForm} The {@link Ext.form.BasicForm Form} which this Panel contains. - */ - getForm : function(){ - return this.form; - }, - - // private - onRender : function(ct, position){ - this.initFields(); - Ext.FormPanel.superclass.onRender.call(this, ct, position); - this.form.initEl(this.body); - }, - - // private - beforeDestroy : function(){ - this.stopMonitoring(); - Ext.FormPanel.superclass.beforeDestroy.call(this); - /* - * Clear the items here to prevent them being destroyed again. - * Don't move this behaviour to BasicForm because it can be used - * on it's own. - */ - this.form.items.clear(); - Ext.destroy(this.form); - }, - - // Determine if a Component is usable as a form Field. - isField : function(c) { - return !!c.setValue && !!c.getValue && !!c.markInvalid && !!c.clearInvalid; - }, - - // private - initEvents : function(){ - Ext.FormPanel.superclass.initEvents.call(this); - this.on('remove', this.onRemove, this); - this.on('add', this.onAdd, this); - if(this.monitorValid){ // initialize after render - this.startMonitoring(); - } - }, - - // private - onAdd : function(ct, c) { - // If a single form Field, add it - if (this.isField(c)) { - this.form.add(c); - // If a Container, add any Fields it might contain - } else if (c.findBy) { - Ext.applyIf(c, { - labelAlign: c.ownerCt.labelAlign, - labelWidth: c.ownerCt.labelWidth, - itemCls: c.ownerCt.itemCls - }); - this.form.add.apply(this.form, c.findBy(this.isField)); - } - }, - - // private - onRemove : function(ct, c) { - // If a single form Field, remove it - if (this.isField(c)) { - Ext.destroy(c.container.up('.x-form-item')); - this.form.remove(c); - // If a Container, remove any Fields it might contain - } else if (c.findByType) { - Ext.each(c.findBy(this.isField), this.form.remove, this.form); - } - }, - - /** - * Starts monitoring of the valid state of this form. Usually this is done by passing the config - * option "monitorValid" - */ - startMonitoring : function(){ - if(!this.validTask){ - this.validTask = new Ext.util.TaskRunner(); - this.validTask.start({ - run : this.bindHandler, - interval : this.monitorPoll || 200, - scope: this - }); - } - }, - - /** - * Stops monitoring of the valid state of this form - */ - stopMonitoring : function(){ - if(this.validTask){ - this.validTask.stopAll(); - this.validTask = null; - } - }, - - /** - * This is a proxy for the underlying BasicForm's {@link Ext.form.BasicForm#load} call. - * @param {Object} options The options to pass to the action (see {@link Ext.form.BasicForm#doAction} for details) - */ - load : function(){ - this.form.load.apply(this.form, arguments); - }, - - // private - onDisable : function(){ - Ext.FormPanel.superclass.onDisable.call(this); - if(this.form){ - this.form.items.each(function(){ - this.disable(); - }); - } - }, - - // private - onEnable : function(){ - Ext.FormPanel.superclass.onEnable.call(this); - if(this.form){ - this.form.items.each(function(){ - this.enable(); - }); - } - }, - - // private - bindHandler : function(){ - var valid = true; - this.form.items.each(function(f){ - if(!f.isValid(true)){ - valid = false; - return false; - } - }); - if(this.fbar){ - var fitems = this.fbar.items.items; - for(var i = 0, len = fitems.length; i < len; i++){ - var btn = fitems[i]; - if(btn.formBind === true && btn.disabled === valid){ - btn.setDisabled(!valid); - } - } - } - this.fireEvent('clientvalidation', this, valid); - } -}); -Ext.reg('form', Ext.FormPanel); - -Ext.form.FormPanel = Ext.FormPanel; -