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: @@ -22,11 +22,11 @@ *
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 {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 @@ -110,7 +110,7 @@ Ext.FormPanel = Ext.extend(Ext.Panel, { monitorPoll : 200, /** - * @cfg {String} layout Defaults to 'form'. Normally this configuration property should not be altered. + * @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', @@ -130,7 +130,7 @@ Ext.FormPanel = Ext.extend(Ext.Panel, { this.bodyCfg.enctype = 'multipart/form-data'; } this.initItems(); - + this.addEvents( /** * @event clientvalidation @@ -167,7 +167,7 @@ Ext.FormPanel = Ext.extend(Ext.Panel, { }; this.items.each(fn, this); }, - + // private applySettings: function(c){ var ct = c.ownerCt; @@ -197,21 +197,20 @@ Ext.FormPanel = Ext.extend(Ext.Panel, { 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); + this.form.items.clear(); + Ext.FormPanel.superclass.beforeDestroy.call(this); }, - // Determine if a Component is usable as a form Field. + // Determine if a Component is usable as a form Field. isField : function(c) { return !!c.setValue && !!c.getValue && !!c.markInvalid && !!c.clearInvalid; }, @@ -229,52 +228,55 @@ Ext.FormPanel = Ext.extend(Ext.Panel, { this.startMonitoring(); } }, - + // private onAdd: function(c){ - Ext.FormPanel.superclass.onAdd.call(this, c); + Ext.FormPanel.superclass.onAdd.call(this, c); this.processAdd(c); }, - + // private onAddEvent: function(ct, c){ if(ct !== this){ this.processAdd(c); } }, - + // private processAdd : function(c){ - // If a single form Field, add it + // If a single form Field, add it if(this.isField(c)){ this.form.add(c); - // If a Container, add any Fields it might contain + // If a Container, add any Fields it might contain }else if(c.findBy){ this.applySettings(c); this.form.add.apply(this.form, c.findBy(this.isField)); } }, - + // private onRemove: function(c){ Ext.FormPanel.superclass.onRemove.call(this, c); this.processRemove(c); }, - + onRemoveEvent: function(ct, c){ if(ct !== this){ this.processRemove(c); } }, - + // private processRemove : function(c){ - // If a single form Field, remove it + // If a single form Field, remove it if(this.isField(c)){ - this.form.remove(c); - // If a Container, remove any Fields it might contain + this.form.remove(c); + // If a Container, its already destroyed by the time it gets here. Remove any references to destroyed fields. }else if(c.findBy){ - Ext.each(c.findBy(this.isField), this.form.remove, this.form); + var isDestroyed = function(o) { + return !!o.isDestroyed; + } + this.form.items.filterBy(isDestroyed, this.form).each(this.form.remove, this.form); } }, @@ -308,7 +310,7 @@ Ext.FormPanel = Ext.extend(Ext.Panel, { * @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); + this.form.load.apply(this.form, arguments); }, // private @@ -355,4 +357,3 @@ Ext.FormPanel = Ext.extend(Ext.Panel, { Ext.reg('form', Ext.FormPanel); Ext.form.FormPanel = Ext.FormPanel; -