-<html>\r
-<head>\r
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> \r
- <title>The source code</title>\r
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body onload="prettyPrint();">\r
- <pre class="prettyprint lang-js"><div id="cls-Ext.form.FieldSet"></div>/**\r
- * @class Ext.form.FieldSet\r
- * @extends Ext.Panel\r
- * Standard container used for grouping items within a {@link Ext.form.FormPanel form}.\r
- * <pre><code>\r
-var form = new Ext.FormPanel({\r
- title: 'Simple Form with FieldSets',\r
- labelWidth: 75, // label settings here cascade unless overridden\r
- url: 'save-form.php',\r
- frame:true,\r
- bodyStyle:'padding:5px 5px 0',\r
- width: 700,\r
- renderTo: document.body,\r
- layout:'column', // arrange items in columns\r
- defaults: { // defaults applied to items\r
- layout: 'form',\r
- border: false,\r
- bodyStyle: 'padding:4px'\r
- },\r
- items: [{\r
- // Fieldset in Column 1\r
- xtype:'fieldset',\r
- columnWidth: 0.5,\r
- title: 'Fieldset 1',\r
- collapsible: true,\r
- autoHeight:true,\r
- defaults: {\r
- anchor: '-20' // leave room for error icon\r
- },\r
- defaultType: 'textfield',\r
- items :[{\r
- fieldLabel: 'Field 1'\r
- }, {\r
- fieldLabel: 'Field 2'\r
- }, {\r
- fieldLabel: 'Field 3'\r
- }\r
- ]\r
- },{\r
- // Fieldset in Column 2 - Panel inside\r
- xtype:'fieldset',\r
- title: 'Show Panel', // title, header, or checkboxToggle creates fieldset header\r
- autoHeight:true,\r
- columnWidth: 0.5,\r
- checkboxToggle: true,\r
- collapsed: true, // fieldset initially collapsed\r
- layout:'anchor',\r
- items :[{\r
- xtype: 'panel',\r
- anchor: '100%',\r
- title: 'Panel inside a fieldset',\r
- frame: true,\r
- height: 100\r
- }]\r
- }]\r
-});\r
- * </code></pre>\r
- * @constructor\r
- * @param {Object} config Configuration options\r
- * @xtype fieldset\r
- */\r
-Ext.form.FieldSet = Ext.extend(Ext.Panel, {\r
- <div id="cfg-Ext.form.FieldSet-checkboxToggle"></div>/**\r
- * @cfg {Mixed} checkboxToggle <tt>true</tt> to render a checkbox into the fieldset frame just\r
- * in front of the legend to expand/collapse the fieldset when the checkbox is toggled. (defaults\r
- * to <tt>false</tt>).\r
- * <p>A {@link Ext.DomHelper DomHelper} element spec may also be specified to create the checkbox.\r
- * If <tt>true</tt> is specified, the default DomHelper config object used to create the element\r
- * is:</p><pre><code>\r
- * {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'}\r
- * </code></pre> \r
- */\r
- <div id="cfg-Ext.form.FieldSet-checkboxName"></div>/**\r
- * @cfg {String} checkboxName The name to assign to the fieldset's checkbox if <tt>{@link #checkboxToggle} = true</tt>\r
- * (defaults to <tt>'[checkbox id]-checkbox'</tt>).\r
- */\r
- <div id="cfg-Ext.form.FieldSet-collapsible"></div>/**\r
- * @cfg {Boolean} collapsible\r
- * <tt>true</tt> to make the fieldset collapsible and have the expand/collapse toggle button automatically\r
- * rendered into the legend element, <tt>false</tt> to keep the fieldset statically sized with no collapse\r
- * button (defaults to <tt>false</tt>). Another option is to configure <tt>{@link #checkboxToggle}</tt>.\r
- */\r
- <div id="cfg-Ext.form.FieldSet-labelWidth"></div>/**\r
- * @cfg {Number} labelWidth The width of labels. This property cascades to child containers.\r
- */\r
- <div id="cfg-Ext.form.FieldSet-itemCls"></div>/**\r
- * @cfg {String} itemCls A css class to apply to the <tt>x-form-item</tt> of fields (see \r
- * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} for details).\r
- * This property cascades to child containers.\r
- */\r
- <div id="cfg-Ext.form.FieldSet-baseCls"></div>/**\r
- * @cfg {String} baseCls The base CSS class applied to the fieldset (defaults to <tt>'x-fieldset'</tt>).\r
- */\r
- baseCls : 'x-fieldset',\r
- <div id="cfg-Ext.form.FieldSet-layout"></div>/**\r
- * @cfg {String} layout The {@link Ext.Container#layout} to use inside the fieldset (defaults to <tt>'form'</tt>).\r
- */\r
- layout : 'form',\r
- <div id="cfg-Ext.form.FieldSet-animCollapse"></div>/**\r
- * @cfg {Boolean} animCollapse\r
- * <tt>true</tt> to animate the transition when the panel is collapsed, <tt>false</tt> to skip the\r
- * animation (defaults to <tt>false</tt>).\r
- */\r
- animCollapse : false,\r
-\r
- // private\r
- onRender : function(ct, position){\r
- if(!this.el){\r
- this.el = document.createElement('fieldset');\r
- this.el.id = this.id;\r
- if (this.title || this.header || this.checkboxToggle) {\r
- this.el.appendChild(document.createElement('legend')).className = this.baseCls + '-header';\r
- }\r
- }\r
-\r
- Ext.form.FieldSet.superclass.onRender.call(this, ct, position);\r
-\r
- if(this.checkboxToggle){\r
- var o = typeof this.checkboxToggle == 'object' ?\r
- this.checkboxToggle :\r
- {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'};\r
- this.checkbox = this.header.insertFirst(o);\r
- this.checkbox.dom.checked = !this.collapsed;\r
- this.mon(this.checkbox, 'click', this.onCheckClick, this);\r
- }\r
- },\r
-\r
- // private\r
- onCollapse : function(doAnim, animArg){\r
- if(this.checkbox){\r
- this.checkbox.dom.checked = false;\r
- }\r
- Ext.form.FieldSet.superclass.onCollapse.call(this, doAnim, animArg);\r
-\r
- },\r
-\r
- // private\r
- onExpand : function(doAnim, animArg){\r
- if(this.checkbox){\r
- this.checkbox.dom.checked = true;\r
- }\r
- Ext.form.FieldSet.superclass.onExpand.call(this, doAnim, animArg);\r
- },\r
-\r
- <div id="method-Ext.form.FieldSet-onCheckClick"></div>/**\r
- * This function is called by the fieldset's checkbox when it is toggled (only applies when\r
- * checkboxToggle = true). This method should never be called externally, but can be\r
- * overridden to provide custom behavior when the checkbox is toggled if needed.\r
- */\r
- onCheckClick : function(){\r
- this[this.checkbox.dom.checked ? 'expand' : 'collapse']();\r
- }\r
-\r
- <div id="cfg-Ext.form.FieldSet-activeItem"></div>/**\r
- * @cfg {String/Number} activeItem\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-applyTo"></div>/**\r
- * @cfg {Mixed} applyTo\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-bodyBorder"></div>/**\r
- * @cfg {Boolean} bodyBorder\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-border"></div>/**\r
- * @cfg {Boolean} border\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-bufferResize"></div>/**\r
- * @cfg {Boolean/Number} bufferResize\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-collapseFirst"></div>/**\r
- * @cfg {Boolean} collapseFirst\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-defaultType"></div>/**\r
- * @cfg {String} defaultType\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-disabledClass"></div>/**\r
- * @cfg {String} disabledClass\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-elements"></div>/**\r
- * @cfg {String} elements\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-floating"></div>/**\r
- * @cfg {Boolean} floating\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-footer"></div>/**\r
- * @cfg {Boolean} footer\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-frame"></div>/**\r
- * @cfg {Boolean} frame\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-header"></div>/**\r
- * @cfg {Boolean} header\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-headerAsText"></div>/**\r
- * @cfg {Boolean} headerAsText\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-hideCollapseTool"></div>/**\r
- * @cfg {Boolean} hideCollapseTool\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-iconCls"></div>/**\r
- * @cfg {String} iconCls\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-shadow"></div>/**\r
- * @cfg {Boolean/String} shadow\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-shadowOffset"></div>/**\r
- * @cfg {Number} shadowOffset\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-shim"></div>/**\r
- * @cfg {Boolean} shim\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-tbar"></div>/**\r
- * @cfg {Object/Array} tbar\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-tools"></div>/**\r
- * @cfg {Array} tools\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-toolTemplate"></div>/**\r
- * @cfg {Ext.Template/Ext.XTemplate} toolTemplate\r
- * @hide\r
- */\r
- <div id="cfg-Ext.form.FieldSet-xtype"></div>/**\r
- * @cfg {String} xtype\r
- * @hide\r
- */\r
- <div id="prop-Ext.form.FieldSet-header"></div>/**\r
- * @property header\r
- * @hide\r
- */\r
- <div id="prop-Ext.form.FieldSet-footer"></div>/**\r
- * @property footer\r
- * @hide\r
- */\r
- <div id="method-Ext.form.FieldSet-focus"></div>/**\r
- * @method focus\r
- * @hide\r
- */\r
- <div id="method-Ext.form.FieldSet-getBottomToolbar"></div>/**\r
- * @method getBottomToolbar\r
- * @hide\r
- */\r
- <div id="method-Ext.form.FieldSet-getTopToolbar"></div>/**\r
- * @method getTopToolbar\r
- * @hide\r
- */\r
- <div id="method-Ext.form.FieldSet-setIconClass"></div>/**\r
- * @method setIconClass\r
- * @hide\r
- */\r
- <div id="event-Ext.form.FieldSet-activate"></div>/**\r
- * @event activate\r
- * @hide\r
- */\r
- <div id="event-Ext.form.FieldSet-beforeclose"></div>/**\r
- * @event beforeclose\r
- * @hide\r
- */\r
- <div id="event-Ext.form.FieldSet-bodyresize"></div>/**\r
- * @event bodyresize\r
- * @hide\r
- */\r
- <div id="event-Ext.form.FieldSet-close"></div>/**\r
- * @event close\r
- * @hide\r
- */\r
- <div id="event-Ext.form.FieldSet-deactivate"></div>/**\r
- * @event deactivate\r
- * @hide\r
- */\r
-});\r
-Ext.reg('fieldset', Ext.form.FieldSet);\r
-</pre> \r
-</body>\r
-</html>
\ No newline at end of file
+<!DOCTYPE html>
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <title>The source code</title>
+ <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
+ <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
+ <style type="text/css">
+ .highlight { display: block; background-color: #ddd; }
+ </style>
+ <script type="text/javascript">
+ function highlight() {
+ document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+ }
+ </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+ <pre class="prettyprint lang-js"><span id='Ext-form-FieldSet'>/**
+</span> * @docauthor Jason Johnston <jason@sencha.com>
+ *
+ * A container for grouping sets of fields, rendered as a HTML `fieldset` element. The {@link #title}
+ * config will be rendered as the fieldset's `legend`.
+ *
+ * While FieldSets commonly contain simple groups of fields, they are general {@link Ext.container.Container Containers}
+ * and may therefore contain any type of components in their {@link #items}, including other nested containers.
+ * The default {@link #layout} for the FieldSet's items is `'anchor'`, but it can be configured to use any other
+ * layout type.
+ *
+ * FieldSets may also be collapsed if configured to do so; this can be done in two ways:
+ *
+ * 1. Set the {@link #collapsible} config to true; this will result in a collapse button being rendered next to
+ * the {@link #title legend title}, or:
+ * 2. Set the {@link #checkboxToggle} config to true; this is similar to using {@link #collapsible} but renders
+ * a {@link Ext.form.field.Checkbox checkbox} in place of the toggle button. The fieldset will be expanded when the
+ * checkbox is checked and collapsed when it is unchecked. The checkbox will also be included in the
+ * {@link Ext.form.Basic#submit form submit parameters} using the {@link #checkboxName} as its parameter name.
+ *
+ * # Example usage
+ *
+ * @example
+ * Ext.create('Ext.form.Panel', {
+ * title: 'Simple Form with FieldSets',
+ * labelWidth: 75, // label settings here cascade unless overridden
+ * url: 'save-form.php',
+ * frame: true,
+ * bodyStyle: 'padding:5px 5px 0',
+ * width: 550,
+ * renderTo: Ext.getBody(),
+ * layout: 'column', // arrange fieldsets side by side
+ * defaults: {
+ * bodyPadding: 4
+ * },
+ * items: [{
+ * // Fieldset in Column 1 - collapsible via toggle button
+ * xtype:'fieldset',
+ * columnWidth: 0.5,
+ * title: 'Fieldset 1',
+ * collapsible: true,
+ * defaultType: 'textfield',
+ * defaults: {anchor: '100%'},
+ * layout: 'anchor',
+ * items :[{
+ * fieldLabel: 'Field 1',
+ * name: 'field1'
+ * }, {
+ * fieldLabel: 'Field 2',
+ * name: 'field2'
+ * }]
+ * }, {
+ * // Fieldset in Column 2 - collapsible via checkbox, collapsed by default, contains a panel
+ * xtype:'fieldset',
+ * title: 'Show Panel', // title or checkboxToggle creates fieldset header
+ * columnWidth: 0.5,
+ * checkboxToggle: true,
+ * collapsed: true, // fieldset initially collapsed
+ * layout:'anchor',
+ * items :[{
+ * xtype: 'panel',
+ * anchor: '100%',
+ * title: 'Panel inside a fieldset',
+ * frame: true,
+ * height: 52
+ * }]
+ * }]
+ * });
+ */
+Ext.define('Ext.form.FieldSet', {
+ extend: 'Ext.container.Container',
+ alias: 'widget.fieldset',
+ uses: ['Ext.form.field.Checkbox', 'Ext.panel.Tool', 'Ext.layout.container.Anchor', 'Ext.layout.component.FieldSet'],
+
+<span id='Ext-form-FieldSet-cfg-title'> /**
+</span> * @cfg {String} title
+ * A title to be displayed in the fieldset's legend. May contain HTML markup.
+ */
+
+<span id='Ext-form-FieldSet-cfg-checkboxToggle'> /**
+</span> * @cfg {Boolean} [checkboxToggle=false]
+ * Set to true to render a checkbox into the fieldset frame just in front of the legend to expand/collapse the
+ * fieldset when the checkbox is toggled.. This checkbox will be included in form submits using
+ * the {@link #checkboxName}.
+ */
+
+<span id='Ext-form-FieldSet-cfg-checkboxName'> /**
+</span> * @cfg {String} checkboxName
+ * The name to assign to the fieldset's checkbox if {@link #checkboxToggle} = true
+ * (defaults to '[fieldset id]-checkbox').
+ */
+
+<span id='Ext-form-FieldSet-cfg-collapsible'> /**
+</span> * @cfg {Boolean} [collapsible=false]
+ * Set to true to make the fieldset collapsible and have the expand/collapse toggle button automatically rendered
+ * into the legend element, false to keep the fieldset statically sized with no collapse button.
+ * Another option is to configure {@link #checkboxToggle}. Use the {@link #collapsed} config to collapse the
+ * fieldset by default.
+ */
+
+<span id='Ext-form-FieldSet-cfg-collapsed'> /**
+</span> * @cfg {Boolean} collapsed
+ * Set to true to render the fieldset as collapsed by default. If {@link #checkboxToggle} is specified, the checkbox
+ * will also be unchecked by default.
+ */
+ collapsed: false,
+
+<span id='Ext-form-FieldSet-property-legend'> /**
+</span> * @property {Ext.Component} legend
+ * The component for the fieldset's legend. Will only be defined if the configuration requires a legend to be
+ * created, by setting the {@link #title} or {@link #checkboxToggle} options.
+ */
+
+<span id='Ext-form-FieldSet-cfg-baseCls'> /**
+</span> * @cfg {String} [baseCls='x-fieldset']
+ * The base CSS class applied to the fieldset.
+ */
+ baseCls: Ext.baseCSSPrefix + 'fieldset',
+
+<span id='Ext-form-FieldSet-cfg-layout'> /**
+</span> * @cfg {String} layout
+ * The {@link Ext.container.Container#layout} for the fieldset's immediate child items.
+ */
+ layout: 'anchor',
+
+ componentLayout: 'fieldset',
+
+ // No aria role necessary as fieldset has its own recognized semantics
+ ariaRole: '',
+
+ renderTpl: ['<div id="{id}-body" class="{baseCls}-body"></div>'],
+
+ maskOnDisable: false,
+
+ getElConfig: function(){
+ return {tag: 'fieldset', id: this.id};
+ },
+
+ initComponent: function() {
+ var me = this,
+ baseCls = me.baseCls;
+
+ me.callParent();
+
+ // Create the Legend component if needed
+ me.initLegend();
+
+ // Add body el
+ me.addChildEls('body');
+
+ if (me.collapsed) {
+ me.addCls(baseCls + '-collapsed');
+ me.collapse();
+ }
+ },
+
+ // private
+ onRender: function(container, position) {
+ this.callParent(arguments);
+ // Make sure the legend is created and rendered
+ this.initLegend();
+ },
+
+<span id='Ext-form-FieldSet-method-initLegend'> /**
+</span> * @private
+ * Initialize and render the legend component if necessary
+ */
+ initLegend: function() {
+ var me = this,
+ legendItems,
+ legend = me.legend;
+
+ // Create the legend component if needed and it hasn't been already
+ if (!legend && (me.title || me.checkboxToggle || me.collapsible)) {
+ legendItems = [];
+
+ // Checkbox
+ if (me.checkboxToggle) {
+ legendItems.push(me.createCheckboxCmp());
+ }
+ // Toggle button
+ else if (me.collapsible) {
+ legendItems.push(me.createToggleCmp());
+ }
+
+ // Title
+ legendItems.push(me.createTitleCmp());
+
+ legend = me.legend = Ext.create('Ext.container.Container', {
+ baseCls: me.baseCls + '-header',
+ ariaRole: '',
+ ownerCt: this,
+ getElConfig: function(){
+ var result = {
+ tag: 'legend',
+ cls: this.baseCls
+ };
+
+ // Gecko3 will kick every <div> out of <legend> and mess up every thing.
+ // So here we change every <div> into <span>s. Therefore the following
+ // clearer is not needed and since div introduces a lot of subsequent
+ // problems, it is actually harmful.
+ if (!Ext.isGecko3) {
+ result.children = [{
+ cls: Ext.baseCSSPrefix + 'clear'
+ }];
+ }
+ return result;
+ },
+ items: legendItems
+ });
+ }
+
+ // Make sure legend is rendered if the fieldset is rendered
+ if (legend && !legend.rendered && me.rendered) {
+ me.legend.render(me.el, me.body); //insert before body element
+ }
+ },
+
+<span id='Ext-form-FieldSet-method-createTitleCmp'> /**
+</span> * Creates the legend title component. This is only called internally, but could be overridden in subclasses to
+ * customize the title component.
+ * @return Ext.Component
+ * @protected
+ */
+ createTitleCmp: function() {
+ var me = this;
+ me.titleCmp = Ext.create('Ext.Component', {
+ html: me.title,
+ getElConfig: function() {
+ return {
+ tag: Ext.isGecko3 ? 'span' : 'div',
+ cls: me.titleCmp.cls,
+ id: me.titleCmp.id
+ };
+ },
+ cls: me.baseCls + '-header-text'
+ });
+ return me.titleCmp;
+ },
+
+<span id='Ext-form-FieldSet-property-checkboxCmp'> /**
+</span> * @property {Ext.form.field.Checkbox} checkboxCmp
+ * Refers to the {@link Ext.form.field.Checkbox} component that is added next to the title in the legend. Only
+ * populated if the fieldset is configured with {@link #checkboxToggle}:true.
+ */
+
+<span id='Ext-form-FieldSet-method-createCheckboxCmp'> /**
+</span> * Creates the checkbox component. This is only called internally, but could be overridden in subclasses to
+ * customize the checkbox's configuration or even return an entirely different component type.
+ * @return Ext.Component
+ * @protected
+ */
+ createCheckboxCmp: function() {
+ var me = this,
+ suffix = '-checkbox';
+
+ me.checkboxCmp = Ext.create('Ext.form.field.Checkbox', {
+ getElConfig: function() {
+ return {
+ tag: Ext.isGecko3 ? 'span' : 'div',
+ id: me.checkboxCmp.id,
+ cls: me.checkboxCmp.cls
+ };
+ },
+ name: me.checkboxName || me.id + suffix,
+ cls: me.baseCls + '-header' + suffix,
+ checked: !me.collapsed,
+ listeners: {
+ change: me.onCheckChange,
+ scope: me
+ }
+ });
+ return me.checkboxCmp;
+ },
+
+<span id='Ext-form-FieldSet-property-toggleCmp'> /**
+</span> * @property {Ext.panel.Tool} toggleCmp
+ * Refers to the {@link Ext.panel.Tool} component that is added as the collapse/expand button next to the title in
+ * the legend. Only populated if the fieldset is configured with {@link #collapsible}:true.
+ */
+
+<span id='Ext-form-FieldSet-method-createToggleCmp'> /**
+</span> * Creates the toggle button component. This is only called internally, but could be overridden in subclasses to
+ * customize the toggle component.
+ * @return Ext.Component
+ * @protected
+ */
+ createToggleCmp: function() {
+ var me = this;
+ me.toggleCmp = Ext.create('Ext.panel.Tool', {
+ getElConfig: function() {
+ return {
+ tag: Ext.isGecko3 ? 'span' : 'div',
+ id: me.toggleCmp.id,
+ cls: me.toggleCmp.cls
+ };
+ },
+ type: 'toggle',
+ handler: me.toggle,
+ scope: me
+ });
+ return me.toggleCmp;
+ },
+
+<span id='Ext-form-FieldSet-method-setTitle'> /**
+</span> * Sets the title of this fieldset
+ * @param {String} title The new title
+ * @return {Ext.form.FieldSet} this
+ */
+ setTitle: function(title) {
+ var me = this;
+ me.title = title;
+ me.initLegend();
+ me.titleCmp.update(title);
+ return me;
+ },
+
+ getTargetEl : function() {
+ return this.body || this.frameBody || this.el;
+ },
+
+ getContentTarget: function() {
+ return this.body;
+ },
+
+<span id='Ext-form-FieldSet-method-getRefItems'> /**
+</span> * @private
+ * Include the legend component in the items for ComponentQuery
+ */
+ getRefItems: function(deep) {
+ var refItems = this.callParent(arguments),
+ legend = this.legend;
+
+ // Prepend legend items to ensure correct order
+ if (legend) {
+ refItems.unshift(legend);
+ if (deep) {
+ refItems.unshift.apply(refItems, legend.getRefItems(true));
+ }
+ }
+ return refItems;
+ },
+
+<span id='Ext-form-FieldSet-method-expand'> /**
+</span> * Expands the fieldset.
+ * @return {Ext.form.FieldSet} this
+ */
+ expand : function(){
+ return this.setExpanded(true);
+ },
+
+<span id='Ext-form-FieldSet-method-collapse'> /**
+</span> * Collapses the fieldset.
+ * @return {Ext.form.FieldSet} this
+ */
+ collapse : function() {
+ return this.setExpanded(false);
+ },
+
+<span id='Ext-form-FieldSet-method-setExpanded'> /**
+</span> * @private Collapse or expand the fieldset
+ */
+ setExpanded: function(expanded) {
+ var me = this,
+ checkboxCmp = me.checkboxCmp;
+
+ expanded = !!expanded;
+
+ if (checkboxCmp) {
+ checkboxCmp.setValue(expanded);
+ }
+
+ if (expanded) {
+ me.removeCls(me.baseCls + '-collapsed');
+ } else {
+ me.addCls(me.baseCls + '-collapsed');
+ }
+ me.collapsed = !expanded;
+ if (expanded) {
+ // ensure subitems will get rendered and layed out when expanding
+ me.getComponentLayout().childrenChanged = true;
+ }
+ me.doComponentLayout();
+ return me;
+ },
+
+<span id='Ext-form-FieldSet-method-toggle'> /**
+</span> * Toggle the fieldset's collapsed state to the opposite of what it is currently
+ */
+ toggle: function() {
+ this.setExpanded(!!this.collapsed);
+ },
+
+<span id='Ext-form-FieldSet-method-onCheckChange'> /**
+</span> * @private
+ * Handle changes in the checkbox checked state
+ */
+ onCheckChange: function(cmp, checked) {
+ this.setExpanded(checked);
+ },
+
+ beforeDestroy : function() {
+ var legend = this.legend;
+ if (legend) {
+ legend.destroy();
+ }
+ this.callParent();
+ }
+});
+</pre>
+</body>
+</html>
git.ithinksw.org / extjs.git / blobdiff