- footerCssClass: 'custom-footer', // additional css class, see {@link Ext.element#addClass addClass}
- footerStyle: 'background-color:red' // see {@link #bodyStyle}
-});
- * </code></pre>
- * <p>The example above also explicitly creates a <code>{@link #footer}</code> with custom markup and
- * styling applied.</p>
- */
- <div id="cfg-Ext.Panel-headerCfg"></div>/**
- * @cfg {Object} headerCfg
- * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
- * of this Panel's {@link #header} Element. See <code>{@link #bodyCfg}</code> also.</p>
- */
- <div id="cfg-Ext.Panel-bwrapCfg"></div>/**
- * @cfg {Object} bwrapCfg
- * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
- * of this Panel's {@link #bwrap} Element. See <code>{@link #bodyCfg}</code> also.</p>
- */
- <div id="cfg-Ext.Panel-tbarCfg"></div>/**
- * @cfg {Object} tbarCfg
- * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
- * of this Panel's {@link #tbar} Element. See <code>{@link #bodyCfg}</code> also.</p>
- */
- <div id="cfg-Ext.Panel-bbarCfg"></div>/**
- * @cfg {Object} bbarCfg
- * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
- * of this Panel's {@link #bbar} Element. See <code>{@link #bodyCfg}</code> also.</p>
- */
- <div id="cfg-Ext.Panel-footerCfg"></div>/**
- * @cfg {Object} footerCfg
- * <p>A {@link Ext.DomHelper DomHelper} element specification object specifying the element structure
- * of this Panel's {@link #footer} Element. See <code>{@link #bodyCfg}</code> also.</p>
- */
- <div id="cfg-Ext.Panel-closable"></div>/**
- * @cfg {Boolean} closable
- * Panels themselves do not directly support being closed, but some Panel subclasses do (like
- * {@link Ext.Window}) or a Panel Class within an {@link Ext.TabPanel}. Specify <code>true</code>
- * to enable closing in such situations. Defaults to <code>false</code>.
- */
- <div id="prop-Ext.Panel-footer"></div>/**
- * The Panel's footer {@link Ext.Element Element}. Read-only.
- * <p>This Element is used to house the Panel's <code>{@link #buttons}</code> or <code>{@link #fbar}</code>.</p>
- * <br><p><b>Note</b>: see the Note for <code>{@link Ext.Component#el el}</code> also.</p>
- * @type Ext.Element
- * @property footer
- */
- <div id="cfg-Ext.Panel-applyTo"></div>/**
- * @cfg {Mixed} applyTo
- * <p>The id of the node, a DOM node or an existing Element corresponding to a DIV that is already present in
- * the document that specifies some panel-specific structural markup. When <code>applyTo</code> is used,
- * constituent parts of the panel can be specified by CSS class name within the main element, and the panel
- * will automatically create those components from that markup. Any required components not specified in the
- * markup will be autogenerated if necessary.</p>
- * <p>The following class names are supported (baseCls will be replaced by {@link #baseCls}):</p>
- * <ul><li>baseCls + '-header'</li>
- * <li>baseCls + '-header-text'</li>
- * <li>baseCls + '-bwrap'</li>
- * <li>baseCls + '-tbar'</li>
- * <li>baseCls + '-body'</li>
- * <li>baseCls + '-bbar'</li>
- * <li>baseCls + '-footer'</li></ul>
- * <p>Using this config, a call to render() is not required. If applyTo is specified, any value passed for
- * {@link #renderTo} will be ignored and the target element's parent node will automatically be used as the
- * panel's container.</p>
- */
- <div id="cfg-Ext.Panel-tbar"></div>/**
- * @cfg {Object/Array} tbar
- * <p>The top toolbar of the panel. This can be a {@link Ext.Toolbar} object, a toolbar config, or an array of
- * buttons/button configs to be added to the toolbar. Note that this is not available as a property after render.
- * To access the top toolbar after render, use {@link #getTopToolbar}.</p>
- * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
- * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
- * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
- * submission parameters are collected from the DOM tree.</p>
- */
- <div id="cfg-Ext.Panel-bbar"></div>/**
- * @cfg {Object/Array} bbar
- * <p>The bottom toolbar of the panel. This can be a {@link Ext.Toolbar} object, a toolbar config, or an array of
- * buttons/button configs to be added to the toolbar. Note that this is not available as a property after render.
- * To access the bottom toolbar after render, use {@link #getBottomToolbar}.</p>
- * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
- * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
- * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
- * submission parameters are collected from the DOM tree.</p>
- */
- <div id="cfg-Ext.Panel-fbar"></div>/** @cfg {Object/Array} fbar
- * <p>A {@link Ext.Toolbar Toolbar} object, a Toolbar config, or an array of
- * {@link Ext.Button Button}s/{@link Ext.Button Button} configs, describing a {@link Ext.Toolbar Toolbar} to be rendered into this Panel's footer element.</p>
- * <p>After render, the <code>fbar</code> property will be an {@link Ext.Toolbar Toolbar} instance.</p>
- * <p>If <code>{@link #buttons}</code> are specified, they will supersede the <code>fbar</code> configuration property.</p>
- * The Panel's <code>{@link #buttonAlign}</code> configuration affects the layout of these items, for example:
- * <pre><code>
-var w = new Ext.Window({
- height: 250,
- width: 500,
- bbar: new Ext.Toolbar({
- items: [{
- text: 'bbar Left'
- },'->',{
- text: 'bbar Right'
- }]
- }),
- {@link #buttonAlign}: 'left', // anything but 'center' or 'right' and you can use '-', and '->'
- // to control the alignment of fbar items
- fbar: [{
- text: 'fbar Left'
- },'->',{
- text: 'fbar Right'
- }]
-}).show();
- * </code></pre>
- * <p><b>Note:</b> Although a Toolbar may contain Field components, these will <b>not</b> be updated by a load
- * of an ancestor FormPanel. A Panel's toolbars are not part of the standard Container->Component hierarchy, and
- * so are not scanned to collect form items. However, the values <b>will</b> be submitted because form
- * submission parameters are collected from the DOM tree.</p>
- */
- <div id="cfg-Ext.Panel-header"></div>/**
- * @cfg {Boolean} header
- * <code>true</code> to create the Panel's header element explicitly, <code>false</code> to skip creating
- * it. If a <code>{@link #title}</code> is set the header will be created automatically, otherwise it will not.
- * If a <code>{@link #title}</code> is set but <code>header</code> is explicitly set to <code>false</code>, the header
- * will not be rendered.
- */
- <div id="cfg-Ext.Panel-footer"></div>/**
- * @cfg {Boolean} footer
- * <code>true</code> to create the footer element explicitly, false to skip creating it. The footer
- * will be created automatically if <code>{@link #buttons}</code> or a <code>{@link #fbar}</code> have
- * been configured. See <code>{@link #bodyCfg}</code> for an example.
- */
- <div id="cfg-Ext.Panel-title"></div>/**
- * @cfg {String} title
- * The title text to be used as innerHTML (html tags are accepted) to display in the panel
- * <code>{@link #header}</code> (defaults to ''). When a <code>title</code> is specified the
- * <code>{@link #header}</code> element will automatically be created and displayed unless
- * {@link #header} is explicitly set to <code>false</code>. If you do not want to specify a
- * <code>title</code> at config time, but you may want one later, you must either specify a non-empty
- * <code>title</code> (a blank space ' ' will do) or <code>header:true</code> so that the container
- * element will get created.
- */
- <div id="cfg-Ext.Panel-buttons"></div>/**
- * @cfg {Array} buttons
- * <code>buttons</code> will be used as <code>{@link Ext.Container#items items}</code> for the toolbar in
- * the footer (<code>{@link #fbar}</code>). Typically the value of this configuration property will be
- * an array of {@link Ext.Button}s or {@link Ext.Button} configuration objects.
- * If an item is configured with <code>minWidth</code> or the Panel is configured with <code>minButtonWidth</code>,
- * that width will be applied to the item.
- */
- <div id="cfg-Ext.Panel-autoLoad"></div>/**
- * @cfg {Object/String/Function} autoLoad
- * A valid url spec according to the Updater {@link Ext.Updater#update} method.
- * If autoLoad is not null, the panel will attempt to load its contents
- * immediately upon render.<p>
- * The URL will become the default URL for this panel's {@link #body} element,
- * so it may be {@link Ext.Element#refresh refresh}ed at any time.</p>
- */
- <div id="cfg-Ext.Panel-frame"></div>/**
- * @cfg {Boolean} frame
- * <code>false</code> by default to render with plain 1px square borders. <code>true</code> to render with
- * 9 elements, complete with custom rounded corners (also see {@link Ext.Element#boxWrap}).
- * <p>The template generated for each condition is depicted below:</p><pre><code>
- *
-// frame = false
-<div id="developer-specified-id-goes-here" class="x-panel">
-
- <div class="x-panel-header"><span class="x-panel-header-text">Title: (frame:false)</span></div>
-
- <div class="x-panel-bwrap">
- <div class="x-panel-body"><p>html value goes here</p></div>
- </div>
-</div>