+++ /dev/null
-/*\r
- * Ext JS Library 2.2.1\r
- * Copyright(c) 2006-2009, Ext JS, LLC.\r
- * licensing@extjs.com\r
- * \r
- * http://extjs.com/license\r
- */\r
-\r
-/**\r
- * @class Ext.form.FormPanel\r
- * @extends Ext.Panel\r
- * Standard form container.\r
- * <p><b>Although they are not listed, this class also accepts all the config options required to configure its internal {@link Ext.form.BasicForm}</b></p>\r
- * <p>The BasicForm is configured using the {@link #initialConfig} of the FormPanel - that is the configuration object passed to the constructor.\r
- * This means that if you subclass FormPanel, and you wish to configure the BasicForm, you will need to insert any configuration options\r
- * for the BasicForm into the <tt><b>initialConfig</b></tt> property. Applying BasicForm configuration settings to <b><tt>this</tt></b> will\r
- * not affect the BasicForm's configuration.</p>\r
- * <p>By default, FormPanel uses an {@link Ext.layout.FormLayout} layout manager, which styles and renders fields and labels correctly.\r
- * When nesting additional Containers within a FormPanel, you should ensure that any descendant Containers which\r
- * host input Fields use the {@link Ext.layout.FormLayout} layout manager.</p>\r
- * <p>By default, Ext Forms are submitted through Ajax, using {@link Ext.form.Action}.\r
- * To enable normal browser submission of the Ext Form contained in this FormPanel,\r
- * use the {@link Ext.form.BasicForm#standardSubmit standardSubmit) option:</p><pre><code>\r
-var myForm = new Ext.form.FormPanel({\r
- standardSubmit: true,\r
- items: myFieldset\r
-});</code></pre>\r
- * @constructor\r
- * @param {Object} config Configuration options\r
- */\r
-Ext.FormPanel = Ext.extend(Ext.Panel, {\r
- /**\r
- * @cfg {String} formId (optional) The id of the FORM tag (defaults to an auto-generated id).\r
- */\r
- /**\r
- * @cfg {Number} labelWidth The width of labels. This property cascades to child containers and can be overridden\r
- * on any child container (e.g., a fieldset can specify a different labelWidth for its fields).\r
- */\r
- /**\r
- * @cfg {String} itemCls A css class to apply to the x-form-item of fields. This property cascades to child containers.\r
- */\r
- /**\r
- * @cfg {Array} buttons\r
- * An array of {@link Ext.Button}s or {@link Ext.Button} configs used to add buttons to the footer of this FormPanel.<br>\r
- * <p>Buttons in the footer of a FormPanel may be configured with the option <tt>formBind: true</tt>. This causes\r
- * the form's {@link #monitorValid valid state monitor task} to enable/disable those Buttons depending on\r
- * the form's valid/invalid state.</p>\r
- */\r
- /**\r
- * @cfg {String} buttonAlign Valid values are "left," "center" and "right" (defaults to "center")\r
- */\r
- buttonAlign:'center',\r
-\r
- /**\r
- * @cfg {Number} minButtonWidth Minimum width of all buttons in pixels (defaults to 75)\r
- */\r
- minButtonWidth:75,\r
-\r
- /**\r
- * @cfg {String} labelAlign Valid values are "left," "top" and "right" (defaults to "left").\r
- * This property cascades to child containers and can be overridden on any child container \r
- * (e.g., a fieldset can specify a different labelAlign for its fields).\r
- */\r
- labelAlign:'left',\r
-\r
- /**\r
- * @cfg {Boolean} monitorValid If true, the form monitors its valid state <b>client-side</b> and\r
- * regularly fires the {@link #clientvalidation} event passing that state.<br>\r
- * <p>When monitoring valid state, the FormPanel enables/disables any of its configured\r
- * {@link #button}s which have been configured with <tt>formBind: true<tt> depending\r
- * on whether the form is valid or not.</p>\r
- */\r
- monitorValid : false,\r
-\r
- /**\r
- * @cfg {Number} monitorPoll The milliseconds to poll valid state, ignored if monitorValid is not true (defaults to 200)\r
- */\r
- monitorPoll : 200,\r
-\r
- /**\r
- * @cfg {String} layout @hide\r
- */\r
- layout: 'form',\r
-\r
- // private\r
- initComponent :function(){\r
- this.form = this.createForm();\r
-\r
- this.bodyCfg = {\r
- tag: 'form',\r
- cls: this.baseCls + '-body',\r
- method : this.method || 'POST',\r
- id : this.formId || Ext.id()\r
- };\r
- if(this.fileUpload) {\r
- this.bodyCfg.enctype = 'multipart/form-data';\r
- }\r
-\r
- Ext.FormPanel.superclass.initComponent.call(this);\r
-\r
- this.initItems();\r
-\r
- this.addEvents(\r
- /**\r
- * @event clientvalidation\r
- * If the monitorValid config option is true, this event fires repetitively to notify of valid state\r
- * @param {Ext.form.FormPanel} this\r
- * @param {Boolean} valid true if the form has passed client-side validation\r
- */\r
- 'clientvalidation'\r
- );\r
-\r
- this.relayEvents(this.form, ['beforeaction', 'actionfailed', 'actioncomplete']);\r
- },\r
-\r
- // private\r
- createForm: function(){\r
- delete this.initialConfig.listeners;\r
- return new Ext.form.BasicForm(null, this.initialConfig);\r
- },\r
-\r
- // private\r
- initFields : function(){\r
- var f = this.form;\r
- var formPanel = this;\r
- var fn = function(c){\r
- if(c.isFormField){\r
- f.add(c);\r
- }else if(c.doLayout && c != formPanel){\r
- Ext.applyIf(c, {\r
- labelAlign: c.ownerCt.labelAlign,\r
- labelWidth: c.ownerCt.labelWidth,\r
- itemCls: c.ownerCt.itemCls\r
- });\r
- if(c.items){\r
- c.items.each(fn);\r
- }\r
- }\r
- }\r
- this.items.each(fn);\r
- },\r
-\r
- // private\r
- getLayoutTarget : function(){\r
- return this.form.el;\r
- },\r
-\r
- /**\r
- * Provides access to the {@link Ext.form.BasicForm Form} which this Panel contains.\r
- * @return {Ext.form.BasicForm} The {@link Ext.form.BasicForm Form} which this Panel contains.\r
- */\r
- getForm : function(){\r
- return this.form;\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- this.initFields();\r
-\r
- Ext.FormPanel.superclass.onRender.call(this, ct, position);\r
- this.form.initEl(this.body);\r
- },\r
- \r
- // private\r
- beforeDestroy: function(){\r
- Ext.FormPanel.superclass.beforeDestroy.call(this);\r
- this.stopMonitoring();\r
- Ext.destroy(this.form);\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.FormPanel.superclass.initEvents.call(this);\r
- this.items.on('remove', this.onRemove, this);\r
- this.items.on('add', this.onAdd, this);\r
- if(this.monitorValid){ // initialize after render\r
- this.startMonitoring();\r
- }\r
- },\r
- \r
- // private\r
- onAdd : function(ct, c) {\r
- if (c.isFormField) {\r
- this.form.add(c);\r
- }\r
- },\r
- \r
- // private\r
- onRemove : function(c) {\r
- if (c.isFormField) {\r
- Ext.destroy(c.container.up('.x-form-item'));\r
- this.form.remove(c);\r
- }\r
- },\r
-\r
- /**\r
- * Starts monitoring of the valid state of this form. Usually this is done by passing the config\r
- * option "monitorValid"\r
- */\r
- startMonitoring : function(){\r
- if(!this.bound){\r
- this.bound = true;\r
- Ext.TaskMgr.start({\r
- run : this.bindHandler,\r
- interval : this.monitorPoll || 200,\r
- scope: this\r
- });\r
- }\r
- },\r
-\r
- /**\r
- * Stops monitoring of the valid state of this form\r
- */\r
- stopMonitoring : function(){\r
- this.bound = false;\r
- },\r
-\r
- /**\r
- * This is a proxy for the underlying BasicForm's {@link Ext.form.BasicForm#load} call.\r
- * @param {Object} options The options to pass to the action (see {@link Ext.form.BasicForm#doAction} for details)\r
- */\r
- load : function(){\r
- this.form.load.apply(this.form, arguments); \r
- },\r
-\r
- // private\r
- onDisable : function(){\r
- Ext.FormPanel.superclass.onDisable.call(this);\r
- if(this.form){\r
- this.form.items.each(function(){\r
- this.disable();\r
- });\r
- }\r
- },\r
-\r
- // private\r
- onEnable : function(){\r
- Ext.FormPanel.superclass.onEnable.call(this);\r
- if(this.form){\r
- this.form.items.each(function(){\r
- this.enable();\r
- });\r
- }\r
- },\r
-\r
- // private\r
- bindHandler : function(){\r
- if(!this.bound){\r
- return false; // stops binding\r
- }\r
- var valid = true;\r
- this.form.items.each(function(f){\r
- if(!f.isValid(true)){\r
- valid = false;\r
- return false;\r
- }\r
- });\r
- if(this.buttons){\r
- for(var i = 0, len = this.buttons.length; i < len; i++){\r
- var btn = this.buttons[i];\r
- if(btn.formBind === true && btn.disabled === valid){\r
- btn.setDisabled(!valid);\r
- }\r
- }\r
- }\r
- this.fireEvent('clientvalidation', this, valid);\r
- }\r
-});\r
-Ext.reg('form', Ext.FormPanel);\r
-\r
-Ext.form.FormPanel = Ext.FormPanel;\r
-\r
git.ithinksw.org / extjs.git / blobdiff