docs/output/Ext.grid.GroupingView.html

   1 <div class="body-wrap" xmlns:ext="http://www.extjs.com"><div class="top-tools"><a class="inner-link" href="#Ext.grid.GroupingView-props"><img src="resources/images/default/s.gif" class="item-icon icon-prop">Properties</a>&#13;<a class="inner-link" href="#Ext.grid.GroupingView-methods"><img src="resources/images/default/s.gif" class="item-icon icon-method">Methods</a>&#13;<a class="inner-link" href="#Ext.grid.GroupingView-events"><img src="resources/images/default/s.gif" class="item-icon icon-event">Events</a>&#13;<a class="inner-link" href="#Ext.grid.GroupingView-configs"><img src="resources/images/default/s.gif" class="item-icon icon-config">Config Options</a>&#13;<a class="bookmark" href="../docs/?class=Ext.grid.GroupingView"><img src="resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a>&#13;</div><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>
   2   <img src="resources/elbow-end.gif"><a href="output/Ext.grid.GridView.html" ext:member="" ext:cls="Ext.grid.GridView">GridView</a>
   3     <img src="resources/elbow-end.gif">GroupingView</pre></div><h1>Class <a href="source/GroupingView.html#cls-Ext.grid.GroupingView">Ext.grid.GroupingView</a></h1><table cellspacing="0"><tr><td class="label">Package:</td><td class="hd-info">Ext.grid</td></tr><tr><td class="label">Defined In:</td><td class="hd-info"><a href="source/GroupingView.html#cls-Ext.grid.GroupingView">GroupingView.js</a></td></tr><tr><td class="label">Class:</td><td class="hd-info"><a href="source/GroupingView.html#cls-Ext.grid.GroupingView">GroupingView</a></td></tr><tr><td class="label">Extends:</td><td class="hd-info"><a href="output/Ext.grid.GridView.html" ext:cls="Ext.grid.GridView" ext:member="">GridView</a></td></tr></table><div class="description">Adds the ability for single level grouping to the grid. A <a href="output/Ext.data.GroupingStore.html" ext:cls="Ext.data.GroupingStore">GroupingStore</a>
   4 must be used to enable grouping.  Some grouping characteristics may also be configured at the
   5 <a href="output/Ext.grid.Column.html" ext:cls="Ext.grid.Column">Column level</a><div class="mdetail-params"><ul>
   6 <li><code><a href="output/Ext.grid.Column.html#Ext.grid.Column-emptyGroupText" ext:member="emptyGroupText" ext:cls="Ext.grid.Column">emptyGroupText</a></code></li>
   7 <li><code><a href="output/Ext.grid.Column.html#Ext.grid.Column-groupable" ext:member="groupable" ext:cls="Ext.grid.Column">groupable</a></code></li>
   8 <li><code><a href="output/Ext.grid.Column.html#Ext.grid.Column-groupName" ext:member="groupName" ext:cls="Ext.grid.Column">groupName</a></code></li>
   9 <li><code><a href="output/Ext.grid.Column.html#Ext.grid.Column-groupRender" ext:member="groupRender" ext:cls="Ext.grid.Column">groupRender</a></code></li>
  10 </ul></div>
  11 <p>Sample usage:</p>
  12 <pre><code><b>var</b> grid = <b>new</b> Ext.grid.GridPanel({
  13     <i>// A groupingStore is required <b>for</b> a GroupingView</i>
  14     store: <b>new</b> <a href="output/Ext.data.GroupingStore.html" ext:cls="Ext.data.GroupingStore">Ext.data.GroupingStore</a>({
  15         autoDestroy: true,
  16         reader: reader,
  17         data: xg.dummyData,
  18         sortInfo: {field: <em>'company'</em>, direction: <em>'ASC'</em>},
  19         <a href="output/Ext.data.GroupingStore.html#Ext.data.GroupingStore-groupOnSort" ext:member="groupOnSort" ext:cls="Ext.data.GroupingStore">groupOnSort</a>: true,
  20         <a href="output/Ext.data.GroupingStore.html#Ext.data.GroupingStore-remoteGroup" ext:member="remoteGroup" ext:cls="Ext.data.GroupingStore">remoteGroup</a>: true,
  21         <a href="output/Ext.data.GroupingStore.html#Ext.data.GroupingStore-groupField" ext:member="groupField" ext:cls="Ext.data.GroupingStore">groupField</a>: <em>'industry'</em>
  22     }),
  23     colModel: <b>new</b> <a href="output/Ext.grid.ColumnModel.html" ext:cls="Ext.grid.ColumnModel">Ext.grid.ColumnModel</a>({
  24         columns:[
  25             {id:<em>'company'</em>,header: <em>'Company'</em>, width: 60, dataIndex: <em>'company'</em>},
  26             <i>// <a href="output/Ext.grid.Column.html#Ext.grid.Column-groupable" ext:member="groupable" ext:cls="Ext.grid.Column">groupable</a>, <a href="output/Ext.grid.Column.html#Ext.grid.Column-groupName" ext:member="groupName" ext:cls="Ext.grid.Column">groupName</a>, <a href="output/Ext.grid.Column.html#Ext.grid.Column-groupRender" ext:member="groupRender" ext:cls="Ext.grid.Column">groupRender</a> are also configurable at column level</i>
  27             {header: <em>'Price'</em>, renderer: Ext.util.Format.usMoney, dataIndex: <em>'price'</em>, <a href="output/Ext.grid.Column.html#Ext.grid.Column-groupable" ext:member="groupable" ext:cls="Ext.grid.Column">groupable</a>: false},
  28             {header: <em>'Change'</em>, dataIndex: <em>'change'</em>, renderer: Ext.util.Format.usMoney},
  29             {header: <em>'Industry'</em>, dataIndex: <em>'industry'</em>},
  30             {header: <em>'Last Updated'</em>, renderer: Ext.util.Format.dateRenderer(<em>'m/d/Y'</em>), dataIndex: <em>'lastChange'</em>}
  31         ],
  32         defaults: {
  33             sortable: true,
  34             menuDisabled: false,
  35             width: 20
  36         }
  37     }),
  38
  39     view: <b>new</b> Ext.grid.GroupingView({
  40         <a href="output/Ext.grid.GridView.html#Ext.grid.GridView-forceFit" ext:member="forceFit" ext:cls="Ext.grid.GridView">forceFit</a>: true,
  41         <i>// custom grouping text template to display the number of items per group</i>
  42         <a href="output/Ext.grid.GroupingView.html#Ext.grid.GroupingView-groupTextTpl" ext:member="groupTextTpl" ext:cls="Ext.grid.GroupingView">groupTextTpl</a>: <em>'{text} ({[values.rs.length]} {[values.rs.length > 1 ? <em>"Items"</em> : <em>"Item"</em>]})'</em>
  43     }),
  44
  45     frame:true,
  46     width: 700,
  47     height: 450,
  48     collapsible: true,
  49     animCollapse: false,
  50     title: <em>'Grouping Example'</em>,
  51     iconCls: <em>'icon-grid'</em>,
  52     renderTo: document.body
  53 });</code></pre></div><div class="hr"></div><a id="Ext.grid.GroupingView-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">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-autoFill"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-autoFill">autoFill</a></b> : Boolean<div class="mdesc"><div class="short">Defaults to false.  Specify true to have the column widths re-proportioned
  54 when the grid is initially rendered.  The
  55 ...</div><div class="long">Defaults to <tt>false</tt>.  Specify <tt>true</tt> to have the column widths re-proportioned
  56 when the grid is <b>initially rendered</b>.  The
  57 <a href="output/Ext.grid.Column.html#Ext.grid.Column-width" ext:member="width" ext:cls="Ext.grid.Column">initially configured width</a></tt> of each column will be adjusted
  58 to fit the grid width and prevent horizontal scrolling. If columns are later resized (manually
  59 or programmatically), the other columns in the grid will <b>not</b> be resized to fit the grid width.
  60 See <tt><a href="output/Ext.grid.GridView.html#Ext.grid.GridView-forceFit" ext:member="forceFit" ext:cls="Ext.grid.GridView">forceFit</a></tt> also.</div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#autoFill" ext:member="#autoFill" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-cancelEditOnToggle"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-cancelEditOnToggle">cancelEditOnToggle</a></b> : Boolean<div class="mdesc">True to cancel any editing when the group header is toggled. Defaults to <tt>true</tt>.</div></td><td class="msource">GroupingView</td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-cellSelector"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-cellSelector">cellSelector</a></b> : String<div class="mdesc">The selector used to find cells internally (defaults to <tt>'td.x-grid3-cell'</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#cellSelector" ext:member="#cellSelector" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-cellSelectorDepth"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-cellSelectorDepth">cellSelectorDepth</a></b> : Number<div class="mdesc">The number of levels to search for cells in event delegation (defaults to <tt>4</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#cellSelectorDepth" ext:member="#cellSelectorDepth" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-columnsText"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-columnsText">columnsText</a></b> : String<div class="mdesc">The text displayed in the 'Columns' menu item (defaults to <tt>'Columns'</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#columnsText" ext:member="#columnsText" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-deferEmptyText"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-deferEmptyText">deferEmptyText</a></b> : Boolean<div class="mdesc">True to defer <tt><a href="output/Ext.grid.GridView.html#Ext.grid.GridView-emptyText" ext:member="emptyText" ext:cls="Ext.grid.GridView">emptyText</a></tt> being applied until the store's
  61 first load (defaults to <tt>true</tt>).</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#deferEmptyText" ext:member="#deferEmptyText" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-emptyGroupText"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-emptyGroupText">emptyGroupText</a></b> : String<div class="mdesc"><div class="short">The text to display when there is an empty group value (defaults to '(None)').
  62 May also be specified per column, see ...</div><div class="long">The text to display when there is an empty group value (defaults to <tt>'(None)'</tt>).
  63 May also be specified per column, see <a href="output/Ext.grid.Column.html" ext:cls="Ext.grid.Column">Ext.grid.Column</a>.<a href="output/Ext.grid.Column.html#Ext.grid.Column-emptyGroupText" ext:member="emptyGroupText" ext:cls="Ext.grid.Column">emptyGroupText</a>.</div></div></td><td class="msource">GroupingView</td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-emptyText"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-emptyText">emptyText</a></b> : String<div class="mdesc"><div class="short">Default text (html tags are accepted) to display in the grid body when no rows
  64 are available (defaults to ''). This v...</div><div class="long">Default text (html tags are accepted) to display in the grid body when no rows
  65 are available (defaults to ''). This value will be used to update the <tt><a href="output/Ext.grid.GridView.html#Ext.grid.GridView-mainBody" ext:member="mainBody" ext:cls="Ext.grid.GridView">mainBody</a></tt>:
  66     <pre><code>this.mainBody.update(<em>'&lt;div class=<em>"x-grid-empty"</em>>'</em> + this.emptyText + <em>'&lt;/div>'</em>);</code></pre></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#emptyText" ext:member="#emptyText" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-enableGrouping"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-enableGrouping">enableGrouping</a></b> : Boolean<div class="mdesc"><tt>false</tt> to disable grouping functionality (defaults to <tt>true</tt>)</div></td><td class="msource">GroupingView</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-enableGroupingMenu"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-enableGroupingMenu">enableGroupingMenu</a></b> : Boolean<div class="mdesc"><tt>true</tt> to enable the grouping control in the column menu (defaults to <tt>true</tt>)</div></td><td class="msource">GroupingView</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-enableNoGroups"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-enableNoGroups">enableNoGroups</a></b> : Boolean<div class="mdesc"><tt>true</tt> to allow the user to turn off grouping (defaults to <tt>true</tt>)</div></td><td class="msource">GroupingView</td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-enableRowBody"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-enableRowBody">enableRowBody</a></b> : Boolean<div class="mdesc"><div class="short">True to add a second TR element per row that can be used to provide a row body
  67 that spans beneath the data row.  Use ...</div><div class="long">True to add a second TR element per row that can be used to provide a row body
  68 that spans beneath the data row.  Use the <a href="output/Ext.grid.GridView.html#Ext.grid.GridView-getRowClass" ext:member="getRowClass" ext:cls="Ext.grid.GridView">getRowClass</a> method's rowParams config to customize the row body.</div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#enableRowBody" ext:member="#enableRowBody" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-forceFit"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-forceFit">forceFit</a></b> : Boolean<div class="mdesc"><div class="short">Defaults to false.  Specify true to have the column widths re-proportioned
  69 at all times.
  70 The initially configured wid...</div><div class="long"><p>Defaults to <tt>false</tt>.  Specify <tt>true</tt> to have the column widths re-proportioned
  71 at <b>all times</b>.</p>
  72 <p>The <a href="output/Ext.grid.Column.html#Ext.grid.Column-width" ext:member="width" ext:cls="Ext.grid.Column">initially configured width</a></tt> of each
  73 column will be adjusted to fit the grid width and prevent horizontal scrolling. If columns are
  74 later resized (manually or programmatically), the other columns in the grid <b>will</b> be resized
  75 to fit the grid width.</p>
  76 <p>Columns which are configured with <code>fixed: true</code> are omitted from being resized.</p>
  77 <p>See <tt><a href="output/Ext.grid.GridView.html#Ext.grid.GridView-autoFill" ext:member="autoFill" ext:cls="Ext.grid.GridView">autoFill</a></tt>.</p></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#forceFit" ext:member="#forceFit" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-groupByText"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-groupByText">groupByText</a></b> : String<div class="mdesc">Text displayed in the grid header menu for grouping by a column
  78 (defaults to 'Group By This Field').</div></td><td class="msource">GroupingView</td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-groupMode"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-groupMode">groupMode</a></b> : String<div class="mdesc"><div class="short">Indicates how to construct the group identifier. 'value' constructs the id using
  79 raw value, 'display' constructs the ...</div><div class="long">Indicates how to construct the group identifier. <tt>'value'</tt> constructs the id using
  80 raw value, <tt>'display'</tt> constructs the id using the rendered value. Defaults to <tt>'value'</tt>.</div></div></td><td class="msource">GroupingView</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-groupRenderer"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-groupRenderer">groupRenderer</a></b> : Function<div class="mdesc">This property must be configured in the <a href="output/Ext.grid.Column.html" ext:cls="Ext.grid.Column">Ext.grid.Column</a> for
  81 each column.</div></td><td class="msource">GroupingView</td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-groupTextTpl"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-groupTextTpl">groupTextTpl</a></b> : String<div class="mdesc"><div class="short">The template used to render the group header (defaults to '{text}').
  82 This is used to format an object which contains ...</div><div class="long">The template used to render the group header (defaults to <tt>'{text}'</tt>).
  83 This is used to format an object which contains the following properties:
  84 <div class="mdetail-params"><ul>
  85 <li><b>group</b> : String<p class="sub-desc">The <i>rendered</i> value of the group field.
  86 By default this is the unchanged value of the group field. If a <tt><b><a href="output/Ext.grid.Column.html#Ext.grid.Column-groupRenderer" ext:member="groupRenderer" ext:cls="Ext.grid.Column">groupRenderer</a></b></tt>
  87 is specified, it is the result of a call to that function.</p></li>
  88 <li><b>gvalue</b> : Object<p class="sub-desc">The <i>raw</i> value of the group field.</p></li>
  89 <li><b>text</b> : String<p class="sub-desc">The configured header (as described in <tt><a href="output/Ext.grid.GroupingView.html#Ext.grid.GroupingView-showGroupName" ext:member="showGroupName" ext:cls="Ext.grid.GroupingView">showGroupName</a>)</tt>
  90 if <tt><a href="output/Ext.grid.GroupingView.html#Ext.grid.GroupingView-showGroupName" ext:member="showGroupName" ext:cls="Ext.grid.GroupingView">showGroupName</a></tt> is <tt>true</tt>) plus the <i>rendered</i> group field value.</p></li>
  91 <li><b>groupId</b> : String<p class="sub-desc">A unique, generated ID which is applied to the
  92 View Element which contains the group.</p></li>
  93 <li><b>startRow</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li>
  94 <li><b>rs</b> : Array<p class="sub-desc">Contains a single element: The Record providing the data
  95 for the row which caused group change.</p></li>
  96 <li><b>cls</b> : String<p class="sub-desc">The generated class name string to apply to the group header Element.</p></li>
  97 <li><b>style</b> : String<p class="sub-desc">The inline style rules to apply to the group header Element.</p></li>
  98 </ul></div></p>
  99 See <a href="output/Ext.XTemplate.html" ext:cls="Ext.XTemplate">Ext.XTemplate</a> for information on how to format data using a template. Possible usage:<pre><code><b>var</b> grid = <b>new</b> Ext.grid.GridPanel({
 100     ...
 101     view: <b>new</b> Ext.grid.GroupingView({
 102         groupTextTpl: <em>'{text} ({[values.rs.length]} {[values.rs.length > 1 ? <em>"Items"</em> : <em>"Item"</em>]})'</em>
 103     }),
 104 });</code></pre></div></div></td><td class="msource">GroupingView</td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-headerMenuOpenCls"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-headerMenuOpenCls">headerMenuOpenCls</a></b> : String<div class="mdesc">The CSS class to add to the header cell when its menu is visible. Defaults to 'x-grid3-hd-menu-open'</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#headerMenuOpenCls" ext:member="#headerMenuOpenCls" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-headersDisabled"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-headersDisabled">headersDisabled</a></b> : Boolean<div class="mdesc"><div class="short">True to disable the grid column headers (defaults to false).
 105 Use the ColumnModel menuDisabled
 106 config to disable the m...</div><div class="long">True to disable the grid column headers (defaults to <tt>false</tt>).
 107 Use the <a href="output/Ext.grid.ColumnModel.html" ext:cls="Ext.grid.ColumnModel">ColumnModel</a> <tt><a href="output/Ext.grid.ColumnModel.html#Ext.grid.ColumnModel-menuDisabled" ext:member="menuDisabled" ext:cls="Ext.grid.ColumnModel">menuDisabled</a></tt>
 108 config to disable the <i>menu</i> for individual columns.  While this config is true the
 109 following will be disabled:<div class="mdetail-params"><ul>
 110 <li>clicking on header to sort</li>
 111 <li>the trigger to reveal the menu.</li>
 112 </ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#headersDisabled" ext:member="#headersDisabled" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-hideGroupedColumn"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-hideGroupedColumn">hideGroupedColumn</a></b> : Boolean<div class="mdesc"><tt>true</tt> to hide the column that is currently grouped (defaults to <tt>false</tt>)</div></td><td class="msource">GroupingView</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-ignoreAdd"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-ignoreAdd">ignoreAdd</a></b> : Boolean<div class="mdesc"><tt>true</tt> to skip refreshing the view when new rows are added (defaults to <tt>false</tt>)</div></td><td class="msource">GroupingView</td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</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
 113 object during initialization.  This should ...</div><div class="long"><p>A config object containing one or more event handlers to be added to this
 114 object during initialization.  This should be a valid listeners config object as specified in the
 115 <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>
 116 <br><p><b><u>DOM events from ExtJs <a href="output/Ext.Component.html" ext:cls="Ext.Component">Components</a></u></b></p>
 117 <br><p>While <i>some</i> ExtJs Component classes export selected DOM events (e.g. "click", "mouseover" etc), this
 118 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
 119 <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
 120 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
 121 has been rendered. A plugin can simplify this step:<pre><code><i>// Plugin is configured <b>with</b> a listeners config object.</i>
 122 <i>// The Component is appended to the argument list of all handler functions.</i>
 123 Ext.DomObserver = Ext.extend(Object, {
 124     constructor: <b>function</b>(config) {
 125         this.listeners = config.listeners ? config.listeners : config;
 126     },
 127
 128     <i>// Component passes itself into plugin&#39;s init method</i>
 129     init: <b>function</b>(c) {
 130         <b>var</b> p, l = this.listeners;
 131         <b>for</b> (p <b>in</b> l) {
 132             <b>if</b> (Ext.isFunction(l[p])) {
 133                 l[p] = this.createHandler(l[p], c);
 134             } <b>else</b> {
 135                 l[p].fn = this.createHandler(l[p].fn, c);
 136             }
 137         }
 138
 139         <i>// Add the listeners to the Element immediately following the render call</i>
 140         c.render = c.render.<a href="output/Function.html#Function-createSequence" ext:member="createSequence" ext:cls="Function">createSequence</a>(<b>function</b>() {
 141             <b>var</b> e = c.getEl();
 142             <b>if</b> (e) {
 143                 e.on(l);
 144             }
 145         });
 146     },
 147
 148     createHandler: <b>function</b>(fn, c) {
 149         <b>return</b> <b>function</b>(e) {
 150             fn.call(this, e, c);
 151         };
 152     }
 153 });
 154
 155 <b>var</b> combo = <b>new</b> Ext.form.ComboBox({
 156
 157     <i>// Collapse combo when its element is clicked on</i>
 158     plugins: [ <b>new</b> Ext.DomObserver({
 159         click: <b>function</b>(evt, comp) {
 160             comp.collapse();
 161         }
 162     })],
 163     store: myStore,
 164     typeAhead: true,
 165     mode: <em>'local'</em>,
 166     triggerAction: <em>'all'</em>
 167 });</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  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-markDirty"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-markDirty">markDirty</a></b> : Boolean<div class="mdesc">True to show the dirty cell indicator when a cell has been modified. Defaults to <tt>true</tt>.</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#markDirty" ext:member="#markDirty" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-rowBodySelector"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-rowBodySelector">rowBodySelector</a></b> : String<div class="mdesc">The selector used to find row bodies internally (defaults to <tt>'div.x-grid3-row'</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#rowBodySelector" ext:member="#rowBodySelector" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-rowBodySelectorDepth"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-rowBodySelectorDepth">rowBodySelectorDepth</a></b> : Number<div class="mdesc">The number of levels to search for row bodies in event delegation (defaults to <tt>10</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#rowBodySelectorDepth" ext:member="#rowBodySelectorDepth" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-rowOverCls"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-rowOverCls">rowOverCls</a></b> : String<div class="mdesc">The CSS class added to each row when it is hovered over. Defaults to 'x-grid3-row-over'</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#rowOverCls" ext:member="#rowOverCls" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-rowSelector"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-rowSelector">rowSelector</a></b> : String<div class="mdesc">The selector used to find rows internally (defaults to <tt>'div.x-grid3-row'</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#rowSelector" ext:member="#rowSelector" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-rowSelectorDepth"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-rowSelectorDepth">rowSelectorDepth</a></b> : Number<div class="mdesc">The number of levels to search for rows in event delegation (defaults to <tt>10</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#rowSelectorDepth" ext:member="#rowSelectorDepth" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-scrollOffset"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-scrollOffset">scrollOffset</a></b> : Number<div class="mdesc"><div class="short">The amount of space to reserve for the vertical scrollbar
 168 (defaults to undefined). If an explicit value isn't specifi...</div><div class="long">The amount of space to reserve for the vertical scrollbar
 169 (defaults to <tt>undefined</tt>). If an explicit value isn't specified, this will be automatically
 170 calculated.</div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#scrollOffset" ext:member="#scrollOffset" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-selectedRowClass"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-selectedRowClass">selectedRowClass</a></b> : String<div class="mdesc"><div class="short">The CSS class applied to a selected row (defaults to 'x-grid3-row-selected'). An
 171 example overriding the default styli...</div><div class="long">The CSS class applied to a selected row (defaults to <tt>'x-grid3-row-selected'</tt>). An
 172 example overriding the default styling:
 173     <pre><code>.x-grid3-row-selected {background-color: yellow;}</code></pre>
 174 Note that this only controls the row, and will not do anything for the text inside it.  To style inner
 175 facets (like text) use something like:
 176     <pre><code>.x-grid3-row-selected .x-grid3-cell-inner {
 177         color: #FFCC00;
 178     }</code></pre></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#selectedRowClass" ext:member="#selectedRowClass" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-showGroupName"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-showGroupName">showGroupName</a></b> : Boolean<div class="mdesc"><div class="short">If true will display a prefix plus a ': ' before the group field value
 179 in the group header line.  The prefix will con...</div><div class="long">If <tt>true</tt> will display a prefix plus a ': ' before the group field value
 180 in the group header line.  The prefix will consist of the <tt><b><a href="output/Ext.grid.Column.html#Ext.grid.Column-groupName" ext:member="groupName" ext:cls="Ext.grid.Column">groupName</a></b></tt>
 181 (or the configured <tt><b><a href="output/Ext.grid.Column.html#Ext.grid.Column-header" ext:member="header" ext:cls="Ext.grid.Column">header</a></b></tt> if not provided) configured in the
 182 <a href="output/Ext.grid.Column.html" ext:cls="Ext.grid.Column">Ext.grid.Column</a> for each set of grouped rows (defaults to <tt>true</tt>).</div></div></td><td class="msource">GroupingView</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-showGroupsText"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-showGroupsText">showGroupsText</a></b> : String<div class="mdesc">Text displayed in the grid header for enabling/disabling grouping
 183 (defaults to 'Show in Groups').</div></td><td class="msource">GroupingView</td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-sortAscText"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-sortAscText">sortAscText</a></b> : String<div class="mdesc">The text displayed in the 'Sort Ascending' menu item (defaults to <tt>'Sort Ascending'</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#sortAscText" ext:member="#sortAscText" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-sortClasses"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-sortClasses">sortClasses</a></b> : Array<div class="mdesc">The CSS classes applied to a header when it is sorted. (defaults to <tt>['sort-asc', 'sort-desc']</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#sortClasses" ext:member="#sortClasses" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-sortDescText"></a><b><a href="source/GridView.html#cfg-Ext.grid.GridView-sortDescText">sortDescText</a></b> : String<div class="mdesc">The text displayed in the 'Sort Descending' menu item (defaults to <tt>'Sort Descending'</tt>)</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#sortDescText" ext:member="#sortDescText" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-startCollapsed"></a><b><a href="source/GroupingView.html#cfg-Ext.grid.GroupingView-startCollapsed">startCollapsed</a></b> : Boolean<div class="mdesc"><tt>true</tt> to start all groups collapsed (defaults to <tt>false</tt>)</div></td><td class="msource">GroupingView</td></tr></tbody></table><a id="Ext.grid.GroupingView-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">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-Ext.Template"></a><b><a href="source/GridView.html#prop-Ext.grid.GridView-Ext.Template">Ext.Template</a></b> : masterTpl<div class="mdesc">The master template to use when rendering the GridView. Has a default template</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#Ext.Template" ext:member="#Ext.Template" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="property-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-bodyTpl"></a><b><a href="source/GridView.html#prop-Ext.grid.GridView-bodyTpl">bodyTpl</a></b> : Ext.Template<div class="mdesc">The template to use when rendering the body. Has a default template</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#bodyTpl" ext:member="#bodyTpl" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="property-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-cellTpl"></a><b><a href="source/GridView.html#prop-Ext.grid.GridView-cellTpl">cellTpl</a></b> : Ext.Template<div class="mdesc">The template to use to render each cell. Has a default template</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#cellTpl" ext:member="#cellTpl" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="property-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-dragZone"></a><b><a href="source/GridView.html#prop-Ext.grid.GridView-dragZone">dragZone</a></b> : Ext.grid.GridDragZone<div class="mdesc"><div class="short">A customized implementation of a DragZone which provides default implementations
 184 of the template methods of DragZone ...</div><div class="long"><p>A customized implementation of a <a href="output/Ext.dd.DragZone.html" ext:cls="Ext.dd.DragZone">DragZone</a> which provides default implementations
 185 of the template methods of DragZone to enable dragging of the selected rows of a GridPanel.
 186 See <a href="output/Ext.grid.GridDragZone.html" ext:cls="Ext.grid.GridDragZone">Ext.grid.GridDragZone</a> for details.</p>
 187 <p>This will <b>only</b> be present:<div class="mdetail-params"><ul>
 188 <li><i>if</i> the owning GridPanel was configured with <a href="output/Ext.grid.GridPanel.html#Ext.grid.GridPanel-enableDragDrop" ext:member="enableDragDrop" ext:cls="Ext.grid.GridPanel">enableDragDrop</a>: <tt>true</tt>.</li>
 189 <li><i>after</i> the owning GridPanel has been rendered.</li>
 190 </ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#dragZone" ext:member="#dragZone" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="property-row  inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-headerTpl"></a><b><a href="source/GridView.html#prop-Ext.grid.GridView-headerTpl">headerTpl</a></b> : Ext.Template<div class="mdesc">The template to use when rendering headers. Has a default template</div></td><td class="msource"><a href="output/Ext.grid.GridView.html#headerTpl" ext:member="#headerTpl" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="property-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-mainBody"></a><b><a href="source/GridView.html#prop-Ext.grid.GridView-mainBody">mainBody</a></b> : Ext.Element<div class="mdesc"><div class="short">Read-only. The GridView's body Element which encapsulates all rows in the Grid.
 191 This Element is only available after ...</div><div class="long"><i>Read-only</i>. The GridView's body Element which encapsulates all rows in the Grid.
 192 This <a href="output/Ext.Element.html" ext:cls="Ext.Element">Element</a> is only available after the GridPanel has been rendered.</div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#mainBody" ext:member="#mainBody" ext:cls="Ext.grid.GridView">GridView</a></td></tr></tbody></table><a id="Ext.grid.GroupingView-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.grid.GroupingView-GroupingView"></a><b><a href="source/GroupingView.html#cls-Ext.grid.GroupingView">GroupingView</a></b>(&nbsp;<code>Object&nbsp;config</code>&nbsp;)
 193     <div class="mdesc"><div class="short"></div><div class="long"><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">GroupingView</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</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>(&nbsp;<code>Object|String&nbsp;o</code>,&nbsp;<code>string&nbsp;Optional.</code>&nbsp;)
 194     :
 195                                         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>
 196 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.
 197 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">&nbsp;</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>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Function&nbsp;handler</code>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;scope</code>]</span>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;options</code>]</span>&nbsp;)
 198     :
 199                                         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.
 200 <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.
 201 properties. This may contain any of the following properties:<ul>
 202 <li><b>scope</b> : Object<div class="sub-desc">The scope (<code><b>this</b></code> reference) in which the handler function is executed.
 203 <b>If omitted, defaults to the object which fired the event.</b></div></li>
 204 <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>
 205 <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>
 206 <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
 207 by the specified number of milliseconds. If the event fires again within that time, the original
 208 handler is <em>not</em> invoked, but the new handler is scheduled in its place.</div></li>
 209 <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>
 210 if the event was bubbled up from a child Observable.</div></li>
 211 </ul><br>
 212 <p>
 213 <b>Combining Options</b><br>
 214 Using the options argument, it is possible to combine different types of listeners:<br>
 215 <br>
 216 A delayed, one-time listener.
 217 <pre><code>myDataView.on(<em>'click'</em>, this.onClick, this, {
 218 single: true,
 219 delay: 100
 220 });</code></pre>
 221 <p>
 222 <b>Attaching multiple handlers in 1 call</b><br>
 223 The method also allows for a single argument to be passed which is a config object containing properties
 224 which specify multiple handlers.
 225 <p>
 226 <pre><code>myGridPanel.on({
 227 <em>'click'</em> : {
 228     fn: this.onClick,
 229     scope: this,
 230     delay: 100
 231 },
 232 <em>'mouseover'</em> : {
 233     fn: this.onMouseOver,
 234     scope: this
 235 },
 236 <em>'mouseout'</em> : {
 237     fn: this.onMouseOut,
 238     scope: this
 239 }
 240 });</code></pre>
 241 <p>
 242 Or a shorthand syntax:<br>
 243 <pre><code>myGridPanel.on({
 244 <em>'click'</em> : this.onClick,
 245 <em>'mouseover'</em> : this.onMouseOver,
 246 <em>'mouseout'</em> : this.onMouseOut,
 247  scope: this
 248 });</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 "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-collapseAllGroups"></a><b><a href="source/GroupingView.html#method-Ext.grid.GroupingView-collapseAllGroups">collapseAllGroups</a></b>()
 249     :
 250                                         void<div class="mdesc"><div class="short">Collapses all grouped rows.</div><div class="long">Collapses all grouped rows.<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">GroupingView</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</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>(&nbsp;<code>String/Array&nbsp;events</code>&nbsp;)
 251     :
 252                                         void<div class="mdesc"><div class="short">Enables events fired by this Observable to bubble up an owner hierarchy by calling
 253 this.getBubbleTarget() if present....</div><div class="long"><p>Enables events fired by this Observable to bubble up an owner hierarchy by calling
 254 <code>this.getBubbleTarget()</code> if present. There is no implementation in the Observable base class.</p>
 255 <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
 256 implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to
 257 access the required target more quickly.</p>
 258 <p>Example:</p><pre><code>Ext.override(Ext.form.Field, {
 259     <i>//  Add functionality to Field&#39;s initComponent to enable the change event to bubble</i>
 260     initComponent : Ext.form.Field.prototype.initComponent.createSequence(<b>function</b>() {
 261         this.enableBubble(<em>'change'</em>);
 262     }),
 263
 264     <i>//  We know that we want Field&#39;s events to bubble directly to the FormPanel.</i>
 265     getBubbleTarget : <b>function</b>() {
 266         <b>if</b> (!this.formPanel) {
 267             this.formPanel = this.findParentByType(<em>'form'</em>);
 268         }
 269         <b>return</b> this.formPanel;
 270     }
 271 });
 272
 273 <b>var</b> myForm = <b>new</b> Ext.formPanel({
 274     title: <em>'User Details'</em>,
 275     items: [{
 276         ...
 277     }],
 278     listeners: {
 279         change: <b>function</b>() {
 280             <i>// Title goes red <b>if</b> form has been modified.</i>
 281             myForm.header.setStyle(<em>'color'</em>, <em>'red'</em>);
 282         }
 283     }
 284 });</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 "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-expandAllGroups"></a><b><a href="source/GroupingView.html#method-Ext.grid.GroupingView-expandAllGroups">expandAllGroups</a></b>()
 285     :
 286                                         void<div class="mdesc"><div class="short">Expands all grouped rows.</div><div class="long">Expands all grouped rows.<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">GroupingView</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-findCellIndex"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-findCellIndex">findCellIndex</a></b>(&nbsp;<code>HTMLElement&nbsp;el</code>&nbsp;)
 287     :
 288                                         Number<div class="mdesc"><div class="short">Return the index of the grid column which contains the passed HTMLElement.
 289 See also findRowIndex</div><div class="long"><p>Return the index of the grid column which contains the passed HTMLElement.</p>
 290 See also <a href="output/Ext.grid.GridView.html#Ext.grid.GridView-findRowIndex" ext:member="findRowIndex" ext:cls="Ext.grid.GridView">findRowIndex</a><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : HTMLElement<div class="sub-desc">The target element</div></li></ul><strong>Returns:</strong><ul><li><code>Number</code><div class="sub-desc">The column index, or &lt;b&gt;false&lt;/b&gt; if the target element is not within a row of this GridView.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#findCellIndex" ext:member="#findCellIndex" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-findRow"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-findRow">findRow</a></b>(&nbsp;<code>HTMLElement&nbsp;el</code>&nbsp;)
 291     :
 292                                         HTMLElement<div class="mdesc"><div class="short">Return the HtmlElement representing the grid row which contains the passed element.</div><div class="long">Return the HtmlElement representing the grid row which contains the passed element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : HTMLElement<div class="sub-desc">The target HTMLElement</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement</code><div class="sub-desc">The row element, or null if the target element is not within a row of this GridView.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#findRow" ext:member="#findRow" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-findRowBody"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-findRowBody">findRowBody</a></b>(&nbsp;<code>HTMLElement&nbsp;el</code>&nbsp;)
 293     :
 294                                         HTMLElement<div class="mdesc"><div class="short">Return the HtmlElement representing the grid row body which contains the passed element.</div><div class="long">Return the HtmlElement representing the grid row body which contains the passed element.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : HTMLElement<div class="sub-desc">The target HTMLElement</div></li></ul><strong>Returns:</strong><ul><li><code>HTMLElement</code><div class="sub-desc">The row body element, or null if the target element is not within a row body of this GridView.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#findRowBody" ext:member="#findRowBody" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-findRowIndex"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-findRowIndex">findRowIndex</a></b>(&nbsp;<code>HTMLElement&nbsp;el</code>&nbsp;)
 295     :
 296                                         Number<div class="mdesc"><div class="short">Return the index of the grid row which contains the passed HTMLElement.
 297 See also findCellIndex</div><div class="long">Return the index of the grid row which contains the passed HTMLElement.
 298 See also <a href="output/Ext.grid.GridView.html#Ext.grid.GridView-findCellIndex" ext:member="findCellIndex" ext:cls="Ext.grid.GridView">findCellIndex</a><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>el</code> : HTMLElement<div class="sub-desc">The target HTMLElement</div></li></ul><strong>Returns:</strong><ul><li><code>Number</code><div class="sub-desc">The row index, or &lt;b&gt;false&lt;/b&gt; if the target element is not within a row of this GridView.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#findRowIndex" ext:member="#findRowIndex" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</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>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Object...&nbsp;args</code>&nbsp;)
 299     :
 300                                         Boolean<div class="mdesc"><div class="short">Fires the specified event with the passed parameters (minus the event name).
 301 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>
 302 <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>)
 303 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">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-focusCell"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-focusCell">focusCell</a></b>(&nbsp;<code>Number&nbsp;row</code>,&nbsp;<code>Number&nbsp;col</code>&nbsp;)
 304     :
 305                                         void<div class="mdesc"><div class="short">Focuses the specified cell.</div><div class="long">Focuses the specified cell.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>row</code> : Number<div class="sub-desc">The row index</div></li><li><code>col</code> : Number<div class="sub-desc">The column index</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#focusCell" ext:member="#focusCell" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-focusRow"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-focusRow">focusRow</a></b>(&nbsp;<code>Number&nbsp;row</code>&nbsp;)
 306     :
 307                                         void<div class="mdesc"><div class="short">Focuses the specified row.</div><div class="long">Focuses the specified row.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>row</code> : Number<div class="sub-desc">The row index</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#focusRow" ext:member="#focusRow" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-getCell"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-getCell">getCell</a></b>(&nbsp;<code>Number&nbsp;row</code>,&nbsp;<code>Number&nbsp;col</code>&nbsp;)
 308     :
 309                                         HtmlElement<div class="mdesc"><div class="short">Returns the grid's &amp;lt;td&gt; HtmlElement at the specified coordinates.</div><div class="long">Returns the grid's <tt>&lt;td></tt> HtmlElement at the specified coordinates.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>row</code> : Number<div class="sub-desc">The row index in which to find the cell.</div></li><li><code>col</code> : Number<div class="sub-desc">The column index of the cell.</div></li></ul><strong>Returns:</strong><ul><li><code>HtmlElement</code><div class="sub-desc">The td at the specified coordinates.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#getCell" ext:member="#getCell" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-getGridInnerWidth"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-getGridInnerWidth">getGridInnerWidth</a></b>()
 310     :
 311                                         Number<div class="mdesc"><div class="short">Returns the total internal width available to the grid, taking the scrollbar into account</div><div class="long">Returns the total internal width available to the grid, taking the scrollbar into account<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 total width</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#getGridInnerWidth" ext:member="#getGridInnerWidth" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-getGroupId"></a><b><a href="source/GroupingView.html#method-Ext.grid.GroupingView-getGroupId">getGroupId</a></b>(&nbsp;<code>String&nbsp;value</code>&nbsp;)
 312     :
 313                                         String<div class="mdesc"><div class="short">Dynamically tries to determine the groupId of a specific value</div><div class="long">Dynamically tries to determine the groupId of a specific value<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>value</code> : String<div class="sub-desc"></div></li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">The group id</div></li></ul></div></div></div></td><td class="msource">GroupingView</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-getHeaderCell"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-getHeaderCell">getHeaderCell</a></b>(&nbsp;<code>Number&nbsp;index</code>&nbsp;)
 314     :
 315                                         HtmlElement<div class="mdesc"><div class="short">Return the &amp;lt;td&gt; HtmlElement which represents the Grid's header cell for the specified column index.</div><div class="long">Return the <tt>&lt;td></tt> HtmlElement which represents the Grid's header cell for the specified column index.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>index</code> : Number<div class="sub-desc">The column index</div></li></ul><strong>Returns:</strong><ul><li><code>HtmlElement</code><div class="sub-desc">The td element.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#getHeaderCell" ext:member="#getHeaderCell" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-getRow"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-getRow">getRow</a></b>(&nbsp;<code>Number&nbsp;index</code>&nbsp;)
 316     :
 317                                         HtmlElement<div class="mdesc"><div class="short">Return the &amp;lt;div&gt; HtmlElement which represents a Grid row for the specified index.</div><div class="long">Return the <tt>&lt;div></tt> HtmlElement which represents a Grid row for the specified index.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>index</code> : Number<div class="sub-desc">The row index</div></li></ul><strong>Returns:</strong><ul><li><code>HtmlElement</code><div class="sub-desc">The div element.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#getRow" ext:member="#getRow" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-getRowClass"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-getRowClass">getRowClass</a></b>(&nbsp;<code>Record&nbsp;record</code>,&nbsp;<code>Number&nbsp;index</code>,&nbsp;<code>Object&nbsp;rowParams</code>,&nbsp;<code>Store&nbsp;store</code>&nbsp;)
 318     :
 319                                         String<div class="mdesc"><div class="short">Override this function to apply custom CSS classes to rows during rendering.  You can also supply custom
 320 parameters t...</div><div class="long">Override this function to apply custom CSS classes to rows during rendering.  You can also supply custom
 321 parameters to the row template for the current row to customize how it is rendered using the <b>rowParams</b>
 322 parameter.  This function should return the CSS class name (or empty string '' for none) that will be added
 323 to the row's wrapping div.  To apply multiple class names, simply return them space-delimited within the string
 324 (e.g., 'my-class another-class'). Example usage:
 325     <pre><code>viewConfig: {
 326     forceFit: true,
 327     showPreview: true, <i>// custom property</i>
 328     enableRowBody: true, <i>// required to create a second, full-width row to show expanded Record data</i>
 329     getRowClass: <b>function</b>(record, rowIndex, rp, ds){ <i>// rp = rowParams</i>
 330         <b>if</b>(this.showPreview){
 331             rp.body = <em>'&lt;p>'</em>+record.data.excerpt+<em>'&lt;/p>'</em>;
 332             <b>return</b> <em>'x-grid3-row-expanded'</em>;
 333         }
 334         <b>return</b> <em>'x-grid3-row-collapsed'</em>;
 335     }
 336 },</code></pre><div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>record</code> : Record<div class="sub-desc">The <a href="output/Ext.data.Record.html" ext:cls="Ext.data.Record">Ext.data.Record</a> corresponding to the current row.</div></li><li><code>index</code> : Number<div class="sub-desc">The row index.</div></li><li><code>rowParams</code> : Object<div class="sub-desc">A config object that is passed to the row template during rendering that allows
 337 customization of various aspects of a grid row.
 338 <p>If <a href="output/Ext.grid.GridView.html#Ext.grid.GridView-enableRowBody" ext:member="enableRowBody" ext:cls="Ext.grid.GridView">enableRowBody</a> is configured <b><tt></tt>true</b>, then the following properties may be set
 339 by this function, and will be used to render a full-width expansion row below each grid row:</p>
 340 <ul>
 341 <li><code>body</code> : String <div class="sub-desc">An HTML fragment to be used as the expansion row's body content (defaults to '').</div></li>
 342 <li><code>bodyStyle</code> : String <div class="sub-desc">A CSS style specification that will be applied to the expansion row's &lt;tr> element. (defaults to '').</div></li>
 343 </ul>
 344 The following property will be passed in, and may be appended to:
 345 <ul>
 346 <li><code>tstyle</code> : String <div class="sub-desc">A CSS style specification that willl be applied to the &lt;table> element which encapsulates
 347 both the standard grid row, and any expansion row.</div></li>
 348 </ul></div></li><li><code>store</code> : Store<div class="sub-desc">The <a href="output/Ext.data.Store.html" ext:cls="Ext.data.Store">Ext.data.Store</a> this grid is bound to</div></li></ul><strong>Returns:</strong><ul><li><code>String</code><div class="sub-desc">a CSS class name to add to the row.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#getRowClass" ext:member="#getRowClass" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-handleHdMenuClickDefault"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-handleHdMenuClickDefault">handleHdMenuClickDefault</a></b>(&nbsp;<code>Ext.menu.BaseItem&nbsp;item</code>&nbsp;)
 349     :
 350                                         void<div class="mdesc"><div class="short">Called by handleHdMenuClick if any button except a sort ASC/DESC button was clicked. The default implementation provi...</div><div class="long">Called by handleHdMenuClick if any button except a sort ASC/DESC button was clicked. The default implementation provides
 351 the column hide/show functionality based on the check state of the menu item. A different implementation can be provided
 352 if needed.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>item</code> : Ext.menu.BaseItem<div class="sub-desc">The menu item that was clicked</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#handleHdMenuClickDefault" ext:member="#handleHdMenuClickDefault" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</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>(&nbsp;<code>String&nbsp;eventName</code>&nbsp;)
 353     :
 354                                         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">&nbsp;</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>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Function&nbsp;handler</code>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;scope</code>]</span>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;options</code>]</span>&nbsp;)
 355     :
 356                                         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.
 357 <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">&nbsp;</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>()
 358     :
 359                                         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">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-refresh"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-refresh">refresh</a></b>(&nbsp;<span title="Optional" class="optional">[<code>Boolean&nbsp;headersToo</code>]</span>&nbsp;)
 360     :
 361                                         void<div class="mdesc"><div class="short">Refreshs the grid UI</div><div class="long">Refreshs the grid UI<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>headersToo</code> : Boolean<div class="sub-desc">(optional) True to also refresh the headers</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#refresh" ext:member="#refresh" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</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>(&nbsp;<code>Object&nbsp;o</code>,&nbsp;<code>Array&nbsp;events</code>&nbsp;)
 362     :
 363                                         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">&nbsp;</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>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Function&nbsp;handler</code>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;scope</code>]</span>&nbsp;)
 364     :
 365                                         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">&nbsp;</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>()
 366     :
 367                                         void<div class="mdesc"><div class="short">Resume firing events. (see suspendEvents)
 368 If events were suspended using the queueSuspended parameter, then all
 369 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>)
 370 If events were suspended using the <tt><b>queueSuspended</b></tt> parameter, then all
 371 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">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-scrollToTop"></a><b><a href="source/GridView.html#method-Ext.grid.GridView-scrollToTop">scrollToTop</a></b>()
 372     :
 373                                         void<div class="mdesc"><div class="short">Scrolls the grid to the top</div><div class="long">Scrolls the grid to the top<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.grid.GridView.html#scrollToTop" ext:member="#scrollToTop" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</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>(&nbsp;<code>Boolean&nbsp;queueSuspended</code>&nbsp;)
 374     :
 375                                         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
 376 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 "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-toggleAllGroups"></a><b><a href="source/GroupingView.html#method-Ext.grid.GroupingView-toggleAllGroups">toggleAllGroups</a></b>(&nbsp;<span title="Optional" class="optional">[<code>Boolean&nbsp;expanded</code>]</span>&nbsp;)
 377     :
 378                                         void<div class="mdesc"><div class="short">Toggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed.</div><div class="long">Toggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>expanded</code> : Boolean<div class="sub-desc">(optional)</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">GroupingView</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-toggleGroup"></a><b><a href="source/GroupingView.html#method-Ext.grid.GroupingView-toggleGroup">toggleGroup</a></b>(&nbsp;<code>String&nbsp;groupId</code>,&nbsp;<span title="Optional" class="optional">[<code>Boolean&nbsp;expanded</code>]</span>&nbsp;)
 379     :
 380                                         void<div class="mdesc"><div class="short">Toggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed...</div><div class="long">Toggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>groupId</code> : String<div class="sub-desc">The groupId assigned to the group (see getGroupId)</div></li><li><code>expanded</code> : Boolean<div class="sub-desc">(optional)</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">GroupingView</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GroupingView-toggleRowIndex"></a><b><a href="source/GroupingView.html#method-Ext.grid.GroupingView-toggleRowIndex">toggleRowIndex</a></b>(&nbsp;<code>Number&nbsp;rowIndex</code>,&nbsp;<span title="Optional" class="optional">[<code>Boolean&nbsp;expanded</code>]</span>&nbsp;)
 381     :
 382                                         void<div class="mdesc"><div class="short">Toggle the group that contains the specific row.</div><div class="long">Toggle the group that contains the specific row.<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>rowIndex</code> : Number<div class="sub-desc">The row inside the group</div></li><li><code>expanded</code> : Boolean<div class="sub-desc">(optional)</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">GroupingView</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</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>(&nbsp;<code>String&nbsp;eventName</code>,&nbsp;<code>Function&nbsp;handler</code>,&nbsp;<span title="Optional" class="optional">[<code>Object&nbsp;scope</code>]</span>&nbsp;)
 383     :
 384                                         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></tbody></table><a id="Ext.grid.GroupingView-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">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-beforerefresh"></a><b><a href="source/GridView.html#event-Ext.grid.GridView-beforerefresh">beforerefresh</a></b> :
 385                                       (&nbsp;<code>Ext.grid.GridView&nbsp;view</code>&nbsp;)
 386     <div class="mdesc"><div class="short">Internal UI Event. Fired before the view is refreshed.</div><div class="long">Internal UI Event. Fired before the view is refreshed.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>view</code> : Ext.grid.GridView<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#beforerefresh" ext:member="#beforerefresh" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-beforerowremoved"></a><b><a href="source/GridView.html#event-Ext.grid.GridView-beforerowremoved">beforerowremoved</a></b> :
 387                                       (&nbsp;<code>Ext.grid.GridView&nbsp;view</code>,&nbsp;<code>Number&nbsp;rowIndex</code>,&nbsp;<code>Ext.data.Record&nbsp;record</code>&nbsp;)
 388     <div class="mdesc"><div class="short">Internal UI Event. Fired before a row is removed.</div><div class="long">Internal UI Event. Fired before a row is removed.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>view</code> : Ext.grid.GridView<div class="sub-desc"></div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The index of the row to be removed.</div></li><li><code>record</code> : Ext.data.Record<div class="sub-desc">The Record to be removed</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#beforerowremoved" ext:member="#beforerowremoved" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-beforerowsinserted"></a><b><a href="source/GridView.html#event-Ext.grid.GridView-beforerowsinserted">beforerowsinserted</a></b> :
 389                                       (&nbsp;<code>Ext.grid.GridView&nbsp;view</code>,&nbsp;<code>Number&nbsp;firstRow</code>,&nbsp;<code>Number&nbsp;lastRow</code>&nbsp;)
 390     <div class="mdesc"><div class="short">Internal UI Event. Fired before rows are inserted.</div><div class="long">Internal UI Event. Fired before rows are inserted.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>view</code> : Ext.grid.GridView<div class="sub-desc"></div></li><li><code>firstRow</code> : Number<div class="sub-desc">The index of the first row to be inserted.</div></li><li><code>lastRow</code> : Number<div class="sub-desc">The index of the last row to be inserted.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#beforerowsinserted" ext:member="#beforerowsinserted" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-refresh"></a><b><a href="source/GridView.html#event-Ext.grid.GridView-refresh">refresh</a></b> :
 391                                       (&nbsp;<code>Ext.grid.GridView&nbsp;view</code>&nbsp;)
 392     <div class="mdesc"><div class="short">Internal UI Event. Fired after the GridView's body has been refreshed.</div><div class="long">Internal UI Event. Fired after the GridView's body has been refreshed.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>view</code> : Ext.grid.GridView<div class="sub-desc"></div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#refresh" ext:member="#refresh" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-rowremoved"></a><b><a href="source/GridView.html#event-Ext.grid.GridView-rowremoved">rowremoved</a></b> :
 393                                       (&nbsp;<code>Ext.grid.GridView&nbsp;view</code>,&nbsp;<code>Number&nbsp;rowIndex</code>,&nbsp;<code>Ext.data.Record&nbsp;record</code>&nbsp;)
 394     <div class="mdesc"><div class="short">Internal UI Event. Fired after a row is removed.</div><div class="long">Internal UI Event. Fired after a row is removed.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>view</code> : Ext.grid.GridView<div class="sub-desc"></div></li><li><code>rowIndex</code> : Number<div class="sub-desc">The index of the row that was removed.</div></li><li><code>record</code> : Ext.data.Record<div class="sub-desc">The Record that was removed</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#rowremoved" ext:member="#rowremoved" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-rowsinserted"></a><b><a href="source/GridView.html#event-Ext.grid.GridView-rowsinserted">rowsinserted</a></b> :
 395                                       (&nbsp;<code>Ext.grid.GridView&nbsp;view</code>,&nbsp;<code>Number&nbsp;firstRow</code>,&nbsp;<code>Number&nbsp;lastRow</code>&nbsp;)
 396     <div class="mdesc"><div class="short">Internal UI Event. Fired after rows are inserted.</div><div class="long">Internal UI Event. Fired after rows are inserted.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>view</code> : Ext.grid.GridView<div class="sub-desc"></div></li><li><code>firstRow</code> : Number<div class="sub-desc">The index of the first inserted.</div></li><li><code>lastRow</code> : Number<div class="sub-desc">The index of the last row inserted.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#rowsinserted" ext:member="#rowsinserted" ext:cls="Ext.grid.GridView">GridView</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.grid.GridView-rowupdated"></a><b><a href="source/GridView.html#event-Ext.grid.GridView-rowupdated">rowupdated</a></b> :
 397                                       (&nbsp;<code>Ext.grid.GridView&nbsp;view</code>,&nbsp;<code>Number&nbsp;firstRow</code>,&nbsp;<code>Ext.data.record&nbsp;record</code>&nbsp;)
 398     <div class="mdesc"><div class="short">Internal UI Event. Fired after a row has been updated.</div><div class="long">Internal UI Event. Fired after a row has been updated.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>view</code> : Ext.grid.GridView<div class="sub-desc"></div></li><li><code>firstRow</code> : Number<div class="sub-desc">The index of the row updated.</div></li><li><code>record</code> : Ext.data.record<div class="sub-desc">The Record backing the row updated.</div></li></ul></div></div></div></td><td class="msource"><a href="output/Ext.grid.GridView.html#rowupdated" ext:member="#rowupdated" ext:cls="Ext.grid.GridView">GridView</a></td></tr></tbody></table></div>