Upgrade to ExtJS 3.3.0 - Released 10/06/2010
[extjs.git] / examples / docs / output / Ext.ux.grid.RowExpander.html
1 <div class="body-wrap" xmlns:ext="http://www.extjs.com"><div class="top-tools"><a class="inner-link" href="#Ext.ux.grid.RowExpander-props"><img src="resources/images/default/s.gif" class="item-icon icon-prop">Properties</a>&#13;<a class="inner-link" href="#Ext.ux.grid.RowExpander-methods"><img src="resources/images/default/s.gif" class="item-icon icon-method">Methods</a>&#13;<a class="inner-link" href="#Ext.ux.grid.RowExpander-events"><img src="resources/images/default/s.gif" class="item-icon icon-event">Events</a>&#13;<a class="inner-link" href="#Ext.ux.grid.RowExpander-configs"><img src="resources/images/default/s.gif" class="item-icon icon-config">Config Options</a>&#13;<a class="bookmark" href="../docs/?class=Ext.ux.grid.RowExpander"><img src="resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a>&#13;</div><h1>Class <a href="source/RowExpander.html#cls-Ext.ux.grid.RowExpander">Ext.ux.grid.RowExpander</a></h1><table cellspacing="0"><tr><td class="label">Package:</td><td class="hd-info">Ext.ux.grid</td></tr><tr><td class="label">Defined In:</td><td class="hd-info"><a href="source/RowExpander.html#cls-Ext.ux.grid.RowExpander">RowExpander.js</a></td></tr><tr><td class="label">Class:</td><td class="hd-info"><a href="source/RowExpander.html#cls-Ext.ux.grid.RowExpander">RowExpander</a></td></tr><tr><td class="label">Extends:</td><td class="hd-info">Object</td></tr></table><div class="description">Plugin (ptype = 'rowexpander') that adds the ability to have a Column in a grid which enables
2 a second row body which expands/contracts.  The expand/contract behavior is configurable to react
3 on clicking of the column, double click of the row, and/or hitting enter while a row is selected.</div><div class="hr"></div><a id="Ext.ux.grid.RowExpander-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  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-expandOnDblClick"></a><b><a href="source/RowExpander.html#cfg-Ext.ux.grid.RowExpander-expandOnDblClick">expandOnDblClick</a></b> : Boolean<div class="mdesc"><tt>true</tt> to toggle a row between expanded/collapsed when double clicked
4 (defaults to <tt>true</tt>).</div></td><td class="msource">RowExpander</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-expandOnDblClick"></a><b><a href="source/ux-all-debug.html#cfg-Ext.ux.grid.RowExpander-expandOnDblClick">expandOnDblClick</a></b> : Boolean<div class="mdesc"><tt>true</tt> to toggle a row between expanded/collapsed when double clicked
5 (defaults to <tt>true</tt>).</div></td><td class="msource">RowExpander</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-expandOnEnter"></a><b><a href="source/RowExpander.html#cfg-Ext.ux.grid.RowExpander-expandOnEnter">expandOnEnter</a></b> : Boolean<div class="mdesc"><tt>true</tt> to toggle selected row(s) between expanded/collapsed when the enter
6 key is pressed (defaults to <tt>true</tt>).</div></td><td class="msource">RowExpander</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-expandOnEnter"></a><b><a href="source/ux-all-debug.html#cfg-Ext.ux.grid.RowExpander-expandOnEnter">expandOnEnter</a></b> : Boolean<div class="mdesc"><tt>true</tt> to toggle selected row(s) between expanded/collapsed when the enter
7 key is pressed (defaults to <tt>true</tt>).</div></td><td class="msource">RowExpander</td></tr></tbody></table><a id="Ext.ux.grid.RowExpander-props"></a><h2>Public Properties</h2><div class="no-members">This class has no public properties.</div><a id="Ext.ux.grid.RowExpander-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 "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-getLockedCount"></a><b><a href="source/LockingGridView.html#method-Ext.ux.grid.RowExpander-getLockedCount">getLockedCount</a></b>()
8     :
9                                         Number<div class="mdesc"><div class="short">Returns the total number of locked columns</div><div class="long">Returns the total number of locked columns<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Number</code><div class="sub-desc">The number of locked columns</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-getTotalLockedWidth"></a><b><a href="source/LockingGridView.html#method-Ext.ux.grid.RowExpander-getTotalLockedWidth">getTotalLockedWidth</a></b>()
10     :
11                                         Number<div class="mdesc"><div class="short">Returns the total width of all locked columns</div><div class="long">Returns the total width of all locked columns<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Number</code><div class="sub-desc">The width of all locked columns</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-isLocked"></a><b><a href="source/LockingGridView.html#method-Ext.ux.grid.RowExpander-isLocked">isLocked</a></b>(&nbsp;<code>Number&nbsp;colIndex</code>&nbsp;)
12     :
13                                         Boolean<div class="mdesc"><div class="short">Returns true if the given column index is currently locked</div><div class="long">Returns true if the given column index is currently locked<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>colIndex</code> : Number<div class="sub-desc">The column index</div></li></ul><strong>Returns:</strong><ul><li><code>Boolean</code><div class="sub-desc">True if the column is locked</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-moveColumn"></a><b><a href="source/LockingGridView.html#method-Ext.ux.grid.RowExpander-moveColumn">moveColumn</a></b>(&nbsp;<code>Number&nbsp;oldIndex</code>,&nbsp;<code>Number&nbsp;newIndex</code>&nbsp;)
14     :
15                                         void<div class="mdesc"><div class="short">Moves a column from one position to another</div><div class="long">Moves a column from one position to another<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>oldIndex</code> : Number<div class="sub-desc">The current column index</div></li><li><code>newIndex</code> : Number<div class="sub-desc">The destination column index</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-setLocked"></a><b><a href="source/LockingGridView.html#method-Ext.ux.grid.RowExpander-setLocked">setLocked</a></b>(&nbsp;<code>Number&nbsp;colIndex</code>,&nbsp;<code>Boolean&nbsp;value</code>,&nbsp;<code>Boolean&nbsp;suppressEvent</code>&nbsp;)
16     :
17                                         void<div class="mdesc"><div class="short">Locks or unlocks a given column</div><div class="long">Locks or unlocks a given column<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>colIndex</code> : Number<div class="sub-desc">The column index</div></li><li><code>value</code> : Boolean<div class="sub-desc">True to lock, false to unlock</div></li><li><code>suppressEvent</code> : Boolean<div class="sub-desc">Pass false to cause the columnlockchange event not to fire</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">RowExpander</td></tr></tbody></table><a id="Ext.ux.grid.RowExpander-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 "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-beforecollapse"></a><b><a href="source/RowExpander.html#event-Ext.ux.grid.RowExpander-beforecollapse">beforecollapse</a></b> :
18                                       (&nbsp;<code>Object&nbsp;this</code>,&nbsp;<code>Object&nbsp;Ext.data.Record</code>,&nbsp;<code>Object&nbsp;body</code>,&nbsp;<code>Number&nbsp;rowIndex</code>&nbsp;)
19     <div class="mdesc"><div class="short">Fires before the row collapses. Have the listener return false to prevent the row from collapsing.</div><div class="long">Fires before the row collapses. Have the listener return false to prevent the row from collapsing.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Object<div class="sub-desc">RowExpander object.</div></li><li><code>Ext.data.Record</code> : Object<div class="sub-desc">Record for the selected row.</div></li><li><code>body</code> : Object<div class="sub-desc">body element for the secondary row.</div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The current row index.</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-beforecollapse"></a><b><a href="source/ux-all-debug.html#event-Ext.ux.grid.RowExpander-beforecollapse">beforecollapse</a></b> :
20                                       (&nbsp;<code>Object&nbsp;this</code>,&nbsp;<code>Object&nbsp;Ext.data.Record</code>,&nbsp;<code>Object&nbsp;body</code>,&nbsp;<code>Number&nbsp;rowIndex</code>&nbsp;)
21     <div class="mdesc"><div class="short">Fires before the row collapses. Have the listener return false to prevent the row from collapsing.</div><div class="long">Fires before the row collapses. Have the listener return false to prevent the row from collapsing.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Object<div class="sub-desc">RowExpander object.</div></li><li><code>Ext.data.Record</code> : Object<div class="sub-desc">Record for the selected row.</div></li><li><code>body</code> : Object<div class="sub-desc">body element for the secondary row.</div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The current row index.</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-beforeexpand"></a><b><a href="source/RowExpander.html#event-Ext.ux.grid.RowExpander-beforeexpand">beforeexpand</a></b> :
22                                       (&nbsp;<code>Object&nbsp;this</code>,&nbsp;<code>Object&nbsp;Ext.data.Record</code>,&nbsp;<code>Object&nbsp;body</code>,&nbsp;<code>Number&nbsp;rowIndex</code>&nbsp;)
23     <div class="mdesc"><div class="short">Fires before the row expands. Have the listener return false to prevent the row from expanding.</div><div class="long">Fires before the row expands. Have the listener return false to prevent the row from expanding.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Object<div class="sub-desc">RowExpander object.</div></li><li><code>Ext.data.Record</code> : Object<div class="sub-desc">Record for the selected row.</div></li><li><code>body</code> : Object<div class="sub-desc">body element for the secondary row.</div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The current row index.</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-beforeexpand"></a><b><a href="source/ux-all-debug.html#event-Ext.ux.grid.RowExpander-beforeexpand">beforeexpand</a></b> :
24                                       (&nbsp;<code>Object&nbsp;this</code>,&nbsp;<code>Object&nbsp;Ext.data.Record</code>,&nbsp;<code>Object&nbsp;body</code>,&nbsp;<code>Number&nbsp;rowIndex</code>&nbsp;)
25     <div class="mdesc"><div class="short">Fires before the row expands. Have the listener return false to prevent the row from expanding.</div><div class="long">Fires before the row expands. Have the listener return false to prevent the row from expanding.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Object<div class="sub-desc">RowExpander object.</div></li><li><code>Ext.data.Record</code> : Object<div class="sub-desc">Record for the selected row.</div></li><li><code>body</code> : Object<div class="sub-desc">body element for the secondary row.</div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The current row index.</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-collapse"></a><b><a href="source/RowExpander.html#event-Ext.ux.grid.RowExpander-collapse">collapse</a></b> :
26                                       (&nbsp;<code>Object&nbsp;this</code>,&nbsp;<code>Object&nbsp;Ext.data.Record</code>,&nbsp;<code>Object&nbsp;body</code>,&nbsp;<code>Number&nbsp;rowIndex</code>&nbsp;)
27     <div class="mdesc"><div class="short">Fires after the row collapses.</div><div class="long">Fires after the row collapses.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Object<div class="sub-desc">RowExpander object.</div></li><li><code>Ext.data.Record</code> : Object<div class="sub-desc">Record for the selected row.</div></li><li><code>body</code> : Object<div class="sub-desc">body element for the secondary row.</div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The current row index.</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-collapse"></a><b><a href="source/ux-all-debug.html#event-Ext.ux.grid.RowExpander-collapse">collapse</a></b> :
28                                       (&nbsp;<code>Object&nbsp;this</code>,&nbsp;<code>Object&nbsp;Ext.data.Record</code>,&nbsp;<code>Object&nbsp;body</code>,&nbsp;<code>Number&nbsp;rowIndex</code>&nbsp;)
29     <div class="mdesc"><div class="short">Fires after the row collapses.</div><div class="long">Fires after the row collapses.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Object<div class="sub-desc">RowExpander object.</div></li><li><code>Ext.data.Record</code> : Object<div class="sub-desc">Record for the selected row.</div></li><li><code>body</code> : Object<div class="sub-desc">body element for the secondary row.</div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The current row index.</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-expand"></a><b><a href="source/RowExpander.html#event-Ext.ux.grid.RowExpander-expand">expand</a></b> :
30                                       (&nbsp;<code>Object&nbsp;this</code>,&nbsp;<code>Object&nbsp;Ext.data.Record</code>,&nbsp;<code>Object&nbsp;body</code>,&nbsp;<code>Number&nbsp;rowIndex</code>&nbsp;)
31     <div class="mdesc"><div class="short">Fires after the row expands.</div><div class="long">Fires after the row expands.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Object<div class="sub-desc">RowExpander object.</div></li><li><code>Ext.data.Record</code> : Object<div class="sub-desc">Record for the selected row.</div></li><li><code>body</code> : Object<div class="sub-desc">body element for the secondary row.</div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The current row index.</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.grid.RowExpander-expand"></a><b><a href="source/ux-all-debug.html#event-Ext.ux.grid.RowExpander-expand">expand</a></b> :
32                                       (&nbsp;<code>Object&nbsp;this</code>,&nbsp;<code>Object&nbsp;Ext.data.Record</code>,&nbsp;<code>Object&nbsp;body</code>,&nbsp;<code>Number&nbsp;rowIndex</code>&nbsp;)
33     <div class="mdesc"><div class="short">Fires after the row expands.</div><div class="long">Fires after the row expands.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>this</code> : Object<div class="sub-desc">RowExpander object.</div></li><li><code>Ext.data.Record</code> : Object<div class="sub-desc">Record for the selected row.</div></li><li><code>body</code> : Object<div class="sub-desc">body element for the secondary row.</div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The current row index.</div></li></ul></div></div></div></td><td class="msource">RowExpander</td></tr></tbody></table></div>