    /**
     * @class Ext.form.FieldSet
     * @extends Ext.Panel
     * Standard container used for grouping items within a {@link Ext.form.FormPanel form}.
     * <pre><code>
    var form = new Ext.FormPanel({
        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: 700,
        renderTo: document.body,
        layout:'column', // arrange items in columns
        defaults: {      // defaults applied to items
            layout: 'form',
            border: false,
            bodyStyle: 'padding:4px'
        },
        items: [{
            // Fieldset in Column 1
            xtype:'fieldset',
            columnWidth: 0.5,
            title: 'Fieldset 1',
            collapsible: true,
            autoHeight:true,
            defaults: {
                anchor: '-20' // leave room for error icon
            },
            defaultType: 'textfield',
            items :[{
                    fieldLabel: 'Field 1'
                }, {
                    fieldLabel: 'Field 2'
                }, {
                    fieldLabel: 'Field 3'
                }
            ]
        },{
            // Fieldset in Column 2 - Panel inside
            xtype:'fieldset',
            title: 'Show Panel', // title, header, or checkboxToggle creates fieldset header
            autoHeight:true,
            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: 100
            }]
        }]
    });
     * </code></pre>
     * @constructor
     * @param {Object} config Configuration options
     * @xtype fieldset
     */
    Ext.form.FieldSet = Ext.extend(Ext.Panel, {
        /**
         * @cfg {Mixed} checkboxToggle <tt>true</tt> to render a checkbox into the fieldset frame just
         * in front of the legend to expand/collapse the fieldset when the checkbox is toggled. (defaults
         * to <tt>false</tt>).
         * <p>A {@link Ext.DomHelper DomHelper} element spec may also be specified to create the checkbox.
         * If <tt>true</tt> is specified, the default DomHelper config object used to create the element
         * is:</p><pre><code>
         * {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'}
         * </code></pre>
         */
        /**
         * @cfg {String} checkboxName The name to assign to the fieldset's checkbox if <tt>{@link #checkboxToggle} = true</tt>
         * (defaults to <tt>'[checkbox id]-checkbox'</tt>).
         */
        /**
         * @cfg {Boolean} collapsible
         * <tt>true</tt> to make the fieldset collapsible and have the expand/collapse toggle button automatically
         * rendered into the legend element, <tt>false</tt> to keep the fieldset statically sized with no collapse
         * button (defaults to <tt>false</tt>). Another option is to configure <tt>{@link #checkboxToggle}</tt>.
         */
        /**
         * @cfg {Number} labelWidth The width of labels. This property cascades to child containers.
         */
        /**
         * @cfg {String} itemCls A css class to apply to the <tt>x-form-item</tt> of fields (see
         * {@link Ext.layout.FormLayout}.{@link Ext.layout.FormLayout#fieldTpl fieldTpl} for details).
         * This property cascades to child containers.
         */
        /**
         * @cfg {String} baseCls The base CSS class applied to the fieldset (defaults to <tt>'x-fieldset'</tt>).
         */
        baseCls : 'x-fieldset',
        /**
         * @cfg {String} layout The {@link Ext.Container#layout} to use inside the fieldset (defaults to <tt>'form'</tt>).
         */
        layout : 'form',
        /**
         * @cfg {Boolean} animCollapse
         * <tt>true</tt> to animate the transition when the panel is collapsed, <tt>false</tt> to skip the
         * animation (defaults to <tt>false</tt>).
         */
        animCollapse : false,

        // private
        onRender : function(ct, position){
            if(!this.el){
                this.el = document.createElement('fieldset');
                this.el.id = this.id;
                if (this.title || this.header || this.checkboxToggle) {
                    this.el.appendChild(document.createElement('legend')).className = this.baseCls + '-header';
                }
            }

            Ext.form.FieldSet.superclass.onRender.call(this, ct, position);

            if(this.checkboxToggle){
                var o = typeof this.checkboxToggle == 'object' ?
                        this.checkboxToggle :
                        {tag: 'input', type: 'checkbox', name: this.checkboxName || this.id+'-checkbox'};
                this.checkbox = this.header.insertFirst(o);
                this.checkbox.dom.checked = !this.collapsed;
                this.mon(this.checkbox, 'click', this.onCheckClick, this);
            }
        },

        // private
        onCollapse : function(doAnim, animArg){
            if(this.checkbox){
                this.checkbox.dom.checked = false;
            }
            Ext.form.FieldSet.superclass.onCollapse.call(this, doAnim, animArg);

        },

        // private
        onExpand : function(doAnim, animArg){
            if(this.checkbox){
                this.checkbox.dom.checked = true;
            }
            Ext.form.FieldSet.superclass.onExpand.call(this, doAnim, animArg);
        },

        /**
         * This function is called by the fieldset's checkbox when it is toggled (only applies when
         * checkboxToggle = true).  This method should never be called externally, but can be
         * overridden to provide custom behavior when the checkbox is toggled if needed.
         */
        onCheckClick : function(){
            this[this.checkbox.dom.checked ? 'expand' : 'collapse']();
        }

        /**
         * @cfg {String/Number} activeItem
         * @hide
         */
        /**
         * @cfg {Mixed} applyTo
         * @hide
         */
        /**
         * @cfg {Boolean} bodyBorder
         * @hide
         */
        /**
         * @cfg {Boolean} border
         * @hide
         */
        /**
         * @cfg {Boolean/Number} bufferResize
         * @hide
         */
        /**
         * @cfg {Boolean} collapseFirst
         * @hide
         */
        /**
         * @cfg {String} defaultType
         * @hide
         */
        /**
         * @cfg {String} disabledClass
         * @hide
         */
        /**
         * @cfg {String} elements
         * @hide
         */
        /**
         * @cfg {Boolean} floating
         * @hide
         */
        /**
         * @cfg {Boolean} footer
         * @hide
         */
        /**
         * @cfg {Boolean} frame
         * @hide
         */
        /**
         * @cfg {Boolean} header
         * @hide
         */
        /**
         * @cfg {Boolean} headerAsText
         * @hide
         */
        /**
         * @cfg {Boolean} hideCollapseTool
         * @hide
         */
        /**
         * @cfg {String} iconCls
         * @hide
         */
        /**
         * @cfg {Boolean/String} shadow
         * @hide
         */
        /**
         * @cfg {Number} shadowOffset
         * @hide
         */
        /**
         * @cfg {Boolean} shim
         * @hide
         */
        /**
         * @cfg {Object/Array} tbar
         * @hide
         */
        /**
         * @cfg {Array} tools
         * @hide
         */
        /**
         * @cfg {Ext.Template/Ext.XTemplate} toolTemplate
         * @hide
         */
        /**
         * @cfg {String} xtype
         * @hide
         */
        /**
         * @property header
         * @hide
         */
        /**
         * @property footer
         * @hide
         */
        /**
         * @method focus
         * @hide
         */
        /**
         * @method getBottomToolbar
         * @hide
         */
        /**
         * @method getTopToolbar
         * @hide
         */
        /**
         * @method setIconClass
         * @hide
         */
        /**
         * @event activate
         * @hide
         */
        /**
         * @event beforeclose
         * @hide
         */
        /**
         * @event bodyresize
         * @hide
         */
        /**
         * @event close
         * @hide
         */
        /**
         * @event deactivate
         * @hide
         */
    });
    Ext.reg('fieldset', Ext.form.FieldSet);