- <div class="body-wrap">
- <div class="top-tools">
- <a class="inner-link" href="#Ext.menu.ColorMenu-props"><img src="../resources/images/default/s.gif" class="item-icon icon-prop">Properties</a>
- <a class="inner-link" href="#Ext.menu.ColorMenu-methods"><img src="../resources/images/default/s.gif" class="item-icon icon-method">Methods</a>
- <a class="inner-link" href="#Ext.menu.ColorMenu-events"><img src="../resources/images/default/s.gif" class="item-icon icon-event">Events</a>
- <a class="inner-link" href="#Ext.menu.ColorMenu-configs"><img src="../resources/images/default/s.gif" class="item-icon icon-config">Config Options</a>
- <a class="bookmark" href="../docs/?class=Ext.menu.ColorMenu"><img src="../resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a>
- </div>
- <div class="inheritance res-block">
-<pre class="res-block-inner"><a ext:cls="Ext.util.Observable" ext:member="" href="output/Ext.util.Observable.html">Observable</a>
- <img src="resources/elbow-end.gif"/><a ext:cls="Ext.menu.Menu" ext:member="" href="output/Ext.menu.Menu.html">Menu</a>
- <img src="resources/elbow-end.gif"/>ColorMenu</pre></div>
- <h1>Class Ext.menu.ColorMenu</h1>
- <table cellspacing="0">
- <tr><td class="label">Package:</td><td class="hd-info">Ext.menu</td></tr>
- <tr><td class="label">Defined In:</td><td class="hd-info"><a href="../src/ColorMenu.js" target="_blank">ColorMenu.js</a></td></tr>
- <tr><td class="label">Class:</td><td class="hd-info">ColorMenu</td></tr>
- <tr><td class="label">Extends:</td><td class="hd-info"><a ext:cls="Ext.menu.Menu" ext:member="" href="output/Ext.menu.Menu.html">Menu</a></td></tr>
- </table>
- <div class="description">
- *
-A menu containing a <a ext:cls="Ext.menu.ColorItem" href="output/Ext.menu.ColorItem.html">Ext.menu.ColorItem</a> component (which provides a basic color picker). </div>
-
- <div class="hr"></div>
- <a id="Ext.menu.ColorMenu-configs"></a>
- <h2>Config Options</h2>
- <table cellspacing="0" class="member-table">
- <tr>
- <th class="sig-header" colspan="2">Config Options</th>
- <th class="msource-header">Defined By</th>
- </tr>
- <tr class="config-row inherited">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-allowOtherMenus"></a>\r
- <b>allowOtherMenus</b> : Boolean <div class="mdesc">\r
- True to allow multiple menus to be displayed at the same time (defaults to false) </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#allowOtherMenus" href="output/Ext.menu.Menu.html#allowOtherMenus">Menu</a></td>\r
- </tr>\r
- <tr class="config-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-defaultAlign"></a>\r
- <b>defaultAlign</b> : String <div class="mdesc">\r
- <div class="short">The default Ext.Element.alignTo anchor position value for this menu relative to its element of origin (defaults to "t...</div>\r
- <div class="long">\r
- The default <a ext:cls="Ext.Element" ext:member="alignTo" href="output/Ext.Element.html#alignTo">Ext.Element.alignTo</a> anchor position value for this menu relative to its element of origin (defaults to "tl-bl?") </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#defaultAlign" href="output/Ext.menu.Menu.html#defaultAlign">Menu</a></td>\r
- </tr>\r
- <tr class="config-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-defaults"></a>\r
- <b>defaults</b> : Object <div class="mdesc">\r
- <div class="short">A config object that will be applied to all items added to this container either via the items config or via the add ...</div>\r
- <div class="long">\r
- A config object that will be applied to all items added to this container either via the <a ext:cls="Ext.menu.Menu" ext:member="items" href="output/Ext.menu.Menu.html#items">items</a> config or via the <a ext:cls="Ext.menu.Menu" ext:member="add" href="output/Ext.menu.Menu.html#add">add</a> method. The defaults config can contain any number of name/value property pairs to be added to each item, and should be valid for the types of items being added to the menu. </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#defaults" href="output/Ext.menu.Menu.html#defaults">Menu</a></td>\r
- </tr>\r
- <tr class="config-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-ignoreParentClicks"></a>\r
- <b>ignoreParentClicks</b> : Boolean <div class="mdesc">\r
- <div class="short">True to ignore clicks on any item in this menu that is a parent item (displays a submenu) so that the submenu is not ...</div>\r
- <div class="long">\r
- True to ignore clicks on any item in this menu that is a parent item (displays a submenu) so that the submenu is not dismissed when clicking the parent item (defaults to false). </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#ignoreParentClicks" href="output/Ext.menu.Menu.html#ignoreParentClicks">Menu</a></td>\r
- </tr>\r
- <tr class="config-row inherited">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-items"></a>\r
- <b>items</b> : Mixed <div class="mdesc">\r
- An array of items to be added to this menu. See <a ext:cls="Ext.menu.Menu" ext:member="add" href="output/Ext.menu.Menu.html#add">add</a> for a list of valid item types. </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#items" href="output/Ext.menu.Menu.html#items">Menu</a></td>\r
- </tr>\r
- <tr class="config-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-listeners"></a>\r
- <b>listeners</b> : Object <div class="mdesc">\r
- <div class="short">(optional) A config object containing one or more event handlers to be added to this object during initialization. Th...</div>\r
- <div class="long">\r
- (optional) A config object containing one or more event handlers to be added to this object during initialization. This should be a valid listeners config object as specified in the <a ext:cls="Ext.util.Observable" ext:member="addListener" href="output/Ext.util.Observable.html#addListener">addListener</a> example for attaching multiple handlers at once. </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#listeners" href="output/Ext.util.Observable.html#listeners">Observable</a></td>\r
- </tr>\r
- <tr class="config-row inherited">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-minWidth"></a>\r
- <b>minWidth</b> : Number <div class="mdesc">\r
- The minimum width of the menu in pixels (defaults to 120) </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#minWidth" href="output/Ext.menu.Menu.html#minWidth">Menu</a></td>\r
- </tr>\r
- <tr class="config-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-shadow"></a>\r
- <b>shadow</b> : Boolean/String <div class="mdesc">\r
- <div class="short">True or "sides" for the default effect, "frame" for 4-way shadow, and "drop" for bottom-right shadow (defaults to "si...</div>\r
- <div class="long">\r
- True or "sides" for the default effect, "frame" for 4-way shadow, and "drop" for bottom-right shadow (defaults to "sides") </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#shadow" href="output/Ext.menu.Menu.html#shadow">Menu</a></td>\r
- </tr>\r
- <tr class="config-row inherited">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-subMenuAlign"></a>\r
- <b>subMenuAlign</b> : String <div class="mdesc">\r
- The <a ext:cls="Ext.Element" ext:member="alignTo" href="output/Ext.Element.html#alignTo">Ext.Element.alignTo</a> anchor position value to use for submenus of this menu (defaults to "tl-tr?") </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#subMenuAlign" href="output/Ext.menu.Menu.html#subMenuAlign">Menu</a></td>\r
- </tr>\r
- </table>
- <a id="Ext.menu.ColorMenu-props"></a>
- <h2>Public Properties</h2>
- <table cellspacing="0" class="member-table">
- <tr>
- <th class="sig-header" colspan="2">Property</th>
- <th class="msource-header">Defined By</th>
- </tr>
- <tr class="property-row inherited">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-items"></a>\r
- <b>items</b> : Ext.util.MixedCollection <div class="mdesc">\r
- A MixedCollection of this Menu's items </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#items" href="output/Ext.menu.Menu.html#items">Menu</a></td>\r
- </tr>\r
- <tr class="property-row alt">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-palette"></a>\r
- <b>palette</b> : ColorPalette <div class="mdesc">\r
- The <a ext:cls="Ext.ColorPalette" href="output/Ext.ColorPalette.html">Ext.ColorPalette</a> instance for this ColorMenu </div>\r
- </td>\r
- <td class="msource">ColorMenu</td>\r
- </tr>\r
- </table>
- <a id="Ext.menu.ColorMenu-methods"></a>
- <h2>Public Methods</h2>
- <table cellspacing="0" class="member-table">
- <tr>
- <th class="sig-header" colspan="2">Method</th>
- <th class="msource-header">Defined By</th>
- </tr>
- <tr class="method-row expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-ColorMenu"></a>\r
- <b>ColorMenu</b>( <code>Object config</code> ) <div class="mdesc">\r
- <div class="short">Creates a new ColorMenu</div>\r
- <div class="long">\r
- Creates a new ColorMenu <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>config</code> : Object<div class="sub-desc">Configuration options</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code></code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource">ColorMenu</td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-add"></a>\r
- <b>add</b>( <code>Mixed args</code> ) : Ext.menu.Item <div class="mdesc">\r
- <div class="short">Adds one or more items of any type supported by the Menu class, or that can be converted into menu items.
-Any of the ...</div>\r
- <div class="long">\r
- Adds one or more items of any type supported by the Menu class, or that can be converted into menu items.
-Any of the following are valid:
+<div xmlns:ext="http://www.extjs.com" class="body-wrap"><div class="inheritance res-block"><pre class="res-block-inner"><a href="output/Ext.util.Observable.html" ext:member="" ext:cls="Ext.util.Observable">Observable</a> <img src="resources/elbow-end.gif"><a href="output/Ext.Component.html" ext:member="" ext:cls="Ext.Component">Component</a> <img src="resources/elbow-end.gif"><a href="output/Ext.BoxComponent.html" ext:member="" ext:cls="Ext.BoxComponent">BoxComponent</a> <img src="resources/elbow-end.gif"><a href="output/Ext.Container.html" ext:member="" ext:cls="Ext.Container">Container</a> <img src="resources/elbow-end.gif"><a href="output/Ext.menu.Menu.html" ext:member="" ext:cls="Ext.menu.Menu">Menu</a> <img src="resources/elbow-end.gif">ColorMenu</pre></div><h1>Class <a href="source/ColorMenu.html#cls-Ext.menu.ColorMenu">Ext.menu.ColorMenu</a></h1><table cellspacing="0"><tr><td class="label">Package:</td><td class="hd-info">Ext.menu</td></tr><tr><td class="label">Defined In:</td><td class="hd-info">ColorMenu.js</td></tr><tr><td class="label">Class:</td><td class="hd-info"><a href="source/ColorMenu.html#cls-Ext.menu.ColorMenu">ColorMenu</a></td></tr><tr><td class="label">Extends:</td><td class="hd-info"><a href="output/Ext.menu.Menu.html" ext:cls="Ext.menu.Menu" ext:member="">Menu</a></td></tr></table><div class="description"><p>A menu containing a <a href="output/Ext.ColorPalette.html" ext:cls="Ext.ColorPalette">Ext.ColorPalette</a> Component.</p>\r
+<p>Notes:</p><div class="mdetail-params"><ul>\r
+<li>Although not listed here, the <b>constructor</b> for this class\r
+accepts all of the configuration options of <b><a href="output/Ext.ColorPalette.html" ext:cls="Ext.ColorPalette">Ext.ColorPalette</a></b>.</li>\r
+<li>If subclassing ColorMenu, any configuration options for the ColorPalette must be\r
+applied to the <tt><b>initialConfig</b></tt> property of the ColorMenu.\r
+Applying <a href="output/Ext.ColorPalette.html" ext:cls="Ext.ColorPalette">ColorPalette</a> configuration settings to\r
+<b><tt>this</tt></b> will <b>not</b> affect the ColorPalette's configuration.</li>\r
+</ul></div> *</div><div class="hr"></div><a id="Ext.menu.ColorMenu-configs"></a><h2>Config Options</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Config Options</th><th class="msource-header">Defined By</th></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-activeItem"></a><b><a href="source/Container.html#cfg-Ext.Container-activeItem">activeItem</a></b> : String/Number<div class="mdesc"><div class="short">A string component id or the numeric index of the component that should be initially activated within the\r
+container's...</div><div class="long">A string component id or the numeric index of the component that should be initially activated within the
+container's layout on render. For example, activeItem: 'item-1' or activeItem: 0 (index 0 = the first
+item in the container's collection). activeItem only applies to layout styles that can display
+items one at a time (like <a href="output/Ext.layout.AccordionLayout.html" ext:cls="Ext.layout.AccordionLayout">Ext.layout.AccordionLayout</a>, <a href="output/Ext.layout.CardLayout.html" ext:cls="Ext.layout.CardLayout">Ext.layout.CardLayout</a> and
+<a href="output/Ext.layout.FitLayout.html" ext:cls="Ext.layout.FitLayout">Ext.layout.FitLayout</a>). Related to <a href="output/Ext.layout.ContainerLayout.html#Ext.layout.ContainerLayout-activeItem" ext:member="activeItem" ext:cls="Ext.layout.ContainerLayout">Ext.layout.ContainerLayout.activeItem</a>.</div></div></td><td class="msource"><a href="output/Ext.Container.html#activeItem" ext:member="#activeItem" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-allowDomMove"></a><b><a href="source/Component.html#cfg-Ext.Component-allowDomMove">allowDomMove</a></b> : Boolean<div class="mdesc">Whether the component can move the Dom node when rendering (defaults to true).</div></td><td class="msource"><a href="output/Ext.Component.html#allowDomMove" ext:member="#allowDomMove" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-allowOtherMenus"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-allowOtherMenus">allowOtherMenus</a></b> : Boolean<div class="mdesc">True to allow multiple menus to be displayed at the same time (defaults to false)</div></td><td class="msource"><a href="output/Ext.menu.Menu.html#allowOtherMenus" ext:member="#allowOtherMenus" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-anchor"></a><b><a href="source/Component.html#cfg-Ext.Component-anchor">anchor</a></b> : String<div class="mdesc"><div class="short">Note: this config is only used when this Component is rendered\r
+by a Container which has been configured to use an Anc...</div><div class="long"><p><b>Note</b>: this config is only used when this Component is rendered
+by a Container which has been configured to use an <b><a href="output/Ext.layout.AnchorLayout.html" ext:cls="Ext.layout.AnchorLayout">AnchorLayout</a></b>
+based layout manager, for example:<div class="mdetail-params"><ul>
+<li><a href="output/Ext.form.FormPanel.html" ext:cls="Ext.form.FormPanel">Ext.form.FormPanel</a></li>
+<li>specifying <code>layout: <em>'anchor'</em> <i>// or <em>'form'</em>, or <em>'absolute'</em></i></code></li>
+</ul></div></p>
+<p>See <a href="output/Ext.layout.AnchorLayout.html" ext:cls="Ext.layout.AnchorLayout">Ext.layout.AnchorLayout</a>.<a href="output/Ext.layout.AnchorLayout.html#Ext.layout.AnchorLayout-anchor" ext:member="anchor" ext:cls="Ext.layout.AnchorLayout">anchor</a> also.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#anchor" ext:member="#anchor" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-applyTo"></a><b><a href="source/Component.html#cfg-Ext.Component-applyTo">applyTo</a></b> : Mixed<div class="mdesc"><div class="short">Specify the id of the element, a DOM element or an existing Element corresponding to a DIV\r
+that is already present in...</div><div class="long"><p>Specify the id of the element, a DOM element or an existing Element corresponding to a DIV
+that is already present in the document that specifies some structural markup for this
+component.</p><div><ul>
+<li><b>Description</b> : <ul>
+<div class="sub-desc">When <tt>applyTo</tt> is used, constituent parts of the component can also be specified
+by id or CSS class name within the main element, and the component being created may attempt
+to create its subcomponents from that markup if applicable.</div>
+</ul></li>
+<li><b>Notes</b> : <ul>
+<div class="sub-desc">When using this config, a call to render() is not required.</div>
+<div class="sub-desc">If applyTo is specified, any value passed for <a href="output/Ext.Component.html#Ext.Component-renderTo" ext:member="renderTo" ext:cls="Ext.Component">renderTo</a> will be ignored and the target
+element's parent node will automatically be used as the component's container.</div>
+</ul></li>
+</ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#applyTo" ext:member="#applyTo" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-autoDestroy"></a><b><a href="source/Container.html#cfg-Ext.Container-autoDestroy">autoDestroy</a></b> : Boolean<div class="mdesc"><div class="short">If true the container will automatically destroy any contained component that is removed from it, else\r
+destruction mu...</div><div class="long">If true the container will automatically destroy any contained component that is removed from it, else
+destruction must be handled manually (defaults to true).</div></div></td><td class="msource"><a href="output/Ext.Container.html#autoDestroy" ext:member="#autoDestroy" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-autoEl"></a><b><a href="source/Component.html#cfg-Ext.Component-autoEl">autoEl</a></b> : Mixed<div class="mdesc"><div class="short">A tag name or DomHelper spec used to create the Element which will\r
+encapsulate this Component.\r
+You do not normally ne...</div><div class="long"><p>A tag name or <a href="output/Ext.DomHelper.html" ext:cls="Ext.DomHelper">DomHelper</a> spec used to create the <a href="output/Ext.Component.html#Ext.Component-getEl" ext:member="getEl" ext:cls="Ext.Component">Element</a> which will
+encapsulate this Component.</p>
+<p>You do not normally need to specify this. For the base classes <a href="output/Ext.Component.html" ext:cls="Ext.Component">Ext.Component</a>, <a href="output/Ext.BoxComponent.html" ext:cls="Ext.BoxComponent">Ext.BoxComponent</a>,
+and <a href="output/Ext.Container.html" ext:cls="Ext.Container">Ext.Container</a>, this defaults to <b><tt>'div'</tt></b>. The more complex Ext classes use a more complex
+DOM structure created by their own onRender methods.</p>
+<p>This is intended to allow the developer to create application-specific utility Components encapsulated by
+different DOM elements. Example usage:</p><pre><code>{
+ xtype: <em>'box'</em>,
+ autoEl: {
+ tag: <em>'img'</em>,
+ src: <em>'http:<i>//www.example.com/example.jpg'</em></i>
+ }
+}, {
+ xtype: <em>'box'</em>,
+ autoEl: {
+ tag: <em>'blockquote'</em>,
+ html: <em>'autoEl is cool!'</em>
+ }
+}, {
+ xtype: <em>'container'</em>,
+ autoEl: <em>'ul'</em>,
+ cls: <em>'ux-unordered-list'</em>,
+ items: {
+ xtype: <em>'box'</em>,
+ autoEl: <em>'li'</em>,
+ html: <em>'First list item'</em>
+ }
+}</code></pre></div></div></td><td class="msource"><a href="output/Ext.Component.html#autoEl" ext:member="#autoEl" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-autoHeight"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-autoHeight">autoHeight</a></b> : Boolean<div class="mdesc"><div class="short">True to use height:'auto', false to use fixed height (or allow it to be managed by its parent\r
+Container's layout mana...</div><div class="long"><p>True to use height:'auto', false to use fixed height (or allow it to be managed by its parent
+Container's <a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout manager</a>. Defaults to false.</p>
+<p><b>Note</b>: Although many components inherit this config option, not all will
+function as expected with a height of 'auto'. Setting autoHeight:true means that the
+browser will manage height based on the element's contents, and that Ext will not manage it at all.</p>
+<p>If the <i>browser</i> is managing the height, be aware that resizes performed by the browser in response
+to changes within the structure of the Component cannot be detected. Therefore changes to the height might
+result in elements needing to be synchronized with the new height. Example:</p><pre><code><b>var</b> w = <b>new</b> Ext.Window({
+ title: <em>'Window'</em>,
+ width: 600,
+ autoHeight: true,
+ items: {
+ title: <em>'Collapse Me'</em>,
+ height: 400,
+ collapsible: true,
+ border: false,
+ listeners: {
+ beforecollapse: <b>function</b>() {
+ w.el.shadow.hide();
+ },
+ beforeexpand: <b>function</b>() {
+ w.el.shadow.hide();
+ },
+ collapse: <b>function</b>() {
+ w.syncShadow();
+ },
+ expand: <b>function</b>() {
+ w.syncShadow();
+ }
+ }
+ }
+}).show();</code></pre></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#autoHeight" ext:member="#autoHeight" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-autoScroll"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-autoScroll">autoScroll</a></b> : Boolean<div class="mdesc"><div class="short">true to use overflow:'auto' on the components layout element and show scroll bars automatically when\r
+necessary, false...</div><div class="long"><code>true</code> to use overflow:'auto' on the components layout element and show scroll bars automatically when
+necessary, <code>false</code> to clip any overflowing content (defaults to <code>false</code>).</div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#autoScroll" ext:member="#autoScroll" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-autoShow"></a><b><a href="source/Component.html#cfg-Ext.Component-autoShow">autoShow</a></b> : Boolean<div class="mdesc"><div class="short">True if the component should check for hidden classes (e.g. 'x-hidden' or 'x-hide-display') and remove\r
+them on render...</div><div class="long">True if the component should check for hidden classes (e.g. 'x-hidden' or 'x-hide-display') and remove
+them on render (defaults to false).</div></div></td><td class="msource"><a href="output/Ext.Component.html#autoShow" ext:member="#autoShow" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-autoWidth"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-autoWidth">autoWidth</a></b> : Boolean<div class="mdesc"><div class="short">True to use width:'auto', false to use fixed width (or allow it to be managed by its parent\r
+Container's layout manage...</div><div class="long"><p>True to use width:'auto', false to use fixed width (or allow it to be managed by its parent
+Container's <a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout manager</a>. Defaults to false.</p>
+<p><b>Note</b>: Although many components inherit this config option, not all will
+function as expected with a width of 'auto'. Setting autoWidth:true means that the
+browser will manage width based on the element's contents, and that Ext will not manage it at all.</p>
+<p>If the <i>browser</i> is managing the width, be aware that resizes performed by the browser in response
+to changes within the structure of the Component cannot be detected. Therefore changes to the width might
+result in elements needing to be synchronized with the new width. For example, where the target element is:</p><pre><code><div id=<em>'grid-container'</em> style=<em>'margin-left:25%;width:50%'</em>></div></code></pre>
+A Panel rendered into that target element must listen for browser window resize in order to relay its
+child items when the browser changes its width:<pre><code><b>var</b> myPanel = <b>new</b> Ext.Panel({
+ renderTo: <em>'grid-container'</em>,
+ monitorResize: true, <i>// relay on browser resize</i>
+ title: <em>'Panel'</em>,
+ height: 400,
+ autoWidth: true,
+ layout: <em>'hbox'</em>,
+ layoutConfig: {
+ align: <em>'stretch'</em>
+ },
+ defaults: {
+ flex: 1
+ },
+ items: [{
+ title: <em>'Box 1'</em>,
+ }, {
+ title: <em>'Box 2'</em>
+ }, {
+ title: <em>'Box 3'</em>
+ }],
+});</code></pre></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#autoWidth" ext:member="#autoWidth" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-boxMaxHeight"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-boxMaxHeight">boxMaxHeight</a></b> : Number<div class="mdesc"><div class="short">The maximum value in pixels which this BoxComponent will set its height to.\r
+Warning: This will override any size mana...</div><div class="long"><p>The maximum value in pixels which this BoxComponent will set its height to.</p>
+<p><b>Warning:</b> This will override any size management applied by layout managers.</p></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#boxMaxHeight" ext:member="#boxMaxHeight" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-boxMaxWidth"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-boxMaxWidth">boxMaxWidth</a></b> : Number<div class="mdesc"><div class="short">The maximum value in pixels which this BoxComponent will set its width to.\r
+Warning: This will override any size manag...</div><div class="long"><p>The maximum value in pixels which this BoxComponent will set its width to.</p>
+<p><b>Warning:</b> This will override any size management applied by layout managers.</p></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#boxMaxWidth" ext:member="#boxMaxWidth" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-boxMinHeight"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-boxMinHeight">boxMinHeight</a></b> : Number<div class="mdesc"><div class="short">The minimum value in pixels which this BoxComponent will set its height to.\r
+Warning: This will override any size mana...</div><div class="long"><p>The minimum value in pixels which this BoxComponent will set its height to.</p>
+<p><b>Warning:</b> This will override any size management applied by layout managers.</p></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#boxMinHeight" ext:member="#boxMinHeight" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-boxMinWidth"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-boxMinWidth">boxMinWidth</a></b> : Number<div class="mdesc"><div class="short">The minimum value in pixels which this BoxComponent will set its width to.\r
+Warning: This will override any size manag...</div><div class="long"><p>The minimum value in pixels which this BoxComponent will set its width to.</p>
+<p><b>Warning:</b> This will override any size management applied by layout managers.</p></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#boxMinWidth" ext:member="#boxMinWidth" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-bubbleEvents"></a><b><a href="source/Container.html#cfg-Ext.Container-bubbleEvents">bubbleEvents</a></b> : Array<div class="mdesc"><div class="short">An array of events that, when fired, should be bubbled to any parent container.\r
+See Ext.util.Observable.enableBubble....</div><div class="long"><p>An array of events that, when fired, should be bubbled to any parent container.
+See <a href="output/Ext.util.Observable.html#Ext.util.Observable-enableBubble" ext:member="enableBubble" ext:cls="Ext.util.Observable">Ext.util.Observable.enableBubble</a>.
+Defaults to <code>[<em>'add'</em>, <em>'remove'</em>]</code>.</div></div></td><td class="msource"><a href="output/Ext.Container.html#bubbleEvents" ext:member="#bubbleEvents" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-bufferResize"></a><b><a href="source/Container.html#cfg-Ext.Container-bufferResize">bufferResize</a></b> : Boolean/Number<div class="mdesc"><div class="short">When set to true (50 milliseconds) or a number of milliseconds, the layout assigned for this container will buffer\r
+th...</div><div class="long">When set to true (50 milliseconds) or a number of milliseconds, the layout assigned for this container will buffer
+the frequency it calculates and does a re-layout of components. This is useful for heavy containers or containers
+with a large quantity of sub-components for which frequent layout calls would be expensive. Defaults to <code>50</code>.</div></div></td><td class="msource"><a href="output/Ext.Container.html#bufferResize" ext:member="#bufferResize" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-clearCls"></a><b><a href="source/Component.html#cfg-Ext.Component-clearCls">clearCls</a></b> : String<div class="mdesc"><div class="short">The CSS class used to to apply to the special clearing div rendered\r
+directly after each form field wrapper to provide...</div><div class="long"><p>The CSS class used to to apply to the special clearing div rendered
+directly after each form field wrapper to provide field clearing (defaults to
+<tt>'x-form-clear-left'</tt>).</p>
+<br><p><b>Note</b>: this config is only used when this Component is rendered by a Container
+which has been configured to use the <b><a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">FormLayout</a></b> layout
+manager (e.g. <a href="output/Ext.form.FormPanel.html" ext:cls="Ext.form.FormPanel">Ext.form.FormPanel</a> or specifying <tt>layout:'form'</tt>) and either a
+<tt><a href="output/Ext.Component.html#Ext.Component-fieldLabel" ext:member="fieldLabel" ext:cls="Ext.Component">fieldLabel</a></tt> is specified or <tt>isFormField=true</tt> is specified.</p><br>
+<p>See <a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">Ext.layout.FormLayout</a>.<a href="output/Ext.layout.FormLayout.html#Ext.layout.FormLayout-fieldTpl" ext:member="fieldTpl" ext:cls="Ext.layout.FormLayout">fieldTpl</a> also.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#clearCls" ext:member="#clearCls" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-cls"></a><b><a href="source/Component.html#cfg-Ext.Component-cls">cls</a></b> : String<div class="mdesc"><div class="short">An optional extra CSS class that will be added to this component's Element (defaults to ''). This can be\r
+useful for ...</div><div class="long">An optional extra CSS class that will be added to this component's Element (defaults to ''). This can be
+useful for adding customized styles to the component or any of its children using standard CSS rules.</div></div></td><td class="msource"><a href="output/Ext.Component.html#cls" ext:member="#cls" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-contentEl"></a><b><a href="source/Component.html#cfg-Ext.Component-contentEl">contentEl</a></b> : String<div class="mdesc"><div class="short">Optional. Specify an existing HTML element, or the id of an existing HTML element to use as the content\r
+for this comp...</div><div class="long"><p>Optional. Specify an existing HTML element, or the <code>id</code> of an existing HTML element to use as the content
+for this component.</p>
<ul>
-<li>Any menu item object based on <a ext:cls="Ext.menu.BaseItem" href="output/Ext.menu.BaseItem.html">Ext.menu.BaseItem</a></li>
-<li>An HTMLElement object which will be converted to a menu item</li>
-<li>A menu item config object that will be created as a new menu item</li>
-<li>A string, which can either be '-' or 'separator' to add a menu separator, otherwise
-it will be converted into a <a ext:cls="Ext.menu.TextItem" href="output/Ext.menu.TextItem.html">Ext.menu.TextItem</a> and added</li>
-</ul>
-Usage:
-<pre><code><i>// Create the menu</i>
-<b>var</b> menu = <b>new</b> Ext.menu.Menu();
+<li><b>Description</b> :
+<div class="sub-desc">This config option is used to take an existing HTML element and place it in the layout element
+of a new component (it simply moves the specified DOM element <i>after the Component is rendered</i> to use as the content.</div></li>
+<li><b>Notes</b> :
+<div class="sub-desc">The specified HTML element is appended to the layout element of the component <i>after any configured
+<a href="output/Ext.Component.html#Ext.Component-html" ext:member="html" ext:cls="Ext.Component">HTML</a> has been inserted</i>, and so the document will not contain this element at the time the <a href="output/Ext.Component.html#Ext.Component-render" ext:member="render" ext:cls="Ext.Component">render</a> event is fired.</div>
+<div class="sub-desc">The specified HTML element used will not participate in any <code><b><a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a></b></code>
+scheme that the Component may use. It is just HTML. Layouts operate on child <code><b><a href="output/Ext.Container.html#Ext.Container-items" ext:member="items" ext:cls="Ext.Container">items</a></b></code>.</div>
+<div class="sub-desc">Add either the <code>x-hidden</code> or the <code>x-hide-display</code> CSS class to
+prevent a brief flicker of the content before it is rendered to the panel.</div></li>
+</ul></div></div></td><td class="msource"><a href="output/Ext.Component.html#contentEl" ext:member="#contentEl" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-ctCls"></a><b><a href="source/Component.html#cfg-Ext.Component-ctCls">ctCls</a></b> : String<div class="mdesc"><div class="short">An optional extra CSS class that will be added to this component's container. This can be useful for\r
+adding customize...</div><div class="long"><p>An optional extra CSS class that will be added to this component's container. This can be useful for
+adding customized styles to the container or any of its children using standard CSS rules. See
+<a href="output/Ext.layout.ContainerLayout.html" ext:cls="Ext.layout.ContainerLayout">Ext.layout.ContainerLayout</a>.<a href="output/Ext.layout.ContainerLayout.html#Ext.layout.ContainerLayout-extraCls" ext:member="extraCls" ext:cls="Ext.layout.ContainerLayout">extraCls</a> also.</p>
+<p><b>Note</b>: <tt>ctCls</tt> defaults to <tt>''</tt> except for the following class
+which assigns a value by default:
+<div class="mdetail-params"><ul>
+<li><a href="output/Ext.layout.Box.html" ext:cls="Ext.layout.Box">Box Layout</a> : <tt>'x-box-layout-ct'</tt></li>
+</ul></div>
+To configure the above Class with an extra CSS class append to the default. For example,
+for BoxLayout (Hbox and Vbox):<pre><code>ctCls: <em>'x-box-layout-ct custom-class'</em></code></pre>
+</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#ctCls" ext:member="#ctCls" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-data"></a><b><a href="source/Component.html#cfg-Ext.Component-data">data</a></b> : Mixed<div class="mdesc">The initial set of data to apply to the <code><a href="output/Ext.Component.html#Ext.Component-tpl" ext:member="tpl" ext:cls="Ext.Component">tpl</a></code> to
+update the content area of the Component.</div></td><td class="msource"><a href="output/Ext.Component.html#data" ext:member="#data" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-defaultAlign"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-defaultAlign">defaultAlign</a></b> : String<div class="mdesc"><div class="short">The default Ext.Element.alignTo anchor position value for this menu\r
+relative to its element of origin (defaults to 't...</div><div class="long">The default <a href="output/Ext.Element.html#Ext.Element-alignTo" ext:member="alignTo" ext:cls="Ext.Element">Ext.Element.alignTo</a> anchor position value for this menu
+relative to its element of origin (defaults to 'tl-bl?')</div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#defaultAlign" ext:member="#defaultAlign" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-defaultOffsets"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-defaultOffsets">defaultOffsets</a></b> : Array<div class="mdesc"><div class="short">An array specifying the [x, y] offset in pixels by which to\r
+change the default Menu popup position after aligning acc...</div><div class="long">An array specifying the [x, y] offset in pixels by which to
+change the default Menu popup position after aligning according to the <a href="output/Ext.menu.Menu.html#Ext.menu.Menu-defaultAlign" ext:member="defaultAlign" ext:cls="Ext.menu.Menu">defaultAlign</a>
+configuration. Defaults to <tt>[0, 0]</tt>.</div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#defaultOffsets" ext:member="#defaultOffsets" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-defaultType"></a><b><a href="source/Container.html#cfg-Ext.Container-defaultType">defaultType</a></b> : String<div class="mdesc"><div class="short">The default xtype of child Components to create in this Container when\r
+a child item is specified as a raw configurati...</div><div class="long"><p>The default <a href="output/Ext.Component.html" ext:cls="Ext.Component">xtype</a> of child Components to create in this Container when
+a child item is specified as a raw configuration object, rather than as an instantiated Component.</p>
+<p>Defaults to <code><em>'panel'</em></code>, except <a href="output/Ext.menu.Menu.html" ext:cls="Ext.menu.Menu">Ext.menu.Menu</a> which defaults to <code><em>'menuitem'</em></code>,
+and <a href="output/Ext.Toolbar.html" ext:cls="Ext.Toolbar">Ext.Toolbar</a> and <a href="output/Ext.ButtonGroup.html" ext:cls="Ext.ButtonGroup">Ext.ButtonGroup</a> which default to <code><em>'button'</em></code>.</p></div></div></td><td class="msource"><a href="output/Ext.Container.html#defaultType" ext:member="#defaultType" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-defaults"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-defaults">defaults</a></b> : Object<div class="mdesc"><div class="short">A config object that will be applied to all items added to this container either via the items\r
+config or via the add ...</div><div class="long">A config object that will be applied to all items added to this container either via the <a href="output/Ext.menu.Menu.html#Ext.menu.Menu-items" ext:member="items" ext:cls="Ext.menu.Menu">items</a>
+config or via the <a href="output/Ext.menu.Menu.html#Ext.menu.Menu-add" ext:member="add" ext:cls="Ext.menu.Menu">add</a> method. The defaults config can contain any number of
+name/value property pairs to be added to each item, and should be valid for the types of items
+being added to the menu.</div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#defaults" ext:member="#defaults" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-disabled"></a><b><a href="source/Component.html#cfg-Ext.Component-disabled">disabled</a></b> : Boolean<div class="mdesc">Render this component disabled (default is false).</div></td><td class="msource"><a href="output/Ext.Component.html#disabled" ext:member="#disabled" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-disabledClass"></a><b><a href="source/Component.html#cfg-Ext.Component-disabledClass">disabledClass</a></b> : String<div class="mdesc">CSS class added to the component when it is disabled (defaults to 'x-item-disabled').</div></td><td class="msource"><a href="output/Ext.Component.html#disabledClass" ext:member="#disabledClass" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-fieldLabel"></a><b><a href="source/Component.html#cfg-Ext.Component-fieldLabel">fieldLabel</a></b> : String<div class="mdesc"><div class="short">The label text to display next to this Component (defaults to '').\r
+Note: this config is only used when this Component...</div><div class="long"><p>The label text to display next to this Component (defaults to '').</p>
+<br><p><b>Note</b>: this config is only used when this Component is rendered by a Container which
+has been configured to use the <b><a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">FormLayout</a></b> layout manager (e.g.
+<a href="output/Ext.form.FormPanel.html" ext:cls="Ext.form.FormPanel">Ext.form.FormPanel</a> or specifying <tt>layout:'form'</tt>).</p><br>
+<p>Also see <tt><a href="output/Ext.Component.html#Ext.Component-hideLabel" ext:member="hideLabel" ext:cls="Ext.Component">hideLabel</a></tt> and
+<a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">Ext.layout.FormLayout</a>.<a href="output/Ext.layout.FormLayout.html#Ext.layout.FormLayout-fieldTpl" ext:member="fieldTpl" ext:cls="Ext.layout.FormLayout">fieldTpl</a>.</p>
+Example use:<pre><code><b>new</b> Ext.FormPanel({
+ height: 100,
+ renderTo: Ext.getBody(),
+ items: [{
+ xtype: <em>'textfield'</em>,
+ fieldLabel: <em>'Name'</em>
+ }]
+});</code></pre></div></div></td><td class="msource"><a href="output/Ext.Component.html#fieldLabel" ext:member="#fieldLabel" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-floating"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-floating">floating</a></b> : Boolean<div class="mdesc"><div class="short">By default, a Menu configured as floating:true\r
+will be rendered as an Ext.Layer (an absolutely positioned,\r
+floating C...</div><div class="long"><p>By default, a Menu configured as <b><code>floating:true</code></b>
+will be rendered as an <a href="output/Ext.Layer.html" ext:cls="Ext.Layer">Ext.Layer</a> (an absolutely positioned,
+floating Component with zindex=15000).
+If configured as <b><code>floating:false</code></b>, the Menu may be
+used as child item of another Container instead of a free-floating
+<a href="output/Ext.Layer.html" ext:cls="Ext.Layer">Layer</a>.</div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#floating" ext:member="#floating" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-forceLayout"></a><b><a href="source/Container.html#cfg-Ext.Container-forceLayout">forceLayout</a></b> : Boolean<div class="mdesc"><div class="short">If true the container will force a layout initially even if hidden or collapsed. This option\r
+is useful for forcing fo...</div><div class="long">If true the container will force a layout initially even if hidden or collapsed. This option
+is useful for forcing forms to render in collapsed or hidden containers. (defaults to false).</div></div></td><td class="msource"><a href="output/Ext.Container.html#forceLayout" ext:member="#forceLayout" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.ColorMenu-handler"></a><b><a href="source/ColorMenu.html#cfg-Ext.menu.ColorMenu-handler">handler</a></b> : Function<div class="mdesc"><div class="short">Optional. A function that will handle the select event of this menu. \r
+The handler is passed the following parameters:...</div><div class="long">Optional. A function that will handle the select event of this menu.\r
+The handler is passed the following parameters:<div class="mdetail-params"><ul>\r
+<li><code>palette</code> : ColorPalette<div class="sub-desc">The <a href="output/Ext.menu.ColorMenu.html#Ext.menu.ColorMenu-palette" ext:member="palette" ext:cls="Ext.menu.ColorMenu">Ext.ColorPalette</a>.</div></li>\r
+<li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol).</div></li>\r
+</ul></div></div></div></td><td class="msource">ColorMenu</td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-height"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-height">height</a></b> : Number<div class="mdesc"><div class="short">The height of this component in pixels (defaults to auto).\r
+Note to express this dimension as a percentage or offset s...</div><div class="long">The height of this component in pixels (defaults to auto).
+<b>Note</b> to express this dimension as a percentage or offset see <a href="output/Ext.Component.html#Ext.Component-anchor" ext:member="anchor" ext:cls="Ext.Component">Ext.Component.anchor</a>.</div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#height" ext:member="#height" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-hidden"></a><b><a href="source/Component.html#cfg-Ext.Component-hidden">hidden</a></b> : Boolean<div class="mdesc">Render this component hidden (default is false). If <tt>true</tt>, the
+<a href="output/Ext.Component.html#Ext.Component-hide" ext:member="hide" ext:cls="Ext.Component">hide</a> method will be called internally.</div></td><td class="msource"><a href="output/Ext.Component.html#hidden" ext:member="#hidden" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-hideBorders"></a><b><a href="source/Container.html#cfg-Ext.Container-hideBorders">hideBorders</a></b> : Boolean<div class="mdesc"><div class="short">True to hide the borders of each contained component, false to defer to the component's existing\r
+border settings (def...</div><div class="long">True to hide the borders of each contained component, false to defer to the component's existing
+border settings (defaults to false).</div></div></td><td class="msource"><a href="output/Ext.Container.html#hideBorders" ext:member="#hideBorders" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-hideLabel"></a><b><a href="source/Component.html#cfg-Ext.Component-hideLabel">hideLabel</a></b> : Boolean<div class="mdesc"><div class="short">true to completely hide the label element\r
+(label and separator). Defaults to false.\r
+By default, even if you do not sp...</div><div class="long"><p><tt>true</tt> to completely hide the label element
+(<a href="output/Ext.Component.html#Ext.Component-fieldLabel" ext:member="fieldLabel" ext:cls="Ext.Component">label</a> and <a href="output/Ext.Component.html#Ext.Component-labelSeparator" ext:member="labelSeparator" ext:cls="Ext.Component">separator</a>). Defaults to <tt>false</tt>.
+By default, even if you do not specify a <tt><a href="output/Ext.Component.html#Ext.Component-fieldLabel" ext:member="fieldLabel" ext:cls="Ext.Component">fieldLabel</a></tt> the space will still be
+reserved so that the field will line up with other fields that do have labels.
+Setting this to <tt>true</tt> will cause the field to not reserve that space.</p>
+<br><p><b>Note</b>: see the note for <tt><a href="output/Ext.Component.html#Ext.Component-clearCls" ext:member="clearCls" ext:cls="Ext.Component">clearCls</a></tt>.</p><br>
+Example use:<pre><code><b>new</b> Ext.FormPanel({
+ height: 100,
+ renderTo: Ext.getBody(),
+ items: [{
+ xtype: <em>'textfield'</em>
+ hideLabel: true
+ }]
+});</code></pre></div></div></td><td class="msource"><a href="output/Ext.Component.html#hideLabel" ext:member="#hideLabel" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-hideMode"></a><b><a href="source/Component.html#cfg-Ext.Component-hideMode">hideMode</a></b> : String<div class="mdesc"><div class="short">How this component should be hidden. Supported values are 'visibility'\r
+(css visibility), 'offsets' (negative offset p...</div><div class="long"><p>How this component should be hidden. Supported values are <tt>'visibility'</tt>
+(css visibility), <tt>'offsets'</tt> (negative offset position) and <tt>'display'</tt>
+(css display).</p>
+<br><p><b>Note</b>: the default of <tt>'display'</tt> is generally preferred
+since items are automatically laid out when they are first shown (no sizing
+is done while hidden).</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#hideMode" ext:member="#hideMode" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.ColorMenu-hideOnClick"></a><b><a href="source/ColorMenu.html#cfg-Ext.menu.ColorMenu-hideOnClick">hideOnClick</a></b> : Boolean<div class="mdesc">False to continue showing the menu after a color is selected, defaults to true.</div></td><td class="msource">ColorMenu</td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-hideParent"></a><b><a href="source/Component.html#cfg-Ext.Component-hideParent">hideParent</a></b> : Boolean<div class="mdesc"><div class="short">True to hide and show the component's container when hide/show is called on the component, false to hide\r
+and show the...</div><div class="long">True to hide and show the component's container when hide/show is called on the component, false to hide
+and show the component itself (defaults to false). For example, this can be used as a shortcut for a hide
+button on a window by setting hide:true on the button when adding it to its parent container.</div></div></td><td class="msource"><a href="output/Ext.Component.html#hideParent" ext:member="#hideParent" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-html"></a><b><a href="source/Component.html#cfg-Ext.Component-html">html</a></b> : String/Object<div class="mdesc"><div class="short">An HTML fragment, or a DomHelper specification to use as the layout element\r
+content (defaults to ''). The HTML conten...</div><div class="long">An HTML fragment, or a <a href="output/Ext.DomHelper.html" ext:cls="Ext.DomHelper">DomHelper</a> specification to use as the layout element
+content (defaults to ''). The HTML content is added after the component is rendered,
+so the document will not contain this HTML at the time the <a href="output/Ext.Component.html#Ext.Component-render" ext:member="render" ext:cls="Ext.Component">render</a> event is fired.
+This content is inserted into the body <i>before</i> any configured <a href="output/Ext.Component.html#Ext.Component-contentEl" ext:member="contentEl" ext:cls="Ext.Component">contentEl</a> is appended.</div></div></td><td class="msource"><a href="output/Ext.Component.html#html" ext:member="#html" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-id"></a><b><a href="source/Component.html#cfg-Ext.Component-id">id</a></b> : String<div class="mdesc"><div class="short">The unique id of this component (defaults to an auto-assigned id).\r
+You should assign an id if you need to be able to ...</div><div class="long"><p>The <b>unique</b> id of this component (defaults to an <a href="output/Ext.Component.html#Ext.Component-getId" ext:member="getId" ext:cls="Ext.Component">auto-assigned id</a>).
+You should assign an id if you need to be able to access the component later and you do
+not have an object reference available (e.g., using <a href="output/Ext.html" ext:cls="Ext">Ext</a>.<a href="output/Ext.html#Ext-getCmp" ext:member="getCmp" ext:cls="Ext">getCmp</a>).</p>
+<p>Note that this id will also be used as the element id for the containing HTML element
+that is rendered to the page for this component. This allows you to write id-based CSS
+rules to style the specific instance of this component uniquely, and also to select
+sub-elements using this component's id as the parent.</p>
+<p><b>Note</b>: to avoid complications imposed by a unique <tt>id</tt> also see
+<code><a href="output/Ext.Component.html#Ext.Component-itemId" ext:member="itemId" ext:cls="Ext.Component">itemId</a></code> and <code><a href="output/Ext.Component.html#Ext.Component-ref" ext:member="ref" ext:cls="Ext.Component">ref</a></code>.</p>
+<p><b>Note</b>: to access the container of an item see <code><a href="output/Ext.Component.html#Ext.Component-ownerCt" ext:member="ownerCt" ext:cls="Ext.Component">ownerCt</a></code>.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#id" ext:member="#id" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-ignoreParentClicks"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-ignoreParentClicks">ignoreParentClicks</a></b> : Boolean<div class="mdesc"><div class="short">True to ignore clicks on any item in this menu that is a parent item (displays\r
+a submenu) so that the submenu is not ...</div><div class="long">True to ignore clicks on any item in this menu that is a parent item (displays
+a submenu) so that the submenu is not dismissed when clicking the parent item (defaults to false).</div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#ignoreParentClicks" ext:member="#ignoreParentClicks" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-itemCls"></a><b><a href="source/Component.html#cfg-Ext.Component-itemCls">itemCls</a></b> : String<div class="mdesc"><div class="short">Note: this config is only used when this Component is rendered by a Container which\r
+has been configured to use the Fo...</div><div class="long"><p><b>Note</b>: this config is only used when this Component is rendered by a Container which
+has been configured to use the <b><a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">FormLayout</a></b> layout manager (e.g.
+<a href="output/Ext.form.FormPanel.html" ext:cls="Ext.form.FormPanel">Ext.form.FormPanel</a> or specifying <tt>layout:'form'</tt>).</p><br>
+<p>An additional CSS class to apply to the div wrapping the form item
+element of this field. If supplied, <tt>itemCls</tt> at the <b>field</b> level will override
+the default <tt>itemCls</tt> supplied at the <b>container</b> level. The value specified for
+<tt>itemCls</tt> will be added to the default class (<tt>'x-form-item'</tt>).</p>
+<p>Since it is applied to the item wrapper (see
+<a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">Ext.layout.FormLayout</a>.<a href="output/Ext.layout.FormLayout.html#Ext.layout.FormLayout-fieldTpl" ext:member="fieldTpl" ext:cls="Ext.layout.FormLayout">fieldTpl</a>), it allows
+you to write standard CSS rules that can apply to the field, the label (if specified), or
+any other element within the markup for the field.</p>
+<br><p><b>Note</b>: see the note for <tt><a href="output/Ext.Component.html#Ext.Component-fieldLabel" ext:member="fieldLabel" ext:cls="Ext.Component">fieldLabel</a></tt>.</p><br>
+Example use:<pre><code><i>// Apply a style to the field's <b>label</b>:</i>
+<style>
+ .required .x-form-item-<b>label</b> {font-weight:bold;color:red;}
+</style>
-<i>// Create a menu item to add by reference</i>
-<b>var</b> menuItem = <b>new</b> Ext.menu.Item({ text: <em>'New Item!'</em> });
+<b>new</b> Ext.FormPanel({
+ height: 100,
+ renderTo: Ext.getBody(),
+ items: [{
+ xtype: <em>'textfield'</em>,
+ fieldLabel: <em>'Name'</em>,
+ itemCls: <em>'required'</em> <i>//this <b>label</b> will be styled</i>
+ },{
+ xtype: <em>'textfield'</em>,
+ fieldLabel: <em>'Favorite Color'</em>
+ }]
+});</code></pre></div></div></td><td class="msource"><a href="output/Ext.Component.html#itemCls" ext:member="#itemCls" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-itemId"></a><b><a href="source/Component.html#cfg-Ext.Component-itemId">itemId</a></b> : String<div class="mdesc"><div class="short">An itemId can be used as an alternative way to get a reference to a component\r
+when no object reference is available. ...</div><div class="long"><p>An <tt>itemId</tt> can be used as an alternative way to get a reference to a component
+when no object reference is available. Instead of using an <code><a href="output/Ext.Component.html#Ext.Component-id" ext:member="id" ext:cls="Ext.Component">id</a></code> with
+<a href="output/Ext.html" ext:cls="Ext">Ext</a>.<a href="output/Ext.html#Ext-getCmp" ext:member="getCmp" ext:cls="Ext">getCmp</a>, use <code>itemId</code> with
+<a href="output/Ext.Container.html" ext:cls="Ext.Container">Ext.Container</a>.<a href="output/Ext.Container.html#Ext.Container-getComponent" ext:member="getComponent" ext:cls="Ext.Container">getComponent</a> which will retrieve
+<code>itemId</code>'s or <tt><a href="output/Ext.Component.html#Ext.Component-id" ext:member="id" ext:cls="Ext.Component">id</a></tt>'s. Since <code>itemId</code>'s are an index to the
+container's internal MixedCollection, the <code>itemId</code> is scoped locally to the container --
+avoiding potential conflicts with <a href="output/Ext.ComponentMgr.html" ext:cls="Ext.ComponentMgr">Ext.ComponentMgr</a> which requires a <b>unique</b>
+<code><a href="output/Ext.Component.html#Ext.Component-id" ext:member="id" ext:cls="Ext.Component">id</a></code>.</p>
+<pre><code><b>var</b> c = <b>new</b> Ext.Panel({ <i>//</i>
+ <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-height" ext:member="height" ext:cls="Ext.BoxComponent">height</a>: 300,
+ <a href="output/Ext.Component.html#Ext.Component-renderTo" ext:member="renderTo" ext:cls="Ext.Component">renderTo</a>: document.body,
+ <a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a>: <em>'auto'</em>,
+ <a href="output/Ext.Container.html#Ext.Container-items" ext:member="items" ext:cls="Ext.Container">items</a>: [
+ {
+ itemId: <em>'p1'</em>,
+ <a href="output/Ext.Panel.html#Ext.Panel-title" ext:member="title" ext:cls="Ext.Panel">title</a>: <em>'Panel 1'</em>,
+ <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-height" ext:member="height" ext:cls="Ext.BoxComponent">height</a>: 150
+ },
+ {
+ itemId: <em>'p2'</em>,
+ <a href="output/Ext.Panel.html#Ext.Panel-title" ext:member="title" ext:cls="Ext.Panel">title</a>: <em>'Panel 2'</em>,
+ <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-height" ext:member="height" ext:cls="Ext.BoxComponent">height</a>: 150
+ }
+ ]
+})
+p1 = c.<a href="output/Ext.Container.html#Ext.Container-getComponent" ext:member="getComponent" ext:cls="Ext.Container">getComponent</a>(<em>'p1'</em>); <i>// not the same as <a href="output/Ext.html#Ext-getCmp" ext:member="getCmp" ext:cls="Ext">Ext.getCmp()</a></i>
+p2 = p1.<a href="output/Ext.Component.html#Ext.Component-ownerCt" ext:member="ownerCt" ext:cls="Ext.Component">ownerCt</a>.<a href="output/Ext.Container.html#Ext.Container-getComponent" ext:member="getComponent" ext:cls="Ext.Container">getComponent</a>(<em>'p2'</em>); <i>// reference via a sibling</i></code></pre>
+<p>Also see <tt><a href="output/Ext.Component.html#Ext.Component-id" ext:member="id" ext:cls="Ext.Component">id</a></tt> and <code><a href="output/Ext.Component.html#Ext.Component-ref" ext:member="ref" ext:cls="Ext.Component">ref</a></code>.</p>
+<p><b>Note</b>: to access the container of an item see <tt><a href="output/Ext.Component.html#Ext.Component-ownerCt" ext:member="ownerCt" ext:cls="Ext.Component">ownerCt</a></tt>.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#itemId" ext:member="#itemId" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-items"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-items">items</a></b> : Mixed<div class="mdesc">An array of items to be added to this menu. Menus may contain either <a href="output/Ext.menu.Item.html" ext:cls="Ext.menu.Item">menu items</a>,
+or general <a href="output/Ext.Component.html" ext:cls="Ext.Component">Component</a>s.</div></td><td class="msource"><a href="output/Ext.menu.Menu.html#items" ext:member="#items" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-labelSeparator"></a><b><a href="source/Component.html#cfg-Ext.Component-labelSeparator">labelSeparator</a></b> : String<div class="mdesc"><div class="short">The separator to display after the text of each\r
+fieldLabel. This property may be configured at various levels.\r
+The o...</div><div class="long"><p>The separator to display after the text of each
+<tt><a href="output/Ext.Component.html#Ext.Component-fieldLabel" ext:member="fieldLabel" ext:cls="Ext.Component">fieldLabel</a></tt>. This property may be configured at various levels.
+The order of precedence is:
+<div class="mdetail-params"><ul>
+<li>field / component level</li>
+<li>container level</li>
+<li><a href="output/Ext.layout.FormLayout.html#Ext.layout.FormLayout-labelSeparator" ext:member="labelSeparator" ext:cls="Ext.layout.FormLayout">layout level</a> (defaults to colon <tt>':'</tt>)</li>
+</ul></div>
+To display no separator for this field's label specify empty string ''.</p>
+<br><p><b>Note</b>: see the note for <tt><a href="output/Ext.Component.html#Ext.Component-clearCls" ext:member="clearCls" ext:cls="Ext.Component">clearCls</a></tt>.</p><br>
+<p>Also see <tt><a href="output/Ext.Component.html#Ext.Component-hideLabel" ext:member="hideLabel" ext:cls="Ext.Component">hideLabel</a></tt> and
+<a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">Ext.layout.FormLayout</a>.<a href="output/Ext.layout.FormLayout.html#Ext.layout.FormLayout-fieldTpl" ext:member="fieldTpl" ext:cls="Ext.layout.FormLayout">fieldTpl</a>.</p>
+Example use:<pre><code><b>new</b> Ext.FormPanel({
+ height: 100,
+ renderTo: Ext.getBody(),
+ layoutConfig: {
+ labelSeparator: <em>'~'</em> <i>// layout config has lowest priority (defaults to <em>':'</em>)</i>
+ },
+ <a href="output/Ext.layout.FormLayout.html#Ext.layout.FormLayout-labelSeparator" ext:member="labelSeparator" ext:cls="Ext.layout.FormLayout">labelSeparator</a>: <em>'>>'</em>, <i>// config at container level</i>
+ items: [{
+ xtype: <em>'textfield'</em>,
+ fieldLabel: <em>'Field 1'</em>,
+ labelSeparator: <em>'...'</em> <i>// field/component level config supersedes others</i>
+ },{
+ xtype: <em>'textfield'</em>,
+ fieldLabel: <em>'Field 2'</em> <i>// labelSeparator will be <em>'='</em></i>
+ }]
+});</code></pre></div></div></td><td class="msource"><a href="output/Ext.Component.html#labelSeparator" ext:member="#labelSeparator" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-labelStyle"></a><b><a href="source/Component.html#cfg-Ext.Component-labelStyle">labelStyle</a></b> : String<div class="mdesc"><div class="short">A CSS style specification string to apply directly to this field's\r
+label. Defaults to the container's labelStyle val...</div><div class="long"><p>A CSS style specification string to apply directly to this field's
+label. Defaults to the container's labelStyle value if set (e.g.,
+<tt><a href="output/Ext.layout.FormLayout.html#Ext.layout.FormLayout-labelStyle" ext:member="labelStyle" ext:cls="Ext.layout.FormLayout">Ext.layout.FormLayout.labelStyle</a></tt> , or '').</p>
+<br><p><b>Note</b>: see the note for <code><a href="output/Ext.Component.html#Ext.Component-clearCls" ext:member="clearCls" ext:cls="Ext.Component">clearCls</a></code>.</p><br>
+<p>Also see <code><a href="output/Ext.Component.html#Ext.Component-hideLabel" ext:member="hideLabel" ext:cls="Ext.Component">hideLabel</a></code> and
+<code><a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">Ext.layout.FormLayout</a>.<a href="output/Ext.layout.FormLayout.html#Ext.layout.FormLayout-fieldTpl" ext:member="fieldTpl" ext:cls="Ext.layout.FormLayout">fieldTpl</a>.</code></p>
+Example use:<pre><code><b>new</b> Ext.FormPanel({
+ height: 100,
+ renderTo: Ext.getBody(),
+ items: [{
+ xtype: <em>'textfield'</em>,
+ fieldLabel: <em>'Name'</em>,
+ labelStyle: <em>'font-weight:bold;'</em>
+ }]
+});</code></pre></div></div></td><td class="msource"><a href="output/Ext.Component.html#labelStyle" ext:member="#labelStyle" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-layout"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-layout">layout</a></b> : String/Object<div class="mdesc"><div class="short">This class assigns a default layout (layout:'menu').\r
+Developers may override this configuration option if another lay...</div><div class="long">This class assigns a default layout (<code>layout:<em>'<b>menu</b>'</em></code>).
+Developers <i>may</i> override this configuration option if another layout is required.
+See <a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">Ext.Container.layout</a> for additional information.</div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#layout" ext:member="#layout" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-layoutConfig"></a><b><a href="source/Container.html#cfg-Ext.Container-layoutConfig">layoutConfig</a></b> : Object<div class="mdesc">This is a config object containing properties specific to the chosen
+<b><code><a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a></code></b> if <b><code><a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a></code></b>
+has been specified as a <i>string</i>.</p></div></td><td class="msource"><a href="output/Ext.Container.html#layoutConfig" ext:member="#layoutConfig" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-listeners"></a><b><a href="source/Observable.html#cfg-Ext.util.Observable-listeners">listeners</a></b> : Object<div class="mdesc"><div class="short">A config object containing one or more event handlers to be added to this\r
+object during initialization. This should ...</div><div class="long"><p>A config object containing one or more event handlers to be added to this
+object during initialization. This should be a valid listeners config object as specified in the
+<a href="output/Ext.util.Observable.html#Ext.util.Observable-addListener" ext:member="addListener" ext:cls="Ext.util.Observable">addListener</a> example for attaching multiple handlers at once.</p>
+<br><p><b><u>DOM events from ExtJs <a href="output/Ext.Component.html" ext:cls="Ext.Component">Components</a></u></b></p>
+<br><p>While <i>some</i> ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this
+is usually only done when extra value can be added. For example the <a href="output/Ext.DataView.html" ext:cls="Ext.DataView">DataView</a>'s
+<b><code><a href="output/Ext.DataView.html#Ext.DataView-click" ext:member="click" ext:cls="Ext.DataView">click</a></code></b> event passing the node clicked on. To access DOM
+events directly from a Component's HTMLElement, listeners must be added to the <i><a href="output/Ext.Component.html#Ext.Component-getEl" ext:member="getEl" ext:cls="Ext.Component">Element</a></i> after the Component
+has been rendered. A plugin can simplify this step:<pre><code><i>// Plugin is configured <b>with</b> a listeners config object.</i>
+<i>// The Component is appended to the argument list of all handler functions.</i>
+Ext.DomObserver = Ext.extend(Object, {
+ constructor: <b>function</b>(config) {
+ this.listeners = config.listeners ? config.listeners : config;
+ },
+
+ <i>// Component passes itself into plugin's init method</i>
+ init: <b>function</b>(c) {
+ <b>var</b> p, l = this.listeners;
+ <b>for</b> (p <b>in</b> l) {
+ <b>if</b> (Ext.isFunction(l[p])) {
+ l[p] = this.createHandler(l[p], c);
+ } <b>else</b> {
+ l[p].fn = this.createHandler(l[p].fn, c);
+ }
+ }
-<i>// Add a bunch of items at once using different methods.</i>
-<i>// Only the last item added will be returned.</i>
-<b>var</b> item = menu.add(
- menuItem, <i>// add existing item by ref</i>
- <em>'Dynamic Item'</em>, <i>// <b>new</b> TextItem</i>
- <em>'-'</em>, <i>// <b>new</b> separator</i>
- { text: <em>'Config Item'</em> } <i>// <b>new</b> item by config</i>
-);</code></pre> <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>args</code> : Mixed<div class="sub-desc">One or more menu items, menu item configs or other objects that can be converted to menu items</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added, or the last one if multiple items were added</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#add" href="output/Ext.menu.Menu.html#add">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-addElement"></a>\r
- <b>addElement</b>( <code>Mixed el</code> ) : Ext.menu.Item <div class="mdesc">\r
- <div class="short">Adds an <a ext:cls="Ext.Element" href="output/Ext.Element.html">Ext.Element</a> object to the menu</div>\r
- <div class="long">\r
- Adds an <a ext:cls="Ext.Element" href="output/Ext.Element.html">Ext.Element</a> object to the menu <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>el</code> : Mixed<div class="sub-desc">The element or DOM node to add, or its id</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#addElement" href="output/Ext.menu.Menu.html#addElement">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-addEvents"></a>\r
- <b>addEvents</b>( <code>Object object</code> ) : void <div class="mdesc">\r
- <div class="short">Used to define events on this Observable</div>\r
- <div class="long">\r
- Used to define events on this Observable <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>object</code> : Object<div class="sub-desc">The object with the events defined</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#addEvents" href="output/Ext.util.Observable.html#addEvents">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-addItem"></a>\r
- <b>addItem</b>( <code>Ext.menu.Item item</code> ) : Ext.menu.Item <div class="mdesc">\r
- <div class="short">Adds an existing object based on <a ext:cls="Ext.menu.BaseItem" href="output/Ext.menu.BaseItem.html">Ext.menu.BaseItem</a> to the menu</div>\r
- <div class="long">\r
- Adds an existing object based on <a ext:cls="Ext.menu.BaseItem" href="output/Ext.menu.BaseItem.html">Ext.menu.BaseItem</a> to the menu <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>item</code> : Ext.menu.Item<div class="sub-desc">The menu item to add</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#addItem" href="output/Ext.menu.Menu.html#addItem">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-addListener"></a>\r
- <b>addListener</b>( <code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span>, <span class="optional" title="Optional">[<code>Object options</code>]</span> ) : void <div class="mdesc">\r
- <div class="short">Appends an event handler to this component</div>\r
- <div class="long">\r
- Appends an event handler to this component <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The method the event invokes</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope in which to execute the handler
-function. The handler function's "this" context.</div></li><li><code>options</code> : Object<div class="sub-desc">(optional) An object containing handler configuration
+ <i>// Add the listeners to the Element immediately following the render call</i>
+ c.render = c.render.<a href="output/Function.html#Function-createSequence" ext:member="createSequence" ext:cls="Function">createSequence</a>(<b>function</b>() {
+ <b>var</b> e = c.getEl();
+ <b>if</b> (e) {
+ e.on(l);
+ }
+ });
+ },
+
+ createHandler: <b>function</b>(fn, c) {
+ <b>return</b> <b>function</b>(e) {
+ fn.call(this, e, c);
+ };
+ }
+});
+
+<b>var</b> combo = <b>new</b> Ext.form.ComboBox({
+
+ <i>// Collapse combo when its element is clicked on</i>
+ plugins: [ <b>new</b> Ext.DomObserver({
+ click: <b>function</b>(evt, comp) {
+ comp.collapse();
+ }
+ })],
+ store: myStore,
+ typeAhead: true,
+ mode: <em>'local'</em>,
+ triggerAction: <em>'all'</em>
+});</code></pre></p></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#listeners" ext:member="#listeners" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-margins"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-margins">margins</a></b> : Object<div class="mdesc"><div class="short">Note: this config is only used when this BoxComponent is rendered\r
+by a Container which has been configured to use the...</div><div class="long"><p><b>Note</b>: this config is only used when this BoxComponent is rendered
+by a Container which has been configured to use the <b><a href="output/Ext.layout.BorderLayout.html" ext:cls="Ext.layout.BorderLayout">BorderLayout</a></b>
+or one of the two <b><a href="output/Ext.layout.BoxLayout.html" ext:cls="Ext.layout.BoxLayout">BoxLayout</a> subclasses.</b></p>
+<p>An object containing margins to apply to this BoxComponent in the
+format:</p><pre><code>{
+ top: (top margin),
+ right: (right margin),
+ bottom: (bottom margin),
+ left: (left margin)
+}</code></pre>
+<p>May also be a string containing space-separated, numeric margin values. The order of the
+sides associated with each value matches the way CSS processes margin values:</p>
+<p><div class="mdetail-params"><ul>
+<li>If there is only one value, it applies to all sides.</li>
+<li>If there are two values, the top and bottom borders are set to the first value and the
+right and left are set to the second.</li>
+<li>If there are three values, the top is set to the first value, the left and right are set
+to the second, and the bottom is set to the third.</li>
+<li>If there are four values, they apply to the top, right, bottom, and left, respectively.</li>
+</ul></div></p>
+<p>Defaults to:</p><pre><code>{top:0, right:0, bottom:0, left:0}</code></pre></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#margins" ext:member="#margins" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-minWidth"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-minWidth">minWidth</a></b> : Number<div class="mdesc">The minimum width of the menu in pixels (defaults to 120)</div></td><td class="msource"><a href="output/Ext.menu.Menu.html#minWidth" ext:member="#minWidth" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-monitorResize"></a><b><a href="source/Container.html#cfg-Ext.Container-monitorResize">monitorResize</a></b> : Boolean<div class="mdesc"><div class="short">True to automatically monitor window resize events to handle anything that is sensitive to the current size\r
+of the vi...</div><div class="long">True to automatically monitor window resize events to handle anything that is sensitive to the current size
+of the viewport. This value is typically managed by the chosen <code><a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a></code> and should not need
+to be set manually.</div></div></td><td class="msource"><a href="output/Ext.Container.html#monitorResize" ext:member="#monitorResize" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-overCls"></a><b><a href="source/Component.html#cfg-Ext.Component-overCls">overCls</a></b> : String<div class="mdesc"><div class="short">An optional extra CSS class that will be added to this component's Element when the mouse moves\r
+over the Element, and...</div><div class="long">An optional extra CSS class that will be added to this component's Element when the mouse moves
+over the Element, and removed when the mouse moves out. (defaults to ''). This can be
+useful for adding customized 'active' or 'hover' styles to the component or any of its children using standard CSS rules.</div></div></td><td class="msource"><a href="output/Ext.Component.html#overCls" ext:member="#overCls" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-pageX"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-pageX">pageX</a></b> : Number<div class="mdesc">The page level x coordinate for this component if contained within a positioning container.</div></td><td class="msource"><a href="output/Ext.BoxComponent.html#pageX" ext:member="#pageX" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-pageY"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-pageY">pageY</a></b> : Number<div class="mdesc">The page level y coordinate for this component if contained within a positioning container.</div></td><td class="msource"><a href="output/Ext.BoxComponent.html#pageY" ext:member="#pageY" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.ColorMenu-paletteId"></a><b><a href="source/ColorMenu.html#cfg-Ext.menu.ColorMenu-paletteId">paletteId</a></b> : String<div class="mdesc">An id to assign to the underlying color palette. Defaults to <tt>null</tt>.</div></td><td class="msource">ColorMenu</td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-plain"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-plain">plain</a></b> : Boolean<div class="mdesc">True to remove the incised line down the left side of the menu. Defaults to <tt>false</tt>.</div></td><td class="msource"><a href="output/Ext.menu.Menu.html#plain" ext:member="#plain" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-plugins"></a><b><a href="source/Component.html#cfg-Ext.Component-plugins">plugins</a></b> : Object/Array<div class="mdesc"><div class="short">An object or array of objects that will provide custom functionality for this component. The only\r
+requirement for a ...</div><div class="long">An object or array of objects that will provide custom functionality for this component. The only
+requirement for a valid plugin is that it contain an init method that accepts a reference of type Ext.Component.
+When a component is created, if any plugins are available, the component will call the init method on each
+plugin, passing a reference to itself. Each plugin can then call methods or respond to events on the
+component as needed to provide its functionality.</div></div></td><td class="msource"><a href="output/Ext.Component.html#plugins" ext:member="#plugins" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-ptype"></a><b><a href="source/Component.html#cfg-Ext.Component-ptype">ptype</a></b> : String<div class="mdesc"><div class="short">The registered ptype to create. This config option is not used when passing\r
+a config object into a constructor. This ...</div><div class="long">The registered <tt>ptype</tt> to create. This config option is not used when passing
+a config object into a constructor. This config option is used only when
+lazy instantiation is being used, and a Plugin is being
+specified not as a fully instantiated Component, but as a <i>Component config
+object</i>. The <tt>ptype</tt> will be looked up at render time up to determine what
+type of Plugin to create.<br><br>
+If you create your own Plugins, you may register them using
+<a href="output/Ext.ComponentMgr.html#Ext.ComponentMgr-registerPlugin" ext:member="registerPlugin" ext:cls="Ext.ComponentMgr">Ext.ComponentMgr.registerPlugin</a> in order to be able to
+take advantage of lazy instantiation and rendering.</div></div></td><td class="msource"><a href="output/Ext.Component.html#ptype" ext:member="#ptype" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-ref"></a><b><a href="source/Component.html#cfg-Ext.Component-ref">ref</a></b> : String<div class="mdesc"><div class="short">A path specification, relative to the Component's ownerCt\r
+specifying into which ancestor Container to place a named r...</div><div class="long"><p>A path specification, relative to the Component's <code><a href="output/Ext.Component.html#Ext.Component-ownerCt" ext:member="ownerCt" ext:cls="Ext.Component">ownerCt</a></code>
+specifying into which ancestor Container to place a named reference to this Component.</p>
+<p>The ancestor axis can be traversed by using '/' characters in the path.
+For example, to put a reference to a Toolbar Button into <i>the Panel which owns the Toolbar</i>:</p><pre><code><b>var</b> myGrid = <b>new</b> Ext.grid.EditorGridPanel({
+ title: <em>'My EditorGridPanel'</em>,
+ store: myStore,
+ colModel: myColModel,
+ tbar: [{
+ text: <em>'Save'</em>,
+ handler: saveChanges,
+ disabled: true,
+ ref: <em>'../saveButton'</em>
+ }],
+ listeners: {
+ afteredit: <b>function</b>() {
+<i>// The button reference is <b>in</b> the GridPanel</i>
+ myGrid.saveButton.enable();
+ }
+ }
+});</code></pre>
+<p>In the code above, if the <code>ref</code> had been <code><em>'saveButton'</em></code>
+the reference would have been placed into the Toolbar. Each '/' in the <code>ref</code>
+moves up one level from the Component's <code><a href="output/Ext.Component.html#Ext.Component-ownerCt" ext:member="ownerCt" ext:cls="Ext.Component">ownerCt</a></code>.</p>
+<p>Also see the <code><a href="output/Ext.Component.html#Ext.Component-added" ext:member="added" ext:cls="Ext.Component">added</a></code> and <code><a href="output/Ext.Component.html#Ext.Component-removed" ext:member="removed" ext:cls="Ext.Component">removed</a></code> events.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#ref" ext:member="#ref" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-region"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-region">region</a></b> : String<div class="mdesc"><div class="short">Note: this config is only used when this BoxComponent is rendered\r
+by a Container which has been configured to use the...</div><div class="long"><p><b>Note</b>: this config is only used when this BoxComponent is rendered
+by a Container which has been configured to use the <b><a href="output/Ext.layout.BorderLayout.html" ext:cls="Ext.layout.BorderLayout">BorderLayout</a></b>
+layout manager (e.g. specifying <tt>layout:'border'</tt>).</p><br>
+<p>See <a href="output/Ext.layout.BorderLayout.html" ext:cls="Ext.layout.BorderLayout">Ext.layout.BorderLayout</a> also.</p></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#region" ext:member="#region" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-renderTo"></a><b><a href="source/Component.html#cfg-Ext.Component-renderTo">renderTo</a></b> : Mixed<div class="mdesc"><div class="short">Specify the id of the element, a DOM element or an existing Element that this component\r
+will be rendered into.\r
+Notes ...</div><div class="long"><p>Specify the id of the element, a DOM element or an existing Element that this component
+will be rendered into.</p><div><ul>
+<li><b>Notes</b> : <ul>
+<div class="sub-desc">Do <u>not</u> use this option if the Component is to be a child item of
+a <a href="output/Ext.Container.html" ext:cls="Ext.Container">Container</a>. It is the responsibility of the
+<a href="output/Ext.Container.html" ext:cls="Ext.Container">Container</a>'s <a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout manager</a>
+to render and manage its child items.</div>
+<div class="sub-desc">When using this config, a call to render() is not required.</div>
+</ul></li>
+</ul></div>
+<p>See <tt><a href="output/Ext.Component.html#Ext.Component-render" ext:member="render" ext:cls="Ext.Component">render</a></tt> also.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#renderTo" ext:member="#renderTo" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-resizeEvent"></a><b><a href="source/Container.html#cfg-Ext.Container-resizeEvent">resizeEvent</a></b> : String<div class="mdesc">The event to listen to for resizing in layouts. Defaults to <code><em>'resize'</em></code>.</div></td><td class="msource"><a href="output/Ext.Container.html#resizeEvent" ext:member="#resizeEvent" ext:cls="Ext.Container">Container</a></td></tr><tr class="config-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.ColorMenu-scope"></a><b><a href="source/ColorMenu.html#cfg-Ext.menu.ColorMenu-scope">scope</a></b> : Object<div class="mdesc">The scope (<tt><b>this</b></tt> reference) in which the <code><a href="output/Ext.menu.ColorMenu.html#Ext.menu.ColorMenu-handler" ext:member="handler" ext:cls="Ext.menu.ColorMenu">handler</a></code>\r
+function will be called. Defaults to this ColorMenu instance.</div></td><td class="msource">ColorMenu</td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-shadow"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-shadow">shadow</a></b> : Boolean/String<div class="mdesc"><div class="short">True or 'sides' for the default effect, 'frame' for 4-way shadow, and 'drop'\r
+for bottom-right shadow (defaults to 'si...</div><div class="long">True or 'sides' for the default effect, 'frame' for 4-way shadow, and 'drop'
+for bottom-right shadow (defaults to 'sides')</div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#shadow" ext:member="#shadow" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-showSeparator"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-showSeparator">showSeparator</a></b> : Boolean<div class="mdesc">True to show the icon separator. (defaults to true).</div></td><td class="msource"><a href="output/Ext.menu.Menu.html#showSeparator" ext:member="#showSeparator" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-stateEvents"></a><b><a href="source/Component.html#cfg-Ext.Component-stateEvents">stateEvents</a></b> : Array<div class="mdesc"><div class="short">An array of events that, when fired, should trigger this component to\r
+save its state (defaults to none). stateEvents ...</div><div class="long"><p>An array of events that, when fired, should trigger this component to
+save its state (defaults to none). <code>stateEvents</code> may be any type
+of event supported by this component, including browser or custom events
+(e.g., <tt>['click', 'customerchange']</tt>).</p>
+<p>See <code><a href="output/Ext.Component.html#Ext.Component-stateful" ext:member="stateful" ext:cls="Ext.Component">stateful</a></code> for an explanation of saving and
+restoring Component state.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#stateEvents" ext:member="#stateEvents" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-stateId"></a><b><a href="source/Component.html#cfg-Ext.Component-stateId">stateId</a></b> : String<div class="mdesc"><div class="short">The unique id for this component to use for state management purposes\r
+(defaults to the component id if one was set, o...</div><div class="long">The unique id for this component to use for state management purposes
+(defaults to the component id if one was set, otherwise null if the
+component is using a generated id).
+<p>See <code><a href="output/Ext.Component.html#Ext.Component-stateful" ext:member="stateful" ext:cls="Ext.Component">stateful</a></code> for an explanation of saving and
+restoring Component state.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#stateId" ext:member="#stateId" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-stateful"></a><b><a href="source/Component.html#cfg-Ext.Component-stateful">stateful</a></b> : Boolean<div class="mdesc"><div class="short">A flag which causes the Component to attempt to restore the state of\r
+internal properties from a saved state on startu...</div><div class="long"><p>A flag which causes the Component to attempt to restore the state of
+internal properties from a saved state on startup. The component must have
+either a <code><a href="output/Ext.Component.html#Ext.Component-stateId" ext:member="stateId" ext:cls="Ext.Component">stateId</a></code> or <code><a href="output/Ext.Component.html#Ext.Component-id" ext:member="id" ext:cls="Ext.Component">id</a></code> assigned
+for state to be managed. Auto-generated ids are not guaranteed to be stable
+across page loads and cannot be relied upon to save and restore the same
+state for a component.<p>
+<p>For state saving to work, the state manager's provider must have been
+set to an implementation of <a href="output/Ext.state.Provider.html" ext:cls="Ext.state.Provider">Ext.state.Provider</a> which overrides the
+<a href="output/Ext.state.Provider.html#Ext.state.Provider-set" ext:member="set" ext:cls="Ext.state.Provider">set</a> and <a href="output/Ext.state.Provider.html#Ext.state.Provider-get" ext:member="get" ext:cls="Ext.state.Provider">get</a>
+methods to save and recall name/value pairs. A built-in implementation,
+<a href="output/Ext.state.CookieProvider.html" ext:cls="Ext.state.CookieProvider">Ext.state.CookieProvider</a> is available.</p>
+<p>To set the state provider for the current page:</p>
+<pre><code>Ext.state.Manager.setProvider(<b>new</b> Ext.state.CookieProvider({
+ expires: <b>new</b> Date(<b>new</b> Date().getTime()+(1000*60*60*24*7)), <i>//7 days from now</i>
+}));</code></pre>
+<p>A stateful Component attempts to save state when one of the events
+listed in the <code><a href="output/Ext.Component.html#Ext.Component-stateEvents" ext:member="stateEvents" ext:cls="Ext.Component">stateEvents</a></code> configuration fires.</p>
+<p>To save state, a stateful Component first serializes its state by
+calling <b><code>getState</code></b>. By default, this function does
+nothing. The developer must provide an implementation which returns an
+object hash which represents the Component's restorable state.</p>
+<p>The value yielded by getState is passed to <a href="output/Ext.state.Manager.html#Ext.state.Manager-set" ext:member="set" ext:cls="Ext.state.Manager">Ext.state.Manager.set</a>
+which uses the configured <a href="output/Ext.state.Provider.html" ext:cls="Ext.state.Provider">Ext.state.Provider</a> to save the object
+keyed by the Component's <code><a href="output/stateId.html" ext:cls="stateId">stateId</a></code>, or, if that is not
+specified, its <code><a href="output/Ext.Component.html#Ext.Component-id" ext:member="id" ext:cls="Ext.Component">id</a></code>.</p>
+<p>During construction, a stateful Component attempts to <i>restore</i>
+its state by calling <a href="output/Ext.state.Manager.html#Ext.state.Manager-get" ext:member="get" ext:cls="Ext.state.Manager">Ext.state.Manager.get</a> passing the
+<code><a href="output/Ext.Component.html#Ext.Component-stateId" ext:member="stateId" ext:cls="Ext.Component">stateId</a></code>, or, if that is not specified, the
+<code><a href="output/Ext.Component.html#Ext.Component-id" ext:member="id" ext:cls="Ext.Component">id</a></code>.</p>
+<p>The resulting object is passed to <b><code>applyState</code></b>.
+The default implementation of <code>applyState</code> simply copies
+properties into the object, but a developer may override this to support
+more behaviour.</p>
+<p>You can perform extra processing on state save and restore by attaching
+handlers to the <a href="output/Ext.Component.html#Ext.Component-beforestaterestore" ext:member="beforestaterestore" ext:cls="Ext.Component">beforestaterestore</a>, <a href="output/Ext.Component.html#Ext.Component-staterestore" ext:member="staterestore" ext:cls="Ext.Component">staterestore</a>,
+<a href="output/Ext.Component.html#Ext.Component-beforestatesave" ext:member="beforestatesave" ext:cls="Ext.Component">beforestatesave</a> and <a href="output/Ext.Component.html#Ext.Component-statesave" ext:member="statesave" ext:cls="Ext.Component">statesave</a> events.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#stateful" ext:member="#stateful" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-style"></a><b><a href="source/Component.html#cfg-Ext.Component-style">style</a></b> : String<div class="mdesc"><div class="short">A custom style specification to be applied to this component's Element. Should be a valid argument to\r
+Ext.Element.ap...</div><div class="long">A custom style specification to be applied to this component's Element. Should be a valid argument to
+<a href="output/Ext.Element.html#Ext.Element-applyStyles" ext:member="applyStyles" ext:cls="Ext.Element">Ext.Element.applyStyles</a>.
+<pre><code><b>new</b> Ext.Panel({
+ title: <em>'Some Title'</em>,
+ renderTo: Ext.getBody(),
+ width: 400, height: 300,
+ layout: <em>'form'</em>,
+ items: [{
+ xtype: <em>'textarea'</em>,
+ style: {
+ width: <em>'95%'</em>,
+ marginBottom: <em>'10px'</em>
+ }
+ },
+ <b>new</b> Ext.Button({
+ text: <em>'Send'</em>,
+ minWidth: <em>'100'</em>,
+ style: {
+ marginBottom: <em>'10px'</em>
+ }
+ })
+ ]
+});</code></pre></div></div></td><td class="msource"><a href="output/Ext.Component.html#style" ext:member="#style" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-subMenuAlign"></a><b><a href="source/Menu.html#cfg-Ext.menu.Menu-subMenuAlign">subMenuAlign</a></b> : String<div class="mdesc">The <a href="output/Ext.Element.html#Ext.Element-alignTo" ext:member="alignTo" ext:cls="Ext.Element">Ext.Element.alignTo</a> anchor position value to use for submenus of
+this menu (defaults to 'tl-tr?')</div></td><td class="msource"><a href="output/Ext.menu.Menu.html#subMenuAlign" ext:member="#subMenuAlign" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-tabTip"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-tabTip">tabTip</a></b> : String<div class="mdesc"><div class="short">Note: this config is only used when this BoxComponent is a child item of a TabPanel.\r
+A string to be used as innerHTML...</div><div class="long"><p><b>Note</b>: this config is only used when this BoxComponent is a child item of a TabPanel.</p>
+A string to be used as innerHTML (html tags are accepted) to show in a tooltip when mousing over
+the associated tab selector element. <a href="output/Ext.QuickTips.html" ext:cls="Ext.QuickTips">Ext.QuickTips</a>.init()
+must be called in order for the tips to render.</div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#tabTip" ext:member="#tabTip" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-tpl"></a><b><a href="source/Component.html#cfg-Ext.Component-tpl">tpl</a></b> : Mixed<div class="mdesc"><div class="short">An Ext.Template, Ext.XTemplate\r
+or an array of strings to form an Ext.XTemplate.\r
+Used in conjunction with the data and...</div><div class="long">An <bold><a href="output/Ext.Template.html" ext:cls="Ext.Template">Ext.Template</a></bold>, <bold><a href="output/Ext.XTemplate.html" ext:cls="Ext.XTemplate">Ext.XTemplate</a></bold>
+or an array of strings to form an Ext.XTemplate.
+Used in conjunction with the <code><a href="output/Ext.Component.html#Ext.Component-data" ext:member="data" ext:cls="Ext.Component">data</a></code> and
+<code><a href="output/Ext.Component.html#Ext.Component-tplWriteMode" ext:member="tplWriteMode" ext:cls="Ext.Component">tplWriteMode</a></code> configurations.</div></div></td><td class="msource"><a href="output/Ext.Component.html#tpl" ext:member="#tpl" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-tplWriteMode"></a><b><a href="source/Component.html#cfg-Ext.Component-tplWriteMode">tplWriteMode</a></b> : String<div class="mdesc"><div class="short">The Ext.(X)Template method to use when\r
+updating the content area of the Component. Defaults to 'overwrite'\r
+(see Ext.X...</div><div class="long">The Ext.(X)Template method to use when
+updating the content area of the Component. Defaults to <tt>'overwrite'</tt>
+(see <code><a href="output/Ext.XTemplate.html#Ext.XTemplate-overwrite" ext:member="overwrite" ext:cls="Ext.XTemplate">Ext.XTemplate.overwrite</a></code>).</div></div></td><td class="msource"><a href="output/Ext.Component.html#tplWriteMode" ext:member="#tplWriteMode" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-width"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-width">width</a></b> : Number<div class="mdesc"><div class="short">The width of this component in pixels (defaults to auto).\r
+Note to express this dimension as a percentage or offset se...</div><div class="long">The width of this component in pixels (defaults to auto).
+<b>Note</b> to express this dimension as a percentage or offset see <a href="output/Ext.Component.html#Ext.Component-anchor" ext:member="anchor" ext:cls="Ext.Component">Ext.Component.anchor</a>.</div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#width" ext:member="#width" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-x"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-x">x</a></b> : Number<div class="mdesc">The local x (left) coordinate for this component if contained within a positioning container.</div></td><td class="msource"><a href="output/Ext.BoxComponent.html#x" ext:member="#x" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-xtype"></a><b><a href="source/Component.html#cfg-Ext.Component-xtype">xtype</a></b> : String<div class="mdesc"><div class="short">The registered xtype to create. This config option is not used when passing\r
+a config object into a constructor. This ...</div><div class="long">The registered <tt>xtype</tt> to create. This config option is not used when passing
+a config object into a constructor. This config option is used only when
+lazy instantiation is being used, and a child item of a Container is being
+specified not as a fully instantiated Component, but as a <i>Component config
+object</i>. The <tt>xtype</tt> will be looked up at render time up to determine what
+type of child Component to create.<br><br>
+The predefined xtypes are listed <a href="output/Ext.Component.html" ext:cls="Ext.Component">here</a>.
+<br><br>
+If you subclass Components to create your own Components, you may register
+them using <a href="output/Ext.ComponentMgr.html#Ext.ComponentMgr-registerType" ext:member="registerType" ext:cls="Ext.ComponentMgr">Ext.ComponentMgr.registerType</a> in order to be able to
+take advantage of lazy instantiation and rendering.</div></div></td><td class="msource"><a href="output/Ext.Component.html#xtype" ext:member="#xtype" ext:cls="Ext.Component">Component</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-y"></a><b><a href="source/BoxComponent.html#cfg-Ext.BoxComponent-y">y</a></b> : Number<div class="mdesc">The local y (top) coordinate for this component if contained within a positioning container.</div></td><td class="msource"><a href="output/Ext.BoxComponent.html#y" ext:member="#y" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr></tbody></table><a id="Ext.menu.ColorMenu-props"></a><h2>Public Properties</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Property</th><th class="msource-header">Defined By</th></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-disabled"></a><b><a href="source/Component.html#prop-Ext.Component-disabled">disabled</a></b> : Boolean<div class="mdesc">True if this component is disabled. Read-only.</div></td><td class="msource"><a href="output/Ext.Component.html#disabled" ext:member="#disabled" ext:cls="Ext.Component">Component</a></td></tr><tr class="property-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-el"></a><b><a href="source/Component.html#prop-Ext.Component-el">el</a></b> : Ext.Element<div class="mdesc"><div class="short">The Ext.Element which encapsulates this Component. Read-only.\r
+This will usually be a &lt;DIV> element created by the ...</div><div class="long"><p>The <a href="output/Ext.Element.html" ext:cls="Ext.Element">Ext.Element</a> which encapsulates this Component. Read-only.</p>
+<p>This will <i>usually</i> be a <DIV> element created by the class's onRender method, but
+that may be overridden using the <code><a href="output/Ext.Component.html#Ext.Component-autoEl" ext:member="autoEl" ext:cls="Ext.Component">autoEl</a></code> config.</p>
+<br><p><b>Note</b>: this element will not be available until this Component has been rendered.</p><br>
+<p>To add listeners for <b>DOM events</b> to this Component (as opposed to listeners
+for this Component's own Observable events), see the <a href="output/Ext.util.Observable.html#Ext.util.Observable-listeners" ext:member="listeners" ext:cls="Ext.util.Observable">listeners</a>
+config for a suggestion, or use a render listener directly:</p><pre><code><b>new</b> Ext.Panel({
+ title: <em>'The Clickable Panel'</em>,
+ listeners: {
+ render: <b>function</b>(p) {
+ <i>// Append the Panel to the click handler's argument list.</i>
+ p.getEl().on(<em>'click'</em>, handlePanelClick.createDelegate(null, [p], true));
+ },
+ single: true <i>// Remove the listener after first invocation</i>
+ }
+});</code></pre>
+<p>See also <tt><a href="output/Ext.Component.html#Ext.Component-getEl" ext:member="getEl" ext:cls="Ext.Component">getEl</a></p></div></div></td><td class="msource"><a href="output/Ext.Component.html#el" ext:member="#el" ext:cls="Ext.Component">Component</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-hidden"></a><b><a href="source/Component.html#prop-Ext.Component-hidden">hidden</a></b> : Boolean<div class="mdesc">True if this component is hidden. Read-only.</div></td><td class="msource"><a href="output/Ext.Component.html#hidden" ext:member="#hidden" ext:cls="Ext.Component">Component</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-initialConfig"></a><b><a href="source/Component.html#prop-Ext.Component-initialConfig">initialConfig</a></b> : Object<div class="mdesc">This Component's initial configuration specification. Read-only.</div></td><td class="msource"><a href="output/Ext.Component.html#initialConfig" ext:member="#initialConfig" ext:cls="Ext.Component">Component</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-items"></a><b><a href="source/Container.html#prop-Ext.Container-items">items</a></b> : MixedCollection<div class="mdesc">The collection of components in this container as a <a href="output/Ext.util.MixedCollection.html" ext:cls="Ext.util.MixedCollection">Ext.util.MixedCollection</a></div></td><td class="msource"><a href="output/Ext.Container.html#items" ext:member="#items" ext:cls="Ext.Container">Container</a></td></tr><tr class="property-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-ownerCt"></a><b><a href="source/Component.html#prop-Ext.Component-ownerCt">ownerCt</a></b> : Ext.Container<div class="mdesc"><div class="short">This Component's owner Container (defaults to undefined, and is set automatically when\r
+this Component is added to a C...</div><div class="long">This Component's owner <a href="output/Ext.Container.html" ext:cls="Ext.Container">Container</a> (defaults to undefined, and is set automatically when
+this Component is added to a Container). Read-only.
+<p><b>Note</b>: to access items within the Container see <tt><a href="output/Ext.Component.html#Ext.Component-itemId" ext:member="itemId" ext:cls="Ext.Component">itemId</a></tt>.</p></div></div></td><td class="msource"><a href="output/Ext.Component.html#ownerCt" ext:member="#ownerCt" ext:cls="Ext.Component">Component</a></td></tr><tr class="property-row "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.ColorMenu-palette"></a><b><a href="source/ColorMenu.html#prop-Ext.menu.ColorMenu-palette">palette</a></b> : ColorPalette \r
+The {@link Ext.ColorPalette} instance for this ColorMenu<div class="mdesc"></div></td><td class="msource">ColorMenu</td></tr><tr class="property-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-refOwner"></a><b><a href="source/Component.html#prop-Ext.Component-refOwner">refOwner</a></b> : Ext.Container<div class="mdesc"><div class="short">The ancestor Container into which the ref reference was inserted if this Component\r
+is a child of a Container, and has...</div><div class="long">The ancestor Container into which the <a href="output/Ext.Component.html#Ext.Component-ref" ext:member="ref" ext:cls="Ext.Component">ref</a> reference was inserted if this Component
+is a child of a Container, and has been configured with a <code>ref</code>.</div></div></td><td class="msource"><a href="output/Ext.Component.html#refOwner" ext:member="#refOwner" ext:cls="Ext.Component">Component</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-rendered"></a><b><a href="source/Component.html#prop-Ext.Component-rendered">rendered</a></b> : Boolean<div class="mdesc">True if this component has been rendered. Read-only.</div></td><td class="msource"><a href="output/Ext.Component.html#rendered" ext:member="#rendered" ext:cls="Ext.Component">Component</a></td></tr></tbody></table><a id="Ext.menu.ColorMenu-methods"></a><h2>Public Methods</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Method</th><th class="msource-header">Defined By</th></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-add"></a><b><a href="source/Container.html#method-Ext.Container-add">add</a></b>( <code>Object/Array component</code>, <code>Object (Optional)</code>, <code>Object (Optional)</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Adds Component(s) to this Container.\r
+Description :\r
+<ul class="mdetail-params">\r
+Fires the beforeadd event before addin...</div><div class="long"><p>Adds <a href="output/Ext.Component.html" ext:cls="Ext.Component">Component</a>(s) to this Container.</p>
+<br><p><b>Description</b></u> :
+<div><ul class="mdetail-params">
+<li>Fires the <a href="output/Ext.Container.html#Ext.Container-beforeadd" ext:member="beforeadd" ext:cls="Ext.Container">beforeadd</a> event before adding</li>
+<li>The Container's <a href="output/Ext.Container.html#Ext.Container-defaults" ext:member="defaults" ext:cls="Ext.Container">default config values</a> will be applied
+accordingly (see <code><a href="output/Ext.Container.html#Ext.Container-defaults" ext:member="defaults" ext:cls="Ext.Container">defaults</a></code> for details).</li>
+<li>Fires the <a href="output/Ext.Container.html#Ext.Container-add" ext:member="add" ext:cls="Ext.Container">add</a> event after the component has been added.</li>
+</ul></div>
+<br><p><b>Notes</b></u> :
+<div><ul class="mdetail-params">
+<li>If the Container is <i>already rendered</i> when <code>add</code>
+is called, you may need to call <a href="output/Ext.Container.html#Ext.Container-doLayout" ext:member="doLayout" ext:cls="Ext.Container">doLayout</a> to refresh the view which causes
+any unrendered child Components to be rendered. This is required so that you can
+<code>add</code> multiple child components if needed while only refreshing the layout
+once. For example:<pre><code><b>var</b> tb = <b>new</b> <a href="output/Ext.Toolbar.html" ext:cls="Ext.Toolbar">Ext.Toolbar</a>();
+tb.render(document.body); <i>// toolbar is rendered</i>
+tb.add({text:<em>'Button 1'</em>}); <i>// add multiple items (<a href="output/Ext.Container.html#Ext.Container-defaultType" ext:member="defaultType" ext:cls="Ext.Container">defaultType</a> <b>for</b> <a href="output/Ext.Toolbar.html" ext:cls="Ext.Toolbar">Toolbar</a> is <em>'button'</em>)</i>
+tb.add({text:<em>'Button 2'</em>});
+tb.<a href="output/Ext.Container.html#Ext.Container-doLayout" ext:member="doLayout" ext:cls="Ext.Container">doLayout</a>(); <i>// refresh the layout</i></code></pre></li>
+<li><i>Warning:</i> Containers directly managed by the BorderLayout layout manager
+may not be removed or added. See the Notes for <a href="output/Ext.layout.BorderLayout.html" ext:cls="Ext.layout.BorderLayout">BorderLayout</a>
+for more details.</li>
+</ul></div><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>component</code> : Object/Array<div class="sub-desc"><p>Either a single component or an Array of components to add. See
+<code><a href="output/Ext.Container.html#Ext.Container-items" ext:member="items" ext:cls="Ext.Container">items</a></code> for additional information.</p></div></li><li><code>(Optional)</code> : Object<div class="sub-desc">component_2</div></li><li><code>(Optional)</code> : Object<div class="sub-desc">component_n</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">component The Component (or config object) that was added.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#add" ext:member="#add" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-addClass"></a><b><a href="source/Component.html#method-Ext.Component-addClass">addClass</a></b>( <code>string cls</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Adds a CSS class to the component's underlying element.</div><div class="long">Adds a CSS class to the component's underlying element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>cls</code> : string<div class="sub-desc">The CSS class name to add</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#addClass" ext:member="#addClass" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-addElement"></a><b><a href="source/Menu.html#method-Ext.menu.Menu-addElement">addElement</a></b>( <code>Mixed el</code> )\r
+ :\r
+ Ext.menu.Item<div class="mdesc"><div class="short">Adds an Ext.Element object to the menu</div><div class="long">Adds an <a href="output/Ext.Element.html" ext:cls="Ext.Element">Ext.Element</a> object to the menu<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : Mixed<div class="sub-desc">The element or DOM node to add, or its id</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#addElement" ext:member="#addElement" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-addEvents"></a><b><a href="source/Observable.html#method-Ext.util.Observable-addEvents">addEvents</a></b>( <code>Object|String o</code>, <code>string Optional.</code> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Adds the specified events to the list of events which this Observable may fire.</div><div class="long">Adds the specified events to the list of events which this Observable may fire.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>o</code> : Object|String<div class="sub-desc">Either an object with event names as properties with a value of <code>true</code>
+or the first event name string if multiple event names are being passed as separate parameters.</div></li><li><code>Optional.</code> : string<div class="sub-desc">Event name if multiple event names are being passed as separate parameters.
+Usage:<pre><code>this.addEvents(<em>'storeloaded'</em>, <em>'storecleared'</em>);</code></pre></div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#addEvents" ext:member="#addEvents" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-addItem"></a><b><a href="source/Menu.html#method-Ext.menu.Menu-addItem">addItem</a></b>( <code>Ext.menu.Item item</code> )\r
+ :\r
+ Ext.menu.Item<div class="mdesc"><div class="short">Adds an existing object based on Ext.menu.BaseItem to the menu</div><div class="long">Adds an existing object based on <a href="output/Ext.menu.BaseItem.html" ext:cls="Ext.menu.BaseItem">Ext.menu.BaseItem</a> to the menu<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>item</code> : Ext.menu.Item<div class="sub-desc">The menu item to add</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#addItem" ext:member="#addItem" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-addListener"></a><b><a href="source/Observable.html#method-Ext.util.Observable-addListener">addListener</a></b>( <code>String eventName</code>, <code>Function handler</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span>, <span title="Optional" class="optional">[<code>Object options</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Appends an event handler to this object.</div><div class="long">Appends an event handler to this object.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The name of the event to listen for.</div></li><li><code>handler</code> : Function<div class="sub-desc">The method the event invokes.</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+<b>If omitted, defaults to the object which fired the event.</b></div></li><li><code>options</code> : Object<div class="sub-desc">(optional) An object containing handler configuration.
properties. This may contain any of the following properties:<ul>
-<li><b>scope</b> : Object<p class="sub-desc">The scope in which to execute the handler function. The handler function's "this" context.</p></li>
-<li><b>delay</b> : Number<p class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</p></li>
-<li><b>single</b> : Boolean<p class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</p></li>
-<li><b>buffer</b> : Number<p class="sub-desc">Causes the handler to be scheduled to run in an <a ext:cls="Ext.util.DelayedTask" href="output/Ext.util.DelayedTask.html">Ext.util.DelayedTask</a> delayed
+<li><b>scope</b> : Object<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+<b>If omitted, defaults to the object which fired the event.</b></div></li>
+<li><b>delay</b> : Number<div class="sub-desc">The number of milliseconds to delay the invocation of the handler after the event fires.</div></li>
+<li><b>single</b> : Boolean<div class="sub-desc">True to add a handler to handle just the next firing of the event, and then remove itself.</div></li>
+<li><b>buffer</b> : Number<div class="sub-desc">Causes the handler to be scheduled to run in an <a href="output/Ext.util.DelayedTask.html" ext:cls="Ext.util.DelayedTask">Ext.util.DelayedTask</a> delayed
by the specified number of milliseconds. If the event fires again within that time, the original
-handler is <em>not</em> invoked, but the new handler is scheduled in its place.</p></li>
+handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
+<li><b>target</b> : Observable<div class="sub-desc">Only call the handler if the event was fired on the target Observable, <i>not</i>
+if the event was bubbled up from a child Observable.</div></li>
</ul><br>
<p>
<b>Combining Options</b><br>
Using the options argument, it is possible to combine different types of listeners:<br>
<br>
-A normalized, delayed, one-time listener that auto stops the event and passes a custom argument (forumId)
-<pre><code>el.on(<em>'click'</em>, <b>this</b>.onClick, <b>this</b>, {
- single: true,
- delay: 100,
- forumId: 4
+A delayed, one-time listener.
+<pre><code>myDataView.on(<em>'click'</em>, this.onClick, this, {
+single: true,
+delay: 100
});</code></pre>
<p>
<b>Attaching multiple handlers in 1 call</b><br>
The method also allows for a single argument to be passed which is a config object containing properties
which specify multiple handlers.
<p>
-<pre><code>foo.on({
- <em>'click'</em> : {
- fn: <b>this</b>.onClick,
- scope: <b>this</b>,
- delay: 100
- },
- <em>'mouseover'</em> : {
- fn: <b>this</b>.onMouseOver,
- scope: <b>this</b>
- },
- <em>'mouseout'</em> : {
- fn: <b>this</b>.onMouseOut,
- scope: <b>this</b>
- }
+<pre><code>myGridPanel.on({
+<em>'click'</em> : {
+ fn: this.onClick,
+ scope: this,
+ delay: 100
+},
+<em>'mouseover'</em> : {
+ fn: this.onMouseOver,
+ scope: this
+},
+<em>'mouseout'</em> : {
+ fn: this.onMouseOut,
+ scope: this
+}
});</code></pre>
<p>
Or a shorthand syntax:<br>
-<pre><code>foo.on({
- <em>'click'</em> : <b>this</b>.onClick,
- <em>'mouseover'</em> : <b>this</b>.onMouseOver,
- <em>'mouseout'</em> : <b>this</b>.onMouseOut,
- scope: <b>this</b>
-});</code></pre></div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#addListener" href="output/Ext.util.Observable.html#addListener">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-addMenuItem"></a>\r
- <b>addMenuItem</b>( <code>Object config</code> ) : Ext.menu.Item <div class="mdesc">\r
- <div class="short">Creates a new <a ext:cls="Ext.menu.Item" href="output/Ext.menu.Item.html">Ext.menu.Item</a> based an the supplied config object and adds it to the menu</div>\r
- <div class="long">\r
- Creates a new <a ext:cls="Ext.menu.Item" href="output/Ext.menu.Item.html">Ext.menu.Item</a> based an the supplied config object and adds it to the menu <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>config</code> : Object<div class="sub-desc">A MenuItem config object</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#addMenuItem" href="output/Ext.menu.Menu.html#addMenuItem">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-addSeparator"></a>\r
- <b>addSeparator</b>() : Ext.menu.Item <div class="mdesc">\r
- <div class="short">Adds a separator bar to the menu</div>\r
- <div class="long">\r
- Adds a separator bar to the menu <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li>None.</li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#addSeparator" href="output/Ext.menu.Menu.html#addSeparator">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-addText"></a>\r
- <b>addText</b>( <code>String text</code> ) : Ext.menu.Item <div class="mdesc">\r
- <div class="short">Creates a new <a ext:cls="Ext.menu.TextItem" href="output/Ext.menu.TextItem.html">Ext.menu.TextItem</a> with the supplied text and adds it to the menu</div>\r
- <div class="long">\r
- Creates a new <a ext:cls="Ext.menu.TextItem" href="output/Ext.menu.TextItem.html">Ext.menu.TextItem</a> with the supplied text and adds it to the menu <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>text</code> : String<div class="sub-desc">The text to display in the menu item</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#addText" href="output/Ext.menu.Menu.html#addText">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-destroy"></a>\r
- <b>destroy</b>() : void <div class="mdesc">\r
- <div class="short">Destroys the menu by unregistering it from Ext.menu.MenuMgr, purging event listeners,
-removing all of the menus item...</div>\r
- <div class="long">\r
- Destroys the menu by unregistering it from <a ext:cls="Ext.menu.MenuMgr" href="output/Ext.menu.MenuMgr.html">Ext.menu.MenuMgr</a>, purging event listeners,
-removing all of the menus items, then destroying the underlying <a ext:cls="Ext.Element" href="output/Ext.Element.html">Ext.Element</a> <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li>None.</li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#destroy" href="output/Ext.menu.Menu.html#destroy">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-fireEvent"></a>\r
- <b>fireEvent</b>( <code>String eventName</code>, <code>Object... args</code> ) : Boolean <div class="mdesc">\r
- <div class="short">Fires the specified event with the passed parameters (minus the event name).</div>\r
- <div class="long">\r
- Fires the specified event with the passed parameters (minus the event name). <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>eventName</code> : String<div class="sub-desc"></div></li><li><code>args</code> : Object...<div class="sub-desc">Variable number of parameters are passed to handlers</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Boolean</code><div class="sub-desc">returns false if any of the handlers return false otherwise it returns true</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#fireEvent" href="output/Ext.util.Observable.html#fireEvent">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-getEl"></a>\r
- <b>getEl</b>() : Ext.Element <div class="mdesc">\r
- <div class="short">Returns this menu's underlying <a ext:cls="Ext.Element" href="output/Ext.Element.html">Ext.Element</a> object</div>\r
- <div class="long">\r
- Returns this menu's underlying <a ext:cls="Ext.Element" href="output/Ext.Element.html">Ext.Element</a> object <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li>None.</li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Ext.Element</code><div class="sub-desc">The element</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#getEl" href="output/Ext.menu.Menu.html#getEl">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-hasListener"></a>\r
- <b>hasListener</b>( <code>String eventName</code> ) : Boolean <div class="mdesc">\r
- <div class="short">Checks to see if this object has any listeners for a specified event</div>\r
- <div class="long">\r
- Checks to see if this object has any listeners for a specified event <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>eventName</code> : String<div class="sub-desc">The name of the event to check for</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Boolean</code><div class="sub-desc">True if the event is being listened for, else false</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#hasListener" href="output/Ext.util.Observable.html#hasListener">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-hide"></a>\r
- <b>hide</b>( <span class="optional" title="Optional">[<code>Boolean deep</code>]</span> ) : void <div class="mdesc">\r
- <div class="short">Hides this menu and optionally all parent menus</div>\r
- <div class="long">\r
- Hides this menu and optionally all parent menus <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>deep</code> : Boolean<div class="sub-desc">(optional) True to hide all parent menus recursively, if any (defaults to false)</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#hide" href="output/Ext.menu.Menu.html#hide">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-insert"></a>\r
- <b>insert</b>( <code>Number index</code>, <code>Ext.menu.Item item</code> ) : Ext.menu.Item <div class="mdesc">\r
- <div class="short">Inserts an existing object based on <a ext:cls="Ext.menu.BaseItem" href="output/Ext.menu.BaseItem.html">Ext.menu.BaseItem</a> to the menu at a specified index</div>\r
- <div class="long">\r
- Inserts an existing object based on <a ext:cls="Ext.menu.BaseItem" href="output/Ext.menu.BaseItem.html">Ext.menu.BaseItem</a> to the menu at a specified index <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>index</code> : Number<div class="sub-desc">The index in the menu's list of current items where the new item should be inserted</div></li><li><code>item</code> : Ext.menu.Item<div class="sub-desc">The menu item to add</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#insert" href="output/Ext.menu.Menu.html#insert">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-isVisible"></a>\r
- <b>isVisible</b>() : void <div class="mdesc">\r
- <div class="short">Read-only. Returns true if the menu is currently displayed, else false.</div>\r
- <div class="long">\r
- Read-only. Returns true if the menu is currently displayed, else false. <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li>None.</li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#isVisible" href="output/Ext.menu.Menu.html#isVisible">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-on"></a>\r
- <b>on</b>( <code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span>, <span class="optional" title="Optional">[<code>Object options</code>]</span> ) : void <div class="mdesc">\r
- <div class="short">Appends an event handler to this element (shorthand for addListener)</div>\r
- <div class="long">\r
- Appends an event handler to this element (shorthand for addListener) <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The method the event invokes</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope in which to execute the handler
-function. The handler function's "this" context.</div></li><li><code>options</code> : Object<div class="sub-desc">(optional)</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#on" href="output/Ext.util.Observable.html#on">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-purgeListeners"></a>\r
- <b>purgeListeners</b>() : void <div class="mdesc">\r
- <div class="short">Removes all listeners for this object</div>\r
- <div class="long">\r
- Removes all listeners for this object <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li>None.</li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#purgeListeners" href="output/Ext.util.Observable.html#purgeListeners">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-relayEvents"></a>\r
- <b>relayEvents</b>( <code>Object o</code>, <code>Array events</code> ) : void <div class="mdesc">\r
- <div class="short">Relays selected events from the specified Observable as if the events were fired by <tt><b>this</b></tt>.</div>\r
- <div class="long">\r
- Relays selected events from the specified Observable as if the events were fired by <tt><b>this</b></tt>. <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>o</code> : Object<div class="sub-desc">The Observable whose events this object is to relay.</div></li><li><code>events</code> : Array<div class="sub-desc">Array of event names to relay.</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#relayEvents" href="output/Ext.util.Observable.html#relayEvents">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-remove"></a>\r
- <b>remove</b>( <code>Ext.menu.Item item</code> ) : void <div class="mdesc">\r
- <div class="short">Removes an <a ext:cls="Ext.menu.Item" href="output/Ext.menu.Item.html">Ext.menu.Item</a> from the menu and destroys the object</div>\r
- <div class="long">\r
- Removes an <a ext:cls="Ext.menu.Item" href="output/Ext.menu.Item.html">Ext.menu.Item</a> from the menu and destroys the object <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>item</code> : Ext.menu.Item<div class="sub-desc">The menu item to remove</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#remove" href="output/Ext.menu.Menu.html#remove">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-removeAll"></a>\r
- <b>removeAll</b>() : void <div class="mdesc">\r
- <div class="short">Removes and destroys all items in the menu</div>\r
- <div class="long">\r
- Removes and destroys all items in the menu <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li>None.</li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#removeAll" href="output/Ext.menu.Menu.html#removeAll">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-removeListener"></a>\r
- <b>removeListener</b>( <code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span> ) : void <div class="mdesc">\r
- <div class="short">Removes a listener</div>\r
- <div class="long">\r
- Removes a listener <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The handler to remove</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (this object) for the handler</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#removeListener" href="output/Ext.util.Observable.html#removeListener">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-resumeEvents"></a>\r
- <b>resumeEvents</b>() : void <div class="mdesc">\r
- <div class="short">Resume firing events. (see <a ext:cls="Ext.util.Observable" ext:member="suspendEvents" href="output/Ext.util.Observable.html#suspendEvents">suspendEvents</a>)</div>\r
- <div class="long">\r
- Resume firing events. (see <a ext:cls="Ext.util.Observable" ext:member="suspendEvents" href="output/Ext.util.Observable.html#suspendEvents">suspendEvents</a>) <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li>None.</li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#resumeEvents" href="output/Ext.util.Observable.html#resumeEvents">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-show"></a>\r
- <b>show</b>( <code>Mixed element</code>, <span class="optional" title="Optional">[<code>String position</code>]</span>, <span class="optional" title="Optional">[<code>Ext.menu.Menu parentMenu</code>]</span> ) : void <div class="mdesc">\r
- <div class="short">Displays this menu relative to another element</div>\r
- <div class="long">\r
- Displays this menu relative to another element <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>element</code> : Mixed<div class="sub-desc">The element to align to</div></li><li><code>position</code> : String<div class="sub-desc">(optional) The <a ext:cls="Ext.Element" ext:member="alignTo" href="output/Ext.Element.html#alignTo">Ext.Element.alignTo</a> anchor position to use in aligning to
-the element (defaults to this.defaultAlign)</div></li><li><code>parentMenu</code> : Ext.menu.Menu<div class="sub-desc">(optional) This menu's parent menu, if applicable (defaults to undefined)</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#show" href="output/Ext.menu.Menu.html#show">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-showAt"></a>\r
- <b>showAt</b>( <code>Array xyPosition</code>, <span class="optional" title="Optional">[<code>Ext.menu.Menu parentMenu</code>]</span> ) : void <div class="mdesc">\r
- <div class="short">Displays this menu at a specific xy position</div>\r
- <div class="long">\r
- Displays this menu at a specific xy position <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>xyPosition</code> : Array<div class="sub-desc">Contains X & Y [x, y] values for the position at which to show the menu (coordinates are page-based)</div></li><li><code>parentMenu</code> : Ext.menu.Menu<div class="sub-desc">(optional) This menu's parent menu, if applicable (defaults to undefined)</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#showAt" href="output/Ext.menu.Menu.html#showAt">Menu</a></td>\r
- </tr>\r
- <tr class="method-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-suspendEvents"></a>\r
- <b>suspendEvents</b>() : void <div class="mdesc">\r
- <div class="short">Suspend the firing of all events. (see <a ext:cls="Ext.util.Observable" ext:member="resumeEvents" href="output/Ext.util.Observable.html#resumeEvents">resumeEvents</a>)</div>\r
- <div class="long">\r
- Suspend the firing of all events. (see <a ext:cls="Ext.util.Observable" ext:member="resumeEvents" href="output/Ext.util.Observable.html#resumeEvents">resumeEvents</a>) <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li>None.</li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#suspendEvents" href="output/Ext.util.Observable.html#suspendEvents">Observable</a></td>\r
- </tr>\r
- <tr class="method-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-un"></a>\r
- <b>un</b>( <code>String eventName</code>, <code>Function handler</code>, <span class="optional" title="Optional">[<code>Object scope</code>]</span> ) : void <div class="mdesc">\r
- <div class="short">Removes a listener (shorthand for removeListener)</div>\r
- <div class="long">\r
- Removes a listener (shorthand for removeListener) <div class="mdetail-params">\r
- <strong>Parameters:</strong>\r
- <ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The handler to remove</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (this object) for the handler</div></li> </ul>\r
- <strong>Returns:</strong>\r
- <ul>\r
- <li><code>void</code></li>\r
- </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.util.Observable" ext:member="#un" href="output/Ext.util.Observable.html#un">Observable</a></td>\r
- </tr>\r
- </table>
- <a id="Ext.menu.ColorMenu-events"></a>
- <h2>Public Events</h2>
- <table cellspacing="0" class="member-table">
- <tr>
- <th class="sig-header" colspan="2">Event</th>
- <th class="msource-header">Defined By</th>
- </tr>
- <tr class="event-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-beforehide"></a>\r
- <b>beforehide</b> : ( <code>Ext.menu.Menu this</code> ) <div class="mdesc">\r
- <div class="short">Fires before this menu is hidden</div>\r
- <div class="long">\r
- Fires before this menu is hidden <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#event-beforehide" href="output/Ext.menu.Menu.html#event-beforehide">Menu</a></td>\r
- </tr>\r
- <tr class="event-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-beforeshow"></a>\r
- <b>beforeshow</b> : ( <code>Ext.menu.Menu this</code> ) <div class="mdesc">\r
- <div class="short">Fires before this menu is displayed</div>\r
- <div class="long">\r
- Fires before this menu is displayed <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#event-beforeshow" href="output/Ext.menu.Menu.html#event-beforeshow">Menu</a></td>\r
- </tr>\r
- <tr class="event-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-click"></a>\r
- <b>click</b> : ( <code>Ext.menu.Menu this</code>, <code>Ext.menu.Item menuItem</code>, <code>Ext.EventObject e</code> ) <div class="mdesc">\r
- <div class="short">Fires when this menu is clicked (or when the enter key is pressed while it is active)</div>\r
- <div class="long">\r
- Fires when this menu is clicked (or when the enter key is pressed while it is active) <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li><li><code>menuItem</code> : Ext.menu.Item<div class="sub-desc">The menu item that was clicked</div></li><li><code>e</code> : Ext.EventObject<div class="sub-desc"></div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#event-click" href="output/Ext.menu.Menu.html#event-click">Menu</a></td>\r
- </tr>\r
- <tr class="event-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-hide"></a>\r
- <b>hide</b> : ( <code>Ext.menu.Menu this</code> ) <div class="mdesc">\r
- <div class="short">Fires after this menu is hidden</div>\r
- <div class="long">\r
- Fires after this menu is hidden <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#event-hide" href="output/Ext.menu.Menu.html#event-hide">Menu</a></td>\r
- </tr>\r
- <tr class="event-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-itemclick"></a>\r
- <b>itemclick</b> : ( <code>Ext.menu.BaseItem baseItem</code>, <code>Ext.EventObject e</code> ) <div class="mdesc">\r
- <div class="short">Fires when a menu item contained in this menu is clicked</div>\r
- <div class="long">\r
- Fires when a menu item contained in this menu is clicked <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>baseItem</code> : Ext.menu.BaseItem<div class="sub-desc">The BaseItem that was clicked</div></li><li><code>e</code> : Ext.EventObject<div class="sub-desc"></div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#event-itemclick" href="output/Ext.menu.Menu.html#event-itemclick">Menu</a></td>\r
- </tr>\r
- <tr class="event-row inherited alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-mouseout"></a>\r
- <b>mouseout</b> : ( <code>Ext.menu.Menu this</code>, <code>Ext.EventObject e</code>, <code>Ext.menu.Item menuItem</code> ) <div class="mdesc">\r
- <div class="short">Fires when the mouse exits this menu</div>\r
- <div class="long">\r
- Fires when the mouse exits this menu <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li><li><code>e</code> : Ext.EventObject<div class="sub-desc"></div></li><li><code>menuItem</code> : Ext.menu.Item<div class="sub-desc">The menu item that was clicked</div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#event-mouseout" href="output/Ext.menu.Menu.html#event-mouseout">Menu</a></td>\r
- </tr>\r
- <tr class="event-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-mouseover"></a>\r
- <b>mouseover</b> : ( <code>Ext.menu.Menu this</code>, <code>Ext.EventObject e</code>, <code>Ext.menu.Item menuItem</code> ) <div class="mdesc">\r
- <div class="short">Fires when the mouse is hovering over this menu</div>\r
- <div class="long">\r
- Fires when the mouse is hovering over this menu <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li><li><code>e</code> : Ext.EventObject<div class="sub-desc"></div></li><li><code>menuItem</code> : Ext.menu.Item<div class="sub-desc">The menu item that was clicked</div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#event-mouseover" href="output/Ext.menu.Menu.html#event-mouseover">Menu</a></td>\r
- </tr>\r
- <tr class="event-row alt expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-select"></a>\r
- <b>select</b> : ( <code>ColorPalette palette</code>, <code>String color</code> ) <div class="mdesc">\r
- <div class="short"></div>\r
- <div class="long">\r
- <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>palette</code> : ColorPalette<div class="sub-desc"></div></li><li><code>color</code> : String<div class="sub-desc"></div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource">ColorMenu</td>\r
- </tr>\r
- <tr class="event-row inherited expandable">\r
- <td class="micon"><a class="exi" href="#expand"> </a></td>\r
- <td class="sig">\r
- <a id="Ext.menu.ColorMenu-show"></a>\r
- <b>show</b> : ( <code>Ext.menu.Menu this</code> ) <div class="mdesc">\r
- <div class="short">Fires after this menu is displayed</div>\r
- <div class="long">\r
- Fires after this menu is displayed <div class="mdetail-params">\r
- <strong style="font-weight:normal;">Listeners will be called with the following arguments:</strong>\r
- <ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li> </ul>\r
- </div>\r
- </div>\r
- </div>\r
- </td>\r
- <td class="msource"><a ext:cls="Ext.menu.Menu" ext:member="#event-show" href="output/Ext.menu.Menu.html#event-show">Menu</a></td>\r
- </tr>\r
- </table>
-
- </div>
\ No newline at end of file
+<pre><code>myGridPanel.on({
+<em>'click'</em> : this.onClick,
+<em>'mouseover'</em> : this.onMouseOver,
+<em>'mouseout'</em> : this.onMouseOut,
+ scope: this
+});</code></pre></div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#addListener" ext:member="#addListener" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-addMenuItem"></a><b><a href="source/Menu.html#method-Ext.menu.Menu-addMenuItem">addMenuItem</a></b>( <code>Object config</code> )\r
+ :\r
+ Ext.menu.Item<div class="mdesc"><div class="short">Creates a new Ext.menu.Item based an the supplied config object and adds it to the menu</div><div class="long">Creates a new <a href="output/Ext.menu.Item.html" ext:cls="Ext.menu.Item">Ext.menu.Item</a> based an the supplied config object and adds it to the menu<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc">A MenuItem config object</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#addMenuItem" ext:member="#addMenuItem" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-addSeparator"></a><b><a href="source/Menu.html#method-Ext.menu.Menu-addSeparator">addSeparator</a></b>()\r
+ :\r
+ Ext.menu.Item<div class="mdesc"><div class="short">Adds a separator bar to the menu</div><div class="long">Adds a separator bar to the menu<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#addSeparator" ext:member="#addSeparator" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-addText"></a><b><a href="source/Menu.html#method-Ext.menu.Menu-addText">addText</a></b>( <code>String text</code> )\r
+ :\r
+ Ext.menu.Item<div class="mdesc"><div class="short">Creates a new Ext.menu.TextItem with the supplied text and adds it to the menu</div><div class="long">Creates a new <a href="output/Ext.menu.TextItem.html" ext:cls="Ext.menu.TextItem">Ext.menu.TextItem</a> with the supplied text and adds it to the menu<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>text</code> : String<div class="sub-desc">The text to display in the menu item</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.menu.Item</code><div class="sub-desc">The menu item that was added</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#addText" ext:member="#addText" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-applyToMarkup"></a><b><a href="source/Component.html#method-Ext.Component-applyToMarkup">applyToMarkup</a></b>( <code>String/HTMLElement el</code> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Apply this component to existing markup that is valid. With this function, no call to render() is required.</div><div class="long">Apply this component to existing markup that is valid. With this function, no call to render() is required.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : String/HTMLElement<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#applyToMarkup" ext:member="#applyToMarkup" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-bubble"></a><b><a href="source/Container.html#method-Ext.Container-bubble">bubble</a></b>( <code>Function fn</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span>, <span title="Optional" class="optional">[<code>Array args</code>]</span> )\r
+ :\r
+ Ext.Container<div class="mdesc"><div class="short">Bubbles up the component/container heirarchy, calling the specified function with each component. The scope (this) of...</div><div class="long">Bubbles up the component/container heirarchy, calling the specified function with each component. The scope (<i>this</i>) of
+function call will be the scope provided or the current component. The arguments to the function
+will be the args provided or the current component. If the function returns false at any point,
+the bubble is stopped.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>fn</code> : Function<div class="sub-desc">The function to call</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope of the function (defaults to current node)</div></li><li><code>args</code> : Array<div class="sub-desc">(optional) The args to call the function with (default to passing the current component)</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Container</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#bubble" ext:member="#bubble" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-canLayout"></a><b><a href="source/Container.html#method-Ext.Container-canLayout">canLayout</a></b>()\r
+ :\r
+ void<div class="mdesc"><div class="short">We can only lay out if there is a view area in which to layout.\r
+display:none on the layout target, *or any of its par...</div><div class="long">We can only lay out if there is a view area in which to layout.
+display:none on the layout target, *or any of its parent elements* will mean it has no view area.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#canLayout" ext:member="#canLayout" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-cascade"></a><b><a href="source/Container.html#method-Ext.Container-cascade">cascade</a></b>( <code>Function fn</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span>, <span title="Optional" class="optional">[<code>Array args</code>]</span> )\r
+ :\r
+ Ext.Container<div class="mdesc"><div class="short">Cascades down the component/container heirarchy from this component (called first), calling the specified function wi...</div><div class="long">Cascades down the component/container heirarchy from this component (called first), calling the specified function with
+each component. The scope (<i>this</i>) of
+function call will be the scope provided or the current component. The arguments to the function
+will be the args provided or the current component. If the function returns false at any point,
+the cascade is stopped on that branch.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>fn</code> : Function<div class="sub-desc">The function to call</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope of the function (defaults to current component)</div></li><li><code>args</code> : Array<div class="sub-desc">(optional) The args to call the function with (defaults to passing the current component)</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Container</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#cascade" ext:member="#cascade" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-cloneConfig"></a><b><a href="source/Component.html#method-Ext.Component-cloneConfig">cloneConfig</a></b>( <code>Object overrides</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Clone the current component using the original config values passed into this instance by default.</div><div class="long">Clone the current component using the original config values passed into this instance by default.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>overrides</code> : Object<div class="sub-desc">A new config containing any properties to override in the cloned version.
+An id property can be passed on this object, otherwise one will be generated to avoid duplicates.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">clone The cloned copy of this component</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#cloneConfig" ext:member="#cloneConfig" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-destroy"></a><b><a href="source/Component.html#method-Ext.Component-destroy">destroy</a></b>()\r
+ :\r
+ void<div class="mdesc"><div class="short">Destroys this component by purging any event listeners, removing the component's element from the DOM,\r
+removing the c...</div><div class="long">Destroys this component by purging any event listeners, removing the component's element from the DOM,
+removing the component from its <a href="output/Ext.Container.html" ext:cls="Ext.Container">Ext.Container</a> (if applicable) and unregistering it from
+<a href="output/Ext.ComponentMgr.html" ext:cls="Ext.ComponentMgr">Ext.ComponentMgr</a>. Destruction is generally handled automatically by the framework and this method
+should usually not need to be called directly.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#destroy" ext:member="#destroy" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-disable"></a><b><a href="source/Component.html#method-Ext.Component-disable">disable</a></b>()\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Disable this component and fire the 'disable' event.</div><div class="long">Disable this component and fire the 'disable' event.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#disable" ext:member="#disable" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-doLayout"></a><b><a href="source/Container.html#method-Ext.Container-doLayout">doLayout</a></b>( <span title="Optional" class="optional">[<code>Boolean shallow</code>]</span>, <span title="Optional" class="optional">[<code>Boolean force</code>]</span> )\r
+ :\r
+ Ext.Container<div class="mdesc"><div class="short">Force this container's layout to be recalculated. A call to this function is required after adding a new component\r
+to...</div><div class="long">Force this container's layout to be recalculated. A call to this function is required after adding a new component
+to an already rendered container, or possibly after changing sizing/position properties of child components.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>shallow</code> : Boolean<div class="sub-desc">(optional) True to only calc the layout of this component, and let child components auto
+calc layouts as required (defaults to false, which calls doLayout recursively for each subcontainer)</div></li><li><code>force</code> : Boolean<div class="sub-desc">(optional) True to force a layout to occur, even if the item is hidden.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Container</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#doLayout" ext:member="#doLayout" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-enable"></a><b><a href="source/Component.html#method-Ext.Component-enable">enable</a></b>()\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Enable this component and fire the 'enable' event.</div><div class="long">Enable this component and fire the 'enable' event.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#enable" ext:member="#enable" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-enableBubble"></a><b><a href="source/Observable-more.html#method-Ext.util.Observable-enableBubble">enableBubble</a></b>( <code>String/Array events</code> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Enables events fired by this Observable to bubble up an owner hierarchy by calling \r
+this.getBubbleTarget() if present...</div><div class="long"><p>Enables events fired by this Observable to bubble up an owner hierarchy by calling\r
+<code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>\r
+<p>This is commonly used by Ext.Components to bubble events to owner Containers. See <a href="output/Ext.Component.getBubbleTarget.html" ext:cls="Ext.Component.getBubbleTarget">Ext.Component.getBubbleTarget</a>. The default\r
+implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to\r
+access the required target more quickly.</p>\r
+<p>Example:</p><pre><code>Ext.override(Ext.form.Field, {\r
+ <i>// Add functionality to Field's initComponent to enable the change event to bubble\r</i>
+ initComponent : Ext.form.Field.prototype.initComponent.createSequence(<b>function</b>() {\r
+ this.enableBubble(<em>'change'</em>);\r
+ }),\r
+\r
+ <i>// We know that we want Field's events to bubble directly to the FormPanel.\r</i>
+ getBubbleTarget : <b>function</b>() {\r
+ <b>if</b> (!this.formPanel) {\r
+ this.formPanel = this.findParentByType(<em>'form'</em>);\r
+ }\r
+ <b>return</b> this.formPanel;\r
+ }\r
+});\r
+\r
+<b>var</b> myForm = <b>new</b> Ext.formPanel({\r
+ title: <em>'User Details'</em>,\r
+ items: [{\r
+ ...\r
+ }],\r
+ listeners: {\r
+ change: <b>function</b>() {\r
+ <i>// Title goes red <b>if</b> form has been modified.\r</i>
+ myForm.header.setStyle(<em>'color'</em>, <em>'red'</em>);\r
+ }\r
+ }\r
+});</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>events</code> : String/Array<div class="sub-desc">The event name to bubble, or an Array of event names.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#enableBubble" ext:member="#enableBubble" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-find"></a><b><a href="source/Container.html#method-Ext.Container-find">find</a></b>( <code>String prop</code>, <code>String value</code> )\r
+ :\r
+ Array<div class="mdesc"><div class="short">Find a component under this container at any level by property</div><div class="long">Find a component under this container at any level by property<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>prop</code> : String<div class="sub-desc"></div></li><li><code>value</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">Array of Ext.Components</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#find" ext:member="#find" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-findBy"></a><b><a href="source/Container.html#method-Ext.Container-findBy">findBy</a></b>( <code>Function fn</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span> )\r
+ :\r
+ Array<div class="mdesc"><div class="short">Find a component under this container at any level by a custom function. If the passed function returns\r
+true, the com...</div><div class="long">Find a component under this container at any level by a custom function. If the passed function returns
+true, the component will be included in the results. The passed function is called with the arguments (component, this container).<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>fn</code> : Function<div class="sub-desc">The function to call</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional)</div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">Array of Ext.Components</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#findBy" ext:member="#findBy" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-findById"></a><b><a href="source/Container.html#method-Ext.Container-findById">findById</a></b>( <code>String id</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Find a component under this container at any level by id</div><div class="long">Find a component under this container at any level by id<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>id</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#findById" ext:member="#findById" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-findByType"></a><b><a href="source/Container.html#method-Ext.Container-findByType">findByType</a></b>( <code>String/Class xtype</code>, <span title="Optional" class="optional">[<code>Boolean shallow</code>]</span> )\r
+ :\r
+ Array<div class="mdesc"><div class="short">Find a component under this container at any level by xtype or class</div><div class="long">Find a component under this container at any level by xtype or class<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>xtype</code> : String/Class<div class="sub-desc">The xtype string for a component, or the class of the component directly</div></li><li><code>shallow</code> : Boolean<div class="sub-desc">(optional) False to check whether this Component is descended from the xtype (this is
+the default), or true to check whether this Component is directly of the specified xtype.</div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">Array of Ext.Components</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#findByType" ext:member="#findByType" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-findParentBy"></a><b><a href="source/Component.html#method-Ext.Component-findParentBy">findParentBy</a></b>( <code>Function fn</code> )\r
+ :\r
+ Ext.Container<div class="mdesc"><div class="short">Find a container above this component at any level by a custom function. If the passed function returns\r
+true, the con...</div><div class="long">Find a container above this component at any level by a custom function. If the passed function returns
+true, the container will be returned.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>fn</code> : Function<div class="sub-desc">The custom function to call with the arguments (container, this component).</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Container</code><div class="sub-desc">The first Container for which the custom function returns true</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#findParentBy" ext:member="#findParentBy" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-findParentByType"></a><b><a href="source/Component.html#method-Ext.Component-findParentByType">findParentByType</a></b>( <code>String/Class xtype</code> )\r
+ :\r
+ Ext.Container<div class="mdesc"><div class="short">Find a container above this component at any level by xtype or class</div><div class="long">Find a container above this component at any level by xtype or class<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>xtype</code> : String/Class<div class="sub-desc">The xtype string for a component, or the class of the component directly</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Container</code><div class="sub-desc">The first Container which matches the given xtype or class</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#findParentByType" ext:member="#findParentByType" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-fireEvent"></a><b><a href="source/Observable.html#method-Ext.util.Observable-fireEvent">fireEvent</a></b>( <code>String eventName</code>, <code>Object... args</code> )\r
+ :\r
+ Boolean<div class="mdesc"><div class="short">Fires the specified event with the passed parameters (minus the event name).\r
+An event may be set to bubble up an Obse...</div><div class="long"><p>Fires the specified event with the passed parameters (minus the event name).</p>
+<p>An event may be set to bubble up an Observable parent hierarchy (See <a href="output/Ext.Component.html#Ext.Component-getBubbleTarget" ext:member="getBubbleTarget" ext:cls="Ext.Component">Ext.Component.getBubbleTarget</a>)
+by calling <a href="output/Ext.util.Observable.html#Ext.util.Observable-enableBubble" ext:member="enableBubble" ext:cls="Ext.util.Observable">enableBubble</a>.</p><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The name of the event to fire.</div></li><li><code>args</code> : Object...<div class="sub-desc">Variable number of parameters are passed to handlers.</div></li></ul><strong>Returns:</strong><ul><li><code>Boolean</code><div class="sub-desc">returns false if any of the handlers return false otherwise it returns true.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#fireEvent" ext:member="#fireEvent" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-focus"></a><b><a href="source/Component.html#method-Ext.Component-focus">focus</a></b>( <span title="Optional" class="optional">[<code>Boolean selectText</code>]</span>, <span title="Optional" class="optional">[<code>Boolean/Number delay</code>]</span> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Try to focus this component.</div><div class="long">Try to focus this component.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>selectText</code> : Boolean<div class="sub-desc">(optional) If applicable, true to also select the text in this component</div></li><li><code>delay</code> : Boolean/Number<div class="sub-desc">(optional) Delay the focus this number of milliseconds (true for 10 milliseconds)</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#focus" ext:member="#focus" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-get"></a><b><a href="source/Container.html#method-Ext.Container-get">get</a></b>( <code>String/Number key</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Get a component contained by this container (alias for items.get(key))</div><div class="long">Get a component contained by this container (alias for items.get(key))<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>key</code> : String/Number<div class="sub-desc">The index or id of the component</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">Ext.Component</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#get" ext:member="#get" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-getBox"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-getBox">getBox</a></b>( <span title="Optional" class="optional">[<code>Boolean local</code>]</span> )\r
+ :\r
+ Object<div class="mdesc"><div class="short">Gets the current box measurements of the component's underlying element.</div><div class="long">Gets the current box measurements of the component's underlying element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>local</code> : Boolean<div class="sub-desc">(optional) If true the element's left and top are returned instead of page XY (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li><code>Object</code><div class="sub-desc">box An object in the format {x, y, width, height}</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#getBox" ext:member="#getBox" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-getBubbleTarget"></a><b><a href="source/Component.html#method-Ext.Component-getBubbleTarget">getBubbleTarget</a></b>()\r
+ :\r
+ Ext.Container<div class="mdesc"><div class="short">Provides the link for Observable's fireEvent method to bubble up the ownership hierarchy.</div><div class="long">Provides the link for Observable's fireEvent method to bubble up the ownership hierarchy.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Container</code><div class="sub-desc">the Container which owns this Component.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#getBubbleTarget" ext:member="#getBubbleTarget" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-getComponent"></a><b><a href="source/Container.html#method-Ext.Container-getComponent">getComponent</a></b>( <code>String/Number comp</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Examines this container's items property\r
+and gets a direct child component of this container.</div><div class="long">Examines this container's <code><a href="output/Ext.Container.html#Ext.Container-items" ext:member="items" ext:cls="Ext.Container">items</a></code> <b>property</b>
+and gets a direct child component of this container.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>comp</code> : String/Number<div class="sub-desc">This parameter may be any of the following:
+<div><ul class="mdetail-params">
+<li>a <b><code>String</code></b> : representing the <code><a href="output/Ext.Component.html#Ext.Component-itemId" ext:member="itemId" ext:cls="Ext.Component">itemId</a></code>
+or <code><a href="output/Ext.Component.html#Ext.Component-id" ext:member="id" ext:cls="Ext.Component">id</a></code> of the child component </li>
+<li>a <b><code>Number</code></b> : representing the position of the child component
+within the <code><a href="output/Ext.Container.html#Ext.Container-items" ext:member="items" ext:cls="Ext.Container">items</a></code> <b>property</b></li>
+</ul></div>
+<p>For additional information see <a href="output/Ext.util.MixedCollection.html#Ext.util.MixedCollection-get" ext:member="get" ext:cls="Ext.util.MixedCollection">Ext.util.MixedCollection.get</a>.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">The component (if found).</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#getComponent" ext:member="#getComponent" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-getEl"></a><b><a href="source/Component.html#method-Ext.Component-getEl">getEl</a></b>()\r
+ :\r
+ Ext.Element<div class="mdesc"><div class="short">Returns the Ext.Element which encapsulates this Component.\r
+This will usually be a &lt;DIV> element created by the cla...</div><div class="long"><p>Returns the <a href="output/Ext.Element.html" ext:cls="Ext.Element">Ext.Element</a> which encapsulates this Component.</p>
+<p>This will <i>usually</i> be a <DIV> element created by the class's onRender method, but
+that may be overridden using the <a href="output/Ext.Component.html#Ext.Component-autoEl" ext:member="autoEl" ext:cls="Ext.Component">autoEl</a> config.</p>
+<br><p><b>Note</b>: this element will not be available until this Component has been rendered.</p><br>
+<p>To add listeners for <b>DOM events</b> to this Component (as opposed to listeners
+for this Component's own Observable events), see the <a href="output/Ext.Component.html#Ext.Component-listeners" ext:member="listeners" ext:cls="Ext.Component">listeners</a> config for a suggestion,
+or use a render listener directly:</p><pre><code><b>new</b> Ext.Panel({
+ title: <em>'The Clickable Panel'</em>,
+ listeners: {
+ render: <b>function</b>(p) {
+ <i>// Append the Panel to the click handler's argument list.</i>
+ p.getEl().on(<em>'click'</em>, handlePanelClick.createDelegate(null, [p], true));
+ },
+ single: true <i>// Remove the listener after first invocation</i>
+ }
+});</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The Element which encapsulates this Component.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#getEl" ext:member="#getEl" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-getHeight"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-getHeight">getHeight</a></b>()\r
+ :\r
+ Number<div class="mdesc"><div class="short">Gets the current height of the component's underlying element.</div><div class="long">Gets the current height of the component's underlying element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Number</code><div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#getHeight" ext:member="#getHeight" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-getId"></a><b><a href="source/Component.html#method-Ext.Component-getId">getId</a></b>()\r
+ :\r
+ String<div class="mdesc"><div class="short">Returns the id of this component or automatically generates and\r
+returns an id if an id is not defined yet:'ext-comp-'...</div><div class="long">Returns the <code>id</code> of this component or automatically generates and
+returns an <code>id</code> if an <code>id</code> is not defined yet:<pre><code><em>'ext-comp-'</em> + (++Ext.Component.AUTO_ID)</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">id</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#getId" ext:member="#getId" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-getItemId"></a><b><a href="source/Component.html#method-Ext.Component-getItemId">getItemId</a></b>()\r
+ :\r
+ String<div class="mdesc"><div class="short">Returns the itemId of this component. If an\r
+itemId was not assigned through configuration the\r
+id is returned using g...</div><div class="long">Returns the <code><a href="output/Ext.Component.html#Ext.Component-itemId" ext:member="itemId" ext:cls="Ext.Component">itemId</a></code> of this component. If an
+<code><a href="output/Ext.Component.html#Ext.Component-itemId" ext:member="itemId" ext:cls="Ext.Component">itemId</a></code> was not assigned through configuration the
+<code>id</code> is returned using <code><a href="output/Ext.Component.html#Ext.Component-getId" ext:member="getId" ext:cls="Ext.Component">getId</a></code>.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#getItemId" ext:member="#getItemId" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-getLayout"></a><b><a href="source/Container.html#method-Ext.Container-getLayout">getLayout</a></b>()\r
+ :\r
+ ContainerLayout<div class="mdesc"><div class="short">Returns the layout currently in use by the container. If the container does not currently have a layout\r
+set, a defau...</div><div class="long">Returns the layout currently in use by the container. If the container does not currently have a layout
+set, a default <a href="output/Ext.layout.ContainerLayout.html" ext:cls="Ext.layout.ContainerLayout">Ext.layout.ContainerLayout</a> will be created and set as the container's layout.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>ContainerLayout</code><div class="sub-desc">layout The container's layout</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#getLayout" ext:member="#getLayout" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-getLayoutTarget"></a><b><a href="source/Container.html#method-Ext.Container-getLayoutTarget">getLayoutTarget</a></b>()\r
+ :\r
+ Ext.Element<div class="mdesc"><div class="short">Returns the Element to be used to contain the child Components of this Container.\r
+An implementation is provided which...</div><div class="long"><p>Returns the Element to be used to contain the child Components of this Container.</p>
+<p>An implementation is provided which returns the Container's <a href="output/Ext.Container.html#Ext.Container-getEl" ext:member="getEl" ext:cls="Ext.Container">Element</a>, but
+if there is a more complex structure to a Container, this may be overridden to return
+the element into which the <a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a> renders child Components.</p><div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The Element to render child Components into.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#getLayoutTarget" ext:member="#getLayoutTarget" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-getOuterSize"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-getOuterSize">getOuterSize</a></b>()\r
+ :\r
+ Object<div class="mdesc"><div class="short">Gets the current size of the component's underlying element, including space taken by its margins.</div><div class="long">Gets the current size of the component's underlying element, including space taken by its margins.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Object</code><div class="sub-desc">An object containing the element's size {width: (element width + left/right margins), height: (element height + top/bottom margins)}</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#getOuterSize" ext:member="#getOuterSize" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-getPosition"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-getPosition">getPosition</a></b>( <span title="Optional" class="optional">[<code>Boolean local</code>]</span> )\r
+ :\r
+ Array<div class="mdesc"><div class="short">Gets the current XY position of the component's underlying element.</div><div class="long">Gets the current XY position of the component's underlying element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>local</code> : Boolean<div class="sub-desc">(optional) If true the element's left and top are returned instead of page XY (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">The XY position of the element (e.g., [100, 200])</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#getPosition" ext:member="#getPosition" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-getResizeEl"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-getResizeEl">getResizeEl</a></b>()\r
+ :\r
+ Ext.Element<div class="mdesc"><div class="short">Returns the outermost Element of this Component which defines the Components overall size.\r
+Usually this will return t...</div><div class="long"><p>Returns the outermost Element of this Component which defines the Components overall size.</p>
+<p><i>Usually</i> this will return the same Element as <code><a href="output/Ext.BoxComponent.html#Ext.BoxComponent-getEl" ext:member="getEl" ext:cls="Ext.BoxComponent">getEl</a></code>,
+but in some cases, a Component may have some more wrapping Elements around its main
+active Element.</p>
+<p>An example is a ComboBox. It is encased in a <i>wrapping</i> Element which
+contains both the <code><input></code> Element (which is what would be returned
+by its <code><a href="output/Ext.BoxComponent.html#Ext.BoxComponent-getEl" ext:member="getEl" ext:cls="Ext.BoxComponent">getEl</a></code> method, <i>and</i> the trigger button Element.
+This Element is returned as the <code>resizeEl</code>.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Element</code><div class="sub-desc">The Element which is to be resized by size managing layouts.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#getResizeEl" ext:member="#getResizeEl" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-getSize"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-getSize">getSize</a></b>()\r
+ :\r
+ Object<div class="mdesc"><div class="short">Gets the current size of the component's underlying element.</div><div class="long">Gets the current size of the component's underlying element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Object</code><div class="sub-desc">An object containing the element's size {width: (element width), height: (element height)}</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#getSize" ext:member="#getSize" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-getWidth"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-getWidth">getWidth</a></b>()\r
+ :\r
+ Number<div class="mdesc"><div class="short">Gets the current width of the component's underlying element.</div><div class="long">Gets the current width of the component's underlying element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Number</code><div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#getWidth" ext:member="#getWidth" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-getXType"></a><b><a href="source/Component.html#method-Ext.Component-getXType">getXType</a></b>()\r
+ :\r
+ String<div class="mdesc"><div class="short">Gets the xtype for this component as registered with Ext.ComponentMgr. For a list of all\r
+available xtypes, see the Ex...</div><div class="long">Gets the xtype for this component as registered with <a href="output/Ext.ComponentMgr.html" ext:cls="Ext.ComponentMgr">Ext.ComponentMgr</a>. For a list of all
+available xtypes, see the <a href="output/Ext.Component.html" ext:cls="Ext.Component">Ext.Component</a> header. Example usage:
+<pre><code><b>var</b> t = <b>new</b> Ext.form.TextField();
+alert(t.getXType()); <i>// alerts <em>'textfield'</em></i></code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">The xtype</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#getXType" ext:member="#getXType" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-getXTypes"></a><b><a href="source/Component.html#method-Ext.Component-getXTypes">getXTypes</a></b>()\r
+ :\r
+ String<div class="mdesc"><div class="short">Returns this Component's xtype hierarchy as a slash-delimited string. For a list of all\r
+available xtypes, see the Ext...</div><div class="long"><p>Returns this Component's xtype hierarchy as a slash-delimited string. For a list of all
+available xtypes, see the <a href="output/Ext.Component.html" ext:cls="Ext.Component">Ext.Component</a> header.</p>
+<p><b>If using your own subclasses, be aware that a Component must register its own xtype
+to participate in determination of inherited xtypes.</b></p>
+<p>Example usage:</p>
+<pre><code><b>var</b> t = <b>new</b> Ext.form.TextField();
+alert(t.getXTypes()); <i>// alerts <em>'component/box/field/textfield'</em></i></code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">The xtype hierarchy string</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#getXTypes" ext:member="#getXTypes" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-hasListener"></a><b><a href="source/Observable.html#method-Ext.util.Observable-hasListener">hasListener</a></b>( <code>String eventName</code> )\r
+ :\r
+ Boolean<div class="mdesc"><div class="short">Checks to see if this object has any listeners for a specified event</div><div class="long">Checks to see if this object has any listeners for a specified event<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The name of the event to check for</div></li></ul><strong>Returns:</strong><ul><li><code>Boolean</code><div class="sub-desc">True if the event is being listened for, else false</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#hasListener" ext:member="#hasListener" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-hide"></a><b><a href="source/Menu.html#method-Ext.menu.Menu-hide">hide</a></b>( <span title="Optional" class="optional">[<code>Boolean deep</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Hides this menu and optionally all parent menus</div><div class="long">Hides this menu and optionally all parent menus<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>deep</code> : Boolean<div class="sub-desc">(optional) True to hide all parent menus recursively, if any (defaults to false)</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#hide" ext:member="#hide" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-insert"></a><b><a href="source/Container.html#method-Ext.Container-insert">insert</a></b>( <code>Number index</code>, <code>Ext.Component component</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Inserts a Component into this Container at a specified index. Fires the\r
+beforeadd event before inserting, then fires ...</div><div class="long">Inserts a Component into this Container at a specified index. Fires the
+<a href="output/Ext.Container.html#Ext.Container-beforeadd" ext:member="beforeadd" ext:cls="Ext.Container">beforeadd</a> event before inserting, then fires the <a href="output/Ext.Container.html#Ext.Container-add" ext:member="add" ext:cls="Ext.Container">add</a> event after the
+Component has been inserted.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>index</code> : Number<div class="sub-desc">The index at which the Component will be inserted
+into the Container's items collection</div></li><li><code>component</code> : Ext.Component<div class="sub-desc">The child Component to insert.<br><br>
+Ext uses lazy rendering, and will only render the inserted Component should
+it become necessary.<br><br>
+A Component config object may be passed in order to avoid the overhead of
+constructing a real Component object if lazy rendering might mean that the
+inserted Component will not be rendered immediately. To take advantage of
+this 'lazy instantiation', set the <a href="output/Ext.Component.html#Ext.Component-xtype" ext:member="xtype" ext:cls="Ext.Component">Ext.Component.xtype</a> config
+property to the registered type of the Component wanted.<br><br>
+For a list of all available xtypes, see <a href="output/Ext.Component.html" ext:cls="Ext.Component">Ext.Component</a>.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">component The Component (or config object) that was\r
+inserted with the Container's default config values applied.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#insert" ext:member="#insert" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-isVisible"></a><b><a href="source/Component.html#method-Ext.Component-isVisible">isVisible</a></b>()\r
+ :\r
+ Boolean<div class="mdesc"><div class="short">Returns true if this component is visible.</div><div class="long">Returns true if this component is visible.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Boolean</code><div class="sub-desc">True if this component is visible, false otherwise.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#isVisible" ext:member="#isVisible" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-isXType"></a><b><a href="source/Component.html#method-Ext.Component-isXType">isXType</a></b>( <code>String xtype</code>, <span title="Optional" class="optional">[<code>Boolean shallow</code>]</span> )\r
+ :\r
+ Boolean<div class="mdesc"><div class="short">Tests whether or not this Component is of a specific xtype. This can test whether this Component is descended\r
+from th...</div><div class="long"><p>Tests whether or not this Component is of a specific xtype. This can test whether this Component is descended
+from the xtype (default) or whether it is directly of the xtype specified (shallow = true).</p>
+<p><b>If using your own subclasses, be aware that a Component must register its own xtype
+to participate in determination of inherited xtypes.</b></p>
+<p>For a list of all available xtypes, see the <a href="output/Ext.Component.html" ext:cls="Ext.Component">Ext.Component</a> header.</p>
+<p>Example usage:</p>
+<pre><code><b>var</b> t = <b>new</b> Ext.form.TextField();
+<b>var</b> isText = t.isXType(<em>'textfield'</em>); <i>// true</i>
+<b>var</b> isBoxSubclass = t.isXType(<em>'box'</em>); <i>// true, descended from BoxComponent</i>
+<b>var</b> isBoxInstance = t.isXType(<em>'box'</em>, true); <i>// false, not a direct BoxComponent instance</i></code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>xtype</code> : String<div class="sub-desc">The xtype to check for this Component</div></li><li><code>shallow</code> : Boolean<div class="sub-desc">(optional) False to check whether this Component is descended from the xtype (this is
+the default), or true to check whether this Component is directly of the specified xtype.</div></li></ul><strong>Returns:</strong><ul><li><code>Boolean</code><div class="sub-desc">True if this component descends from the specified xtype, false otherwise.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#isXType" ext:member="#isXType" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-mon"></a><b><a href="source/Component.html#method-Ext.Component-mon">mon</a></b>( <code>Observable|Element item</code>, <code>Object|String ename</code>, <code>Function fn</code>, <code>Object scope</code>, <code>Object opt</code> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Adds listeners to any Observable object (or Elements) which are automatically removed when this Component\r
+is destroye...</div><div class="long"><p>Adds listeners to any Observable object (or Elements) which are automatically removed when this Component
+is destroyed. Usage:</p><code><pre>
+myGridPanel.mon(myGridPanel.getSelectionModel(), <em>'selectionchange'</em>, handleSelectionChange, null, {buffer: 50});
+</pre></code>
+<p>or:</p><code><pre>
+myGridPanel.mon(myGridPanel.getSelectionModel(), {
+ selectionchange: handleSelectionChange,
+ buffer: 50
+});
+</pre></code><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>item</code> : Observable|Element<div class="sub-desc">The item to which to add a listener/listeners.</div></li><li><code>ename</code> : Object|String<div class="sub-desc">The event name, or an object containing event name properties.</div></li><li><code>fn</code> : Function<div class="sub-desc">Optional. If the <code>ename</code> parameter was an event name, this
+is the handler function.</div></li><li><code>scope</code> : Object<div class="sub-desc">Optional. If the <code>ename</code> parameter was an event name, this
+is the scope (<code>this</code> reference) in which the handler function is executed.</div></li><li><code>opt</code> : Object<div class="sub-desc">Optional. If the <code>ename</code> parameter was an event name, this
+is the <a href="output/Ext.util.Observable.html#Ext.util.Observable-addListener" ext:member="addListener" ext:cls="Ext.util.Observable">addListener</a> options.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#mon" ext:member="#mon" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-mun"></a><b><a href="source/Component.html#method-Ext.Component-mun">mun</a></b>( <code>Observable|Element item</code>, <code>Object|String ename</code>, <code>Function fn</code>, <code>Object scope</code> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Removes listeners that were added by the mon method.</div><div class="long">Removes listeners that were added by the <a href="output/Ext.Component.html#Ext.Component-mon" ext:member="mon" ext:cls="Ext.Component">mon</a> method.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>item</code> : Observable|Element<div class="sub-desc">The item from which to remove a listener/listeners.</div></li><li><code>ename</code> : Object|String<div class="sub-desc">The event name, or an object containing event name properties.</div></li><li><code>fn</code> : Function<div class="sub-desc">Optional. If the <code>ename</code> parameter was an event name, this
+is the handler function.</div></li><li><code>scope</code> : Object<div class="sub-desc">Optional. If the <code>ename</code> parameter was an event name, this
+is the scope (<code>this</code> reference) in which the handler function is executed.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#mun" ext:member="#mun" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-nextSibling"></a><b><a href="source/Component.html#method-Ext.Component-nextSibling">nextSibling</a></b>()\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Returns the next component in the owning container</div><div class="long">Returns the next component in the owning container<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#nextSibling" ext:member="#nextSibling" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-on"></a><b><a href="source/Observable.html#method-Ext.util.Observable-on">on</a></b>( <code>String eventName</code>, <code>Function handler</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span>, <span title="Optional" class="optional">[<code>Object options</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Appends an event handler to this object (shorthand for addListener.)</div><div class="long">Appends an event handler to this object (shorthand for <a href="output/Ext.util.Observable.html#Ext.util.Observable-addListener" ext:member="addListener" ext:cls="Ext.util.Observable">addListener</a>.)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The type of event to listen for</div></li><li><code>handler</code> : Function<div class="sub-desc">The method the event invokes</div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope (<code><b>this</b></code> reference) in which the handler function is executed.
+<b>If omitted, defaults to the object which fired the event.</b></div></li><li><code>options</code> : Object<div class="sub-desc">(optional) An object containing handler configuration.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#on" ext:member="#on" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-previousSibling"></a><b><a href="source/Component.html#method-Ext.Component-previousSibling">previousSibling</a></b>()\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Returns the previous component in the owning container</div><div class="long">Returns the previous component in the owning container<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#previousSibling" ext:member="#previousSibling" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-purgeListeners"></a><b><a href="source/Observable.html#method-Ext.util.Observable-purgeListeners">purgeListeners</a></b>()\r
+ :\r
+ void<div class="mdesc"><div class="short">Removes all listeners for this object</div><div class="long">Removes all listeners for this object<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#purgeListeners" ext:member="#purgeListeners" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-relayEvents"></a><b><a href="source/Observable-more.html#method-Ext.util.Observable-relayEvents">relayEvents</a></b>( <code>Object o</code>, <code>Array events</code> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Relays selected events from the specified Observable as if the events were fired by this.</div><div class="long">Relays selected events from the specified Observable as if the events were fired by <tt><b>this</b></tt>.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>o</code> : Object<div class="sub-desc">The Observable whose events this object is to relay.</div></li><li><code>events</code> : Array<div class="sub-desc">Array of event names to relay.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#relayEvents" ext:member="#relayEvents" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-remove"></a><b><a href="source/Container.html#method-Ext.Container-remove">remove</a></b>( <code>Component/String component</code>, <span title="Optional" class="optional">[<code>Boolean autoDestroy</code>]</span> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Removes a component from this container. Fires the beforeremove event before removing, then fires\r
+the remove event a...</div><div class="long">Removes a component from this container. Fires the <a href="output/Ext.Container.html#Ext.Container-beforeremove" ext:member="beforeremove" ext:cls="Ext.Container">beforeremove</a> event before removing, then fires
+the <a href="output/Ext.Container.html#Ext.Container-remove" ext:member="remove" ext:cls="Ext.Container">remove</a> event after the component has been removed.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>component</code> : Component/String<div class="sub-desc">The component reference or id to remove.</div></li><li><code>autoDestroy</code> : Boolean<div class="sub-desc">(optional) True to automatically invoke the removed Component's <a href="output/Ext.Component.html#Ext.Component-destroy" ext:member="destroy" ext:cls="Ext.Component">Ext.Component.destroy</a> function.
+Defaults to the value of this Container's <a href="output/Ext.Container.html#Ext.Container-autoDestroy" ext:member="autoDestroy" ext:cls="Ext.Container">autoDestroy</a> config.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">component The Component that was removed.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#remove" ext:member="#remove" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-removeAll"></a><b><a href="source/Container.html#method-Ext.Container-removeAll">removeAll</a></b>( <span title="Optional" class="optional">[<code>Boolean autoDestroy</code>]</span> )\r
+ :\r
+ Array<div class="mdesc"><div class="short">Removes all components from this container.</div><div class="long">Removes all components from this container.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>autoDestroy</code> : Boolean<div class="sub-desc">(optional) True to automatically invoke the removed Component's <a href="output/Ext.Component.html#Ext.Component-destroy" ext:member="destroy" ext:cls="Ext.Component">Ext.Component.destroy</a> function.
+Defaults to the value of this Container's <a href="output/Ext.Container.html#Ext.Container-autoDestroy" ext:member="autoDestroy" ext:cls="Ext.Container">autoDestroy</a> config.</div></li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">Array of the destroyed components</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#removeAll" ext:member="#removeAll" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-removeClass"></a><b><a href="source/Component.html#method-Ext.Component-removeClass">removeClass</a></b>( <code>string cls</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Removes a CSS class from the component's underlying element.</div><div class="long">Removes a CSS class from the component's underlying element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>cls</code> : string<div class="sub-desc">The CSS class name to remove</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#removeClass" ext:member="#removeClass" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-removeListener"></a><b><a href="source/Observable.html#method-Ext.util.Observable-removeListener">removeListener</a></b>( <code>String eventName</code>, <code>Function handler</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Removes an event handler.</div><div class="long">Removes an event handler.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The type of event the handler was associated with.</div></li><li><code>handler</code> : Function<div class="sub-desc">The handler to remove. <b>This must be a reference to the function passed into the <a href="output/Ext.util.Observable.html#Ext.util.Observable-addListener" ext:member="addListener" ext:cls="Ext.util.Observable">addListener</a> call.</b></div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope originally specified for the handler.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#removeListener" ext:member="#removeListener" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-render"></a><b><a href="source/Component.html#method-Ext.Component-render">render</a></b>( <span title="Optional" class="optional">[<code>Element/HTMLElement/String container</code>]</span>, <span title="Optional" class="optional">[<code>String/Number position</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Render this Component into the passed HTML element.\r
+If you are using a Container object to house this Component, then...</div><div class="long"><p>Render this Component into the passed HTML element.</p>
+<p><b>If you are using a <a href="output/Ext.Container.html" ext:cls="Ext.Container">Container</a> object to house this Component, then
+do not use the render method.</b></p>
+<p>A Container's child Components are rendered by that Container's
+<a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a> manager when the Container is first rendered.</p>
+<p>Certain layout managers allow dynamic addition of child components. Those that do
+include <a href="output/Ext.layout.CardLayout.html" ext:cls="Ext.layout.CardLayout">Ext.layout.CardLayout</a>, <a href="output/Ext.layout.AnchorLayout.html" ext:cls="Ext.layout.AnchorLayout">Ext.layout.AnchorLayout</a>,
+<a href="output/Ext.layout.FormLayout.html" ext:cls="Ext.layout.FormLayout">Ext.layout.FormLayout</a>, <a href="output/Ext.layout.TableLayout.html" ext:cls="Ext.layout.TableLayout">Ext.layout.TableLayout</a>.</p>
+<p>If the Container is already rendered when a new child Component is added, you may need to call
+the Container's <a href="output/Ext.Container.html#Ext.Container-doLayout" ext:member="doLayout" ext:cls="Ext.Container">doLayout</a> to refresh the view which causes any
+unrendered child Components to be rendered. This is required so that you can add multiple
+child components if needed while only refreshing the layout once.</p>
+<p>When creating complex UIs, it is important to remember that sizing and positioning
+of child items is the responsibility of the Container's <a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a> manager.
+If you expect child items to be sized in response to user interactions, you must
+configure the Container with a layout manager which creates and manages the type of layout you
+have in mind.</p>
+<p><b>Omitting the Container's <a href="output/Ext.Container.html#Ext.Container-layout" ext:member="layout" ext:cls="Ext.Container">layout</a> config means that a basic
+layout manager is used which does nothing but render child components sequentially into the
+Container. No sizing or positioning will be performed in this situation.</b></p><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>container</code> : Element/HTMLElement/String<div class="sub-desc">(optional) The element this Component should be
+rendered into. If it is being created from existing markup, this should be omitted.</div></li><li><code>position</code> : String/Number<div class="sub-desc">(optional) The element ID or DOM node index within the container <b>before</b>
+which this component will be inserted (defaults to appending to the end of the container)</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#render" ext:member="#render" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-resumeEvents"></a><b><a href="source/Observable.html#method-Ext.util.Observable-resumeEvents">resumeEvents</a></b>()\r
+ :\r
+ void<div class="mdesc"><div class="short">Resume firing events. (see suspendEvents)\r
+If events were suspended using the queueSuspended parameter, then all\r
+event...</div><div class="long">Resume firing events. (see <a href="output/Ext.util.Observable.html#Ext.util.Observable-suspendEvents" ext:member="suspendEvents" ext:cls="Ext.util.Observable">suspendEvents</a>)
+If events were suspended using the <tt><b>queueSuspended</b></tt> parameter, then all
+events fired during event suspension will be sent to any listeners now.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#resumeEvents" ext:member="#resumeEvents" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-setAutoScroll"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-setAutoScroll">setAutoScroll</a></b>( <code>Boolean scroll</code> )\r
+ :\r
+ Ext.BoxComponent<div class="mdesc"><div class="short">Sets the overflow on the content element of the component.</div><div class="long">Sets the overflow on the content element of the component.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>scroll</code> : Boolean<div class="sub-desc">True to allow the Component to auto scroll.</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.BoxComponent</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#setAutoScroll" ext:member="#setAutoScroll" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-setDisabled"></a><b><a href="source/Component.html#method-Ext.Component-setDisabled">setDisabled</a></b>( <code>Boolean disabled</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Convenience function for setting disabled/enabled by boolean.</div><div class="long">Convenience function for setting disabled/enabled by boolean.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>disabled</code> : Boolean<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#setDisabled" ext:member="#setDisabled" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-setHeight"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-setHeight">setHeight</a></b>( <code>Number height</code> )\r
+ :\r
+ Ext.BoxComponent<div class="mdesc"><div class="short">Sets the height of the component. This method fires the resize event.</div><div class="long">Sets the height of the component. This method fires the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-resize" ext:member="resize" ext:cls="Ext.BoxComponent">resize</a> event.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>height</code> : Number<div class="sub-desc">The new height to set. This may be one of:<div class="mdetail-params"><ul>
+<li>A Number specifying the new height in the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-getEl" ext:member="getEl" ext:cls="Ext.BoxComponent">Element</a>'s <a href="output/Ext.Element.html#Ext.Element-defaultUnit" ext:member="defaultUnit" ext:cls="Ext.Element">Ext.Element.defaultUnit</a>s (by default, pixels).</li>
+<li>A String used to set the CSS height style.</li>
+<li><i>undefined</i> to leave the height unchanged.</li>
+</ul></div></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.BoxComponent</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#setHeight" ext:member="#setHeight" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-setPagePosition"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-setPagePosition">setPagePosition</a></b>( <code>Number x</code>, <code>Number y</code> )\r
+ :\r
+ Ext.BoxComponent<div class="mdesc"><div class="short">Sets the page XY position of the component. To set the left and top instead, use setPosition.\r
+This method fires the ...</div><div class="long">Sets the page XY position of the component. To set the left and top instead, use <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-setPosition" ext:member="setPosition" ext:cls="Ext.BoxComponent">setPosition</a>.
+This method fires the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-move" ext:member="move" ext:cls="Ext.BoxComponent">move</a> event.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>x</code> : Number<div class="sub-desc">The new x position</div></li><li><code>y</code> : Number<div class="sub-desc">The new y position</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.BoxComponent</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#setPagePosition" ext:member="#setPagePosition" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-setPosition"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-setPosition">setPosition</a></b>( <code>Number left</code>, <code>Number top</code> )\r
+ :\r
+ Ext.BoxComponent<div class="mdesc"><div class="short">Sets the left and top of the component. To set the page XY position instead, use setPagePosition.\r
+This method fires ...</div><div class="long">Sets the left and top of the component. To set the page XY position instead, use <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-setPagePosition" ext:member="setPagePosition" ext:cls="Ext.BoxComponent">setPagePosition</a>.
+This method fires the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-move" ext:member="move" ext:cls="Ext.BoxComponent">move</a> event.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>left</code> : Number<div class="sub-desc">The new left</div></li><li><code>top</code> : Number<div class="sub-desc">The new top</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.BoxComponent</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#setPosition" ext:member="#setPosition" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-setSize"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-setSize">setSize</a></b>( <code>Mixed width</code>, <code>Mixed height</code> )\r
+ :\r
+ Ext.BoxComponent<div class="mdesc"><div class="short">Sets the width and height of this BoxComponent. This method fires the resize event. This method can accept\r
+either wid...</div><div class="long">Sets the width and height of this BoxComponent. This method fires the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-resize" ext:member="resize" ext:cls="Ext.BoxComponent">resize</a> event. This method can accept
+either width and height as separate arguments, or you can pass a size object like <code>{width:10, height:20}</code>.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>width</code> : Mixed<div class="sub-desc">The new width to set. This may be one of:<div class="mdetail-params"><ul>
+<li>A Number specifying the new width in the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-getEl" ext:member="getEl" ext:cls="Ext.BoxComponent">Element</a>'s <a href="output/Ext.Element.html#Ext.Element-defaultUnit" ext:member="defaultUnit" ext:cls="Ext.Element">Ext.Element.defaultUnit</a>s (by default, pixels).</li>
+<li>A String used to set the CSS width style.</li>
+<li>A size object in the format <code>{width: widthValue, height: heightValue}</code>.</li>
+<li><code>undefined</code> to leave the width unchanged.</li>
+</ul></div></div></li><li><code>height</code> : Mixed<div class="sub-desc">The new height to set (not required if a size object is passed as the first arg).
+This may be one of:<div class="mdetail-params"><ul>
+<li>A Number specifying the new height in the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-getEl" ext:member="getEl" ext:cls="Ext.BoxComponent">Element</a>'s <a href="output/Ext.Element.html#Ext.Element-defaultUnit" ext:member="defaultUnit" ext:cls="Ext.Element">Ext.Element.defaultUnit</a>s (by default, pixels).</li>
+<li>A String used to set the CSS height style. Animation may <b>not</b> be used.</li>
+<li><code>undefined</code> to leave the height unchanged.</li>
+</ul></div></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.BoxComponent</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#setSize" ext:member="#setSize" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-setVisible"></a><b><a href="source/Component.html#method-Ext.Component-setVisible">setVisible</a></b>( <code>Boolean visible</code> )\r
+ :\r
+ Ext.Component<div class="mdesc"><div class="short">Convenience function to hide or show this component by boolean.</div><div class="long">Convenience function to hide or show this component by boolean.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>visible</code> : Boolean<div class="sub-desc">True to show, false to hide</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.Component</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#setVisible" ext:member="#setVisible" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-setWidth"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-setWidth">setWidth</a></b>( <code>Number width</code> )\r
+ :\r
+ Ext.BoxComponent<div class="mdesc"><div class="short">Sets the width of the component. This method fires the resize event.</div><div class="long">Sets the width of the component. This method fires the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-resize" ext:member="resize" ext:cls="Ext.BoxComponent">resize</a> event.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>width</code> : Number<div class="sub-desc">The new width to setThis may be one of:<div class="mdetail-params"><ul>
+<li>A Number specifying the new width in the <a href="output/Ext.BoxComponent.html#Ext.BoxComponent-getEl" ext:member="getEl" ext:cls="Ext.BoxComponent">Element</a>'s <a href="output/Ext.Element.html#Ext.Element-defaultUnit" ext:member="defaultUnit" ext:cls="Ext.Element">Ext.Element.defaultUnit</a>s (by default, pixels).</li>
+<li>A String used to set the CSS width style.</li>
+</ul></div></div></li></ul><strong>Returns:</strong><ul><li><code>Ext.BoxComponent</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#setWidth" ext:member="#setWidth" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-show"></a><b><a href="source/Menu.html#method-Ext.menu.Menu-show">show</a></b>( <code>Mixed element</code>, <span title="Optional" class="optional">[<code>String position</code>]</span>, <span title="Optional" class="optional">[<code>Ext.menu.Menu parentMenu</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">If floating=true, shows this menu relative to\r
+another element using showat, otherwise uses Ext.Component.show.</div><div class="long">If <code><a href="output/Ext.menu.Menu.html#Ext.menu.Menu-floating" ext:member="floating" ext:cls="Ext.menu.Menu">floating</a>=true</code>, shows this menu relative to
+another element using <a href="output/Ext.menu.Menu.html#Ext.menu.Menu-showat" ext:member="showat" ext:cls="Ext.menu.Menu">showat</a>, otherwise uses <a href="output/Ext.Component.html#Ext.Component-show" ext:member="show" ext:cls="Ext.Component">Ext.Component.show</a>.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>element</code> : Mixed<div class="sub-desc">The element to align to</div></li><li><code>position</code> : String<div class="sub-desc">(optional) The <a href="output/Ext.Element.html#Ext.Element-alignTo" ext:member="alignTo" ext:cls="Ext.Element">Ext.Element.alignTo</a> anchor position to use in aligning to
+the element (defaults to this.defaultAlign)</div></li><li><code>parentMenu</code> : Ext.menu.Menu<div class="sub-desc">(optional) This menu's parent menu, if applicable (defaults to undefined)</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#show" ext:member="#show" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-showAt"></a><b><a href="source/Menu.html#method-Ext.menu.Menu-showAt">showAt</a></b>( <code>Array xyPosition</code>, <span title="Optional" class="optional">[<code>Ext.menu.Menu parentMenu</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Displays this menu at a specific xy position and fires the 'show' event if a\r
+handler for the 'beforeshow' event does ...</div><div class="long">Displays this menu at a specific xy position and fires the 'show' event if a
+handler for the 'beforeshow' event does not return false cancelling the operation.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>xyPosition</code> : Array<div class="sub-desc">Contains X & Y [x, y] values for the position at which to show the menu (coordinates are page-based)</div></li><li><code>parentMenu</code> : Ext.menu.Menu<div class="sub-desc">(optional) This menu's parent menu, if applicable (defaults to undefined)</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#showAt" ext:member="#showAt" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-suspendEvents"></a><b><a href="source/Observable.html#method-Ext.util.Observable-suspendEvents">suspendEvents</a></b>( <code>Boolean queueSuspended</code> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Suspend the firing of all events. (see resumeEvents)</div><div class="long">Suspend the firing of all events. (see <a href="output/Ext.util.Observable.html#Ext.util.Observable-resumeEvents" ext:member="resumeEvents" ext:cls="Ext.util.Observable">resumeEvents</a>)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>queueSuspended</code> : Boolean<div class="sub-desc">Pass as true to queue up suspended events to be fired
+after the <a href="output/Ext.util.Observable.html#Ext.util.Observable-resumeEvents" ext:member="resumeEvents" ext:cls="Ext.util.Observable">resumeEvents</a> call instead of discarding all suspended events;</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#suspendEvents" ext:member="#suspendEvents" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-syncSize"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-syncSize">syncSize</a></b>()\r
+ :\r
+ Ext.BoxComponent<div class="mdesc"><div class="short">Force the component's size to recalculate based on the underlying element's current height and width.</div><div class="long">Force the component's size to recalculate based on the underlying element's current height and width.<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Ext.BoxComponent</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#syncSize" ext:member="#syncSize" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.util.Observable-un"></a><b><a href="source/Observable.html#method-Ext.util.Observable-un">un</a></b>( <code>String eventName</code>, <code>Function handler</code>, <span title="Optional" class="optional">[<code>Object scope</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Removes an event handler (shorthand for removeListener.)</div><div class="long">Removes an event handler (shorthand for <a href="output/Ext.util.Observable.html#Ext.util.Observable-removeListener" ext:member="removeListener" ext:cls="Ext.util.Observable">removeListener</a>.)<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>eventName</code> : String<div class="sub-desc">The type of event the handler was associated with.</div></li><li><code>handler</code> : Function<div class="sub-desc">The handler to remove. <b>This must be a reference to the function passed into the <a href="output/Ext.util.Observable.html#Ext.util.Observable-addListener" ext:member="addListener" ext:cls="Ext.util.Observable">addListener</a> call.</b></div></li><li><code>scope</code> : Object<div class="sub-desc">(optional) The scope originally specified for the handler.</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.util.Observable.html#un" ext:member="#un" ext:cls="Ext.util.Observable">Observable</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-update"></a><b><a href="source/Component.html#method-Ext.Component-update">update</a></b>( <code>Mixed htmlOrData</code>, <span title="Optional" class="optional">[<code>Boolean loadScripts</code>]</span>, <span title="Optional" class="optional">[<code>Function callback</code>]</span> )\r
+ :\r
+ void<div class="mdesc"><div class="short">Update the content area of a component.</div><div class="long">Update the content area of a component.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>htmlOrData</code> : Mixed<div class="sub-desc">If this component has been configured with a template via the tpl config
+then it will use this argument as data to populate the template.
+If this component was not configured with a template, the components
+content area will be updated via Ext.Element update</div></li><li><code>loadScripts</code> : Boolean<div class="sub-desc">(optional) Only legitimate when using the html configuration. Defaults to false</div></li><li><code>callback</code> : Function<div class="sub-desc">(optional) Only legitimate when using the html configuration. Callback to execute when scripts have finished loading</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#update" ext:member="#update" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-updateBox"></a><b><a href="source/BoxComponent.html#method-Ext.BoxComponent-updateBox">updateBox</a></b>( <code>Object box</code> )\r
+ :\r
+ Ext.BoxComponent<div class="mdesc"><div class="short">Sets the current box measurements of the component's underlying element.</div><div class="long">Sets the current box measurements of the component's underlying element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>box</code> : Object<div class="sub-desc">An object in the format {x, y, width, height}</div></li></ul><strong>Returns:</strong><ul><li><code>Ext.BoxComponent</code><div class="sub-desc">this</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#updateBox" ext:member="#updateBox" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr></tbody></table><a id="Ext.menu.ColorMenu-events"></a><h2>Public Events</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Event</th><th class="msource-header">Defined By</th></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-add"></a><b><a href="source/Container.html#event-Ext.Container-add">add</a></b> :\r
+ ( <code>Ext.Container this</code>, <code>Ext.Component component</code>, <code>Number index</code> )\r
+ <div class="mdesc"><div class="short"></div><div class="long"><div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Container<div class="sub-desc"></div></li><li><code>component</code> : Ext.Component<div class="sub-desc">The component that was added</div></li><li><code>index</code> : Number<div class="sub-desc">The index at which the component was added to the container's items collection</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#add" ext:member="#add" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-added"></a><b><a href="source/Component.html#event-Ext.Component-added">added</a></b> :\r
+ ( <code>Ext.Component this</code>, <code>Ext.Container ownerCt</code>, <code>number index</code> )\r
+ <div class="mdesc"><div class="short">Fires when a component is added to an Ext.Container</div><div class="long">Fires when a component is added to an Ext.Container<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li><li><code>ownerCt</code> : Ext.Container<div class="sub-desc">Container which holds the component</div></li><li><code>index</code> : number<div class="sub-desc">Position at which the component was added</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#added" ext:member="#added" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-afterlayout"></a><b><a href="source/Container.html#event-Ext.Container-afterlayout">afterlayout</a></b> :\r
+ ( <code>Ext.Container this</code>, <code>ContainerLayout layout</code> )\r
+ <div class="mdesc"><div class="short">Fires when the components in this container are arranged by the associated layout manager.</div><div class="long">Fires when the components in this container are arranged by the associated layout manager.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Container<div class="sub-desc"></div></li><li><code>layout</code> : ContainerLayout<div class="sub-desc">The ContainerLayout implementation for this container</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#afterlayout" ext:member="#afterlayout" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-afterrender"></a><b><a href="source/Component.html#event-Ext.Component-afterrender">afterrender</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component rendering is finished.\r
+The afterrender event is fired after this Component has been rendere...</div><div class="long"><p>Fires after the component rendering is finished.</p>
+<p>The afterrender event is fired after this Component has been <a href="output/Ext.Component.html#Ext.Component-rendered" ext:member="rendered" ext:cls="Ext.Component">rendered</a>, been postprocesed
+by any afterRender method defined for the Component, and, if <a href="output/Ext.Component.html#Ext.Component-stateful" ext:member="stateful" ext:cls="Ext.Component">stateful</a>, after state
+has been restored.</p><div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#afterrender" ext:member="#afterrender" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-beforeadd"></a><b><a href="source/Container.html#event-Ext.Container-beforeadd">beforeadd</a></b> :\r
+ ( <code>Ext.Container this</code>, <code>Ext.Component component</code>, <code>Number index</code> )\r
+ <div class="mdesc"><div class="short">Fires before any Ext.Component is added or inserted into the container.\r
+A handler can return false to cancel the add.</div><div class="long">Fires before any <a href="output/Ext.Component.html" ext:cls="Ext.Component">Ext.Component</a> is added or inserted into the container.
+A handler can return false to cancel the add.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Container<div class="sub-desc"></div></li><li><code>component</code> : Ext.Component<div class="sub-desc">The component being added</div></li><li><code>index</code> : Number<div class="sub-desc">The index at which the component will be added to the container's items collection</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#beforeadd" ext:member="#beforeadd" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-beforedestroy"></a><b><a href="source/Component.html#event-Ext.Component-beforedestroy">beforedestroy</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires before the component is destroyed. Return false from an event handler to stop the destroy.</div><div class="long">Fires before the component is <a href="output/Ext.Component.html#Ext.Component-destroy" ext:member="destroy" ext:cls="Ext.Component">destroy</a>ed. Return false from an event handler to stop the <a href="output/Ext.Component.html#Ext.Component-destroy" ext:member="destroy" ext:cls="Ext.Component">destroy</a>.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#beforedestroy" ext:member="#beforedestroy" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-beforehide"></a><b><a href="source/Component.html#event-Ext.Component-beforehide">beforehide</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires before the component is hidden by calling the hide method.\r
+Return false from an event handler to stop the hide.</div><div class="long">Fires before the component is hidden by calling the <a href="output/Ext.Component.html#Ext.Component-hide" ext:member="hide" ext:cls="Ext.Component">hide</a> method.
+Return false from an event handler to stop the hide.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#beforehide" ext:member="#beforehide" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-beforeremove"></a><b><a href="source/Container.html#event-Ext.Container-beforeremove">beforeremove</a></b> :\r
+ ( <code>Ext.Container this</code>, <code>Ext.Component component</code> )\r
+ <div class="mdesc"><div class="short">Fires before any Ext.Component is removed from the container. A handler can return\r
+false to cancel the remove.</div><div class="long">Fires before any <a href="output/Ext.Component.html" ext:cls="Ext.Component">Ext.Component</a> is removed from the container. A handler can return
+false to cancel the remove.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Container<div class="sub-desc"></div></li><li><code>component</code> : Ext.Component<div class="sub-desc">The component being removed</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#beforeremove" ext:member="#beforeremove" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-beforerender"></a><b><a href="source/Component.html#event-Ext.Component-beforerender">beforerender</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires before the component is rendered. Return false from an\r
+event handler to stop the render.</div><div class="long">Fires before the component is <a href="output/Ext.Component.html#Ext.Component-rendered" ext:member="rendered" ext:cls="Ext.Component">rendered</a>. Return false from an
+event handler to stop the <a href="output/Ext.Component.html#Ext.Component-render" ext:member="render" ext:cls="Ext.Component">render</a>.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#beforerender" ext:member="#beforerender" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-beforeshow"></a><b><a href="source/Component.html#event-Ext.Component-beforeshow">beforeshow</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires before the component is shown by calling the show method.\r
+Return false from an event handler to stop the show.</div><div class="long">Fires before the component is shown by calling the <a href="output/Ext.Component.html#Ext.Component-show" ext:member="show" ext:cls="Ext.Component">show</a> method.
+Return false from an event handler to stop the show.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#beforeshow" ext:member="#beforeshow" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-beforestaterestore"></a><b><a href="source/Component.html#event-Ext.Component-beforestaterestore">beforestaterestore</a></b> :\r
+ ( <code>Ext.Component this</code>, <code>Object state</code> )\r
+ <div class="mdesc"><div class="short">Fires before the state of the component is restored. Return false from an event handler to stop the restore.</div><div class="long">Fires before the state of the component is restored. Return false from an event handler to stop the restore.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li><li><code>state</code> : Object<div class="sub-desc">The hash of state values returned from the StateProvider. If this
+event is not vetoed, then the state object is passed to <b><tt>applyState</tt></b>. By default,
+that simply copies property values into this Component. The method maybe overriden to
+provide custom state restoration.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#beforestaterestore" ext:member="#beforestaterestore" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-beforestatesave"></a><b><a href="source/Component.html#event-Ext.Component-beforestatesave">beforestatesave</a></b> :\r
+ ( <code>Ext.Component this</code>, <code>Object state</code> )\r
+ <div class="mdesc"><div class="short">Fires before the state of the component is saved to the configured state provider. Return false to stop the save.</div><div class="long">Fires before the state of the component is saved to the configured state provider. Return false to stop the save.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li><li><code>state</code> : Object<div class="sub-desc">The hash of state values. This is determined by calling
+<b><tt>getState()</tt></b> on the Component. This method must be provided by the
+developer to return whetever representation of state is required, by default, Ext.Component
+has a null implementation.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#beforestatesave" ext:member="#beforestatesave" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-destroy"></a><b><a href="source/Component.html#event-Ext.Component-destroy">destroy</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component is destroyed.</div><div class="long">Fires after the component is <a href="output/Ext.Component.html#Ext.Component-destroy" ext:member="destroy" ext:cls="Ext.Component">destroy</a>ed.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#destroy" ext:member="#destroy" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-disable"></a><b><a href="source/Component.html#event-Ext.Component-disable">disable</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component is disabled.</div><div class="long">Fires after the component is disabled.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#disable" ext:member="#disable" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-enable"></a><b><a href="source/Component.html#event-Ext.Component-enable">enable</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component is enabled.</div><div class="long">Fires after the component is enabled.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#enable" ext:member="#enable" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-hide"></a><b><a href="source/Component.html#event-Ext.Component-hide">hide</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component is hidden.\r
+Fires after the component is hidden when calling the hide method.</div><div class="long">Fires after the component is hidden.
+Fires after the component is hidden when calling the <a href="output/Ext.Component.html#Ext.Component-hide" ext:member="hide" ext:cls="Ext.Component">hide</a> method.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#hide" ext:member="#hide" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-mouseout"></a><b><a href="source/Menu.html#event-Ext.menu.Menu-mouseout">mouseout</a></b> :\r
+ ( <code>Ext.menu.Menu this</code>, <code>Ext.EventObject e</code>, <code>Ext.menu.Item menuItem</code> )\r
+ <div class="mdesc"><div class="short">Fires when the mouse exits this menu</div><div class="long">Fires when the mouse exits this menu<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li><li><code>e</code> : Ext.EventObject<div class="sub-desc"></div></li><li><code>menuItem</code> : Ext.menu.Item<div class="sub-desc">The menu item that was clicked</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#mouseout" ext:member="#mouseout" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.Menu-mouseover"></a><b><a href="source/Menu.html#event-Ext.menu.Menu-mouseover">mouseover</a></b> :\r
+ ( <code>Ext.menu.Menu this</code>, <code>Ext.EventObject e</code>, <code>Ext.menu.Item menuItem</code> )\r
+ <div class="mdesc"><div class="short">Fires when the mouse is hovering over this menu</div><div class="long">Fires when the mouse is hovering over this menu<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.menu.Menu<div class="sub-desc"></div></li><li><code>e</code> : Ext.EventObject<div class="sub-desc"></div></li><li><code>menuItem</code> : Ext.menu.Item<div class="sub-desc">The menu item that was clicked</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.menu.Menu.html#mouseover" ext:member="#mouseover" ext:cls="Ext.menu.Menu">Menu</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-move"></a><b><a href="source/BoxComponent.html#event-Ext.BoxComponent-move">move</a></b> :\r
+ ( <code>Ext.Component this</code>, <code>Number x</code>, <code>Number y</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component is moved.</div><div class="long">Fires after the component is moved.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li><li><code>x</code> : Number<div class="sub-desc">The new x position</div></li><li><code>y</code> : Number<div class="sub-desc">The new y position</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#move" ext:member="#move" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Container-remove"></a><b><a href="source/Container.html#event-Ext.Container-remove">remove</a></b> :\r
+ ( <code>Ext.Container this</code>, <code>Ext.Component component</code> )\r
+ <div class="mdesc"><div class="short"></div><div class="long"><div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Container<div class="sub-desc"></div></li><li><code>component</code> : Ext.Component<div class="sub-desc">The component that was removed</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Container.html#remove" ext:member="#remove" ext:cls="Ext.Container">Container</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-removed"></a><b><a href="source/Component.html#event-Ext.Component-removed">removed</a></b> :\r
+ ( <code>Ext.Component this</code>, <code>Ext.Container ownerCt</code> )\r
+ <div class="mdesc"><div class="short">Fires when a component is removed from an Ext.Container</div><div class="long">Fires when a component is removed from an Ext.Container<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li><li><code>ownerCt</code> : Ext.Container<div class="sub-desc">Container which holds the component</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#removed" ext:member="#removed" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-render"></a><b><a href="source/Component.html#event-Ext.Component-render">render</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component markup is rendered.</div><div class="long">Fires after the component markup is <a href="output/Ext.Component.html#Ext.Component-rendered" ext:member="rendered" ext:cls="Ext.Component">rendered</a>.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#render" ext:member="#render" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.BoxComponent-resize"></a><b><a href="source/BoxComponent.html#event-Ext.BoxComponent-resize">resize</a></b> :\r
+ ( <code>Ext.Component this</code>, <code>Number adjWidth</code>, <code>Number adjHeight</code>, <code>Number rawWidth</code>, <code>Number rawHeight</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component is resized.</div><div class="long">Fires after the component is resized.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li><li><code>adjWidth</code> : Number<div class="sub-desc">The box-adjusted width that was set</div></li><li><code>adjHeight</code> : Number<div class="sub-desc">The box-adjusted height that was set</div></li><li><code>rawWidth</code> : Number<div class="sub-desc">The width that was originally specified</div></li><li><code>rawHeight</code> : Number<div class="sub-desc">The height that was originally specified</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.BoxComponent.html#resize" ext:member="#resize" ext:cls="Ext.BoxComponent">BoxComponent</a></td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.menu.ColorMenu-select"></a><b><a href="source/ColorMenu.html#event-Ext.menu.ColorMenu-select">select</a></b> :\r
+ ( <code>Ext.ColorPalette palette</code>, <code>String color</code> )\r
+ <div class="mdesc"><div class="short">Fires when a color is selected from the Ext.ColorPalette</div><div class="long">Fires when a color is selected from the <a href="output/Ext.menu.ColorMenu.html#Ext.menu.ColorMenu-palette" ext:member="palette" ext:cls="Ext.menu.ColorMenu">Ext.ColorPalette</a><div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>palette</code> : Ext.ColorPalette<div class="sub-desc">The <a href="output/Ext.menu.ColorMenu.html#Ext.menu.ColorMenu-palette" ext:member="palette" ext:cls="Ext.menu.ColorMenu">Ext.ColorPalette</a></div></li><li><code>color</code> : String<div class="sub-desc">The 6-digit color hex code (without the # symbol)</div></li></ul></div></div></div></td><td class="msource">ColorMenu</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-show"></a><b><a href="source/Component.html#event-Ext.Component-show">show</a></b> :\r
+ ( <code>Ext.Component this</code> )\r
+ <div class="mdesc"><div class="short">Fires after the component is shown when calling the show method.</div><div class="long">Fires after the component is shown when calling the <a href="output/Ext.Component.html#Ext.Component-show" ext:member="show" ext:cls="Ext.Component">show</a> method.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#show" ext:member="#show" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-staterestore"></a><b><a href="source/Component.html#event-Ext.Component-staterestore">staterestore</a></b> :\r
+ ( <code>Ext.Component this</code>, <code>Object state</code> )\r
+ <div class="mdesc"><div class="short">Fires after the state of the component is restored.</div><div class="long">Fires after the state of the component is restored.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li><li><code>state</code> : Object<div class="sub-desc">The hash of state values returned from the StateProvider. This is passed
+to <b><tt>applyState</tt></b>. By default, that simply copies property values into this
+Component. The method maybe overriden to provide custom state restoration.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#staterestore" ext:member="#staterestore" ext:cls="Ext.Component">Component</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.Component-statesave"></a><b><a href="source/Component.html#event-Ext.Component-statesave">statesave</a></b> :\r
+ ( <code>Ext.Component this</code>, <code>Object state</code> )\r
+ <div class="mdesc"><div class="short">Fires after the state of the component is saved to the configured state provider.</div><div class="long">Fires after the state of the component is saved to the configured state provider.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Ext.Component<div class="sub-desc"></div></li><li><code>state</code> : Object<div class="sub-desc">The hash of state values. This is determined by calling
+<b><tt>getState()</tt></b> on the Component. This method must be provided by the
+developer to return whetever representation of state is required, by default, Ext.Component
+has a null implementation.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.Component.html#statesave" ext:member="#statesave" ext:cls="Ext.Component">Component</a></td></tr></tbody></table></div>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff