ext.grid.groupingview.html.svn-base

来自「PHP 知识管理系统（基于树结构的知识管理系统）, 英文原版的PHP源码。」· SVN-BASE 代码 · 共 989 行 · 第 1/5 页

        <div class="body-wrap">
        <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>
            <a class="inner-link" href="#Ext.grid.GroupingView-methods"><img src="../resources/images/default/s.gif" class="item-icon icon-method">Methods</a>
            <a class="inner-link" href="#Ext.grid.GroupingView-events"><img src="../resources/images/default/s.gif" class="item-icon icon-event">Events</a>
                            <a class="inner-link" href="#Ext.grid.GroupingView-configs"><img src="../resources/images/default/s.gif" class="item-icon icon-config">Config Options</a>
                        <a class="bookmark" href="../docs/?class=Ext.grid.GroupingView"><img src="../resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a>
        </div>
                <div class="inheritance res-block">
<pre class="res-block-inner"><a ext:cls="Ext.util.Observable" ext:member="" href="output/Ext.util.Observable.html">Observable</a>
  <img src="resources/elbow-end.gif"/><a ext:cls="Ext.grid.GridView" ext:member="" href="output/Ext.grid.GridView.html">GridView</a>
    <img src="resources/elbow-end.gif"/>GroupingView</pre></div>
                <h1>Class Ext.grid.GroupingView</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">GroupingView.js</td></tr>
            <tr><td class="label">Class:</td><td class="hd-info">GroupingView</td></tr>
                                    <tr><td class="label">Extends:</td><td class="hd-info"><a ext:cls="Ext.grid.GridView" ext:member="" href="output/Ext.grid.GridView.html">GridView</a></td></tr>
                    </table>
        <div class="description">
            Adds the ability for single level grouping to the grid.
<pre><code>var grid = <b>new</b> Ext.grid.GridPanel({
    <i>// A groupingStore is required <b>for</b> a GroupingView</i>
    store: <b>new</b> Ext.data.GroupingStore({
        reader: reader,
        data: xg.dummyData,
        sortInfo:{field: <em>'company'</em>, direction: <em>"ASC"</em>},
        groupField:<em>'industry'</em>
    }),

    columns: [
        {id:<em>'company'</em>,header: <em>"Company"</em>, width: 60, sortable: true, dataIndex: <em>'company'</em>},
        {header: <em>"Price"</em>, width: 20, sortable: true, renderer: Ext.util.Format.usMoney, dataIndex: <em>'price'</em>},
        {header: <em>"Change"</em>, width: 20, sortable: true, dataIndex: <em>'change'</em>, renderer: Ext.util.Format.usMoney},
        {header: <em>"Industry"</em>, width: 20, sortable: true, dataIndex: <em>'industry'</em>},
        {header: <em>"Last Updated"</em>, width: 20, sortable: true, renderer: Ext.util.Format.dateRenderer(<em>'m/d/Y'</em>), dataIndex: <em>'lastChange'</em>}
    ],

    view: <b>new</b> Ext.grid.GroupingView({
        forceFit:true,
        <i>// custom grouping text template to display the number of items per group</i>
        groupTextTpl: <em>'{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'</em>
    }),

    frame:true,
    width: 700,
    height: 450,
    collapsible: true,
    animCollapse: false,
    title: <em>'Grouping Example'</em>,
    iconCls: <em>'icon-grid'</em>,
    renderTo: document.body
});</code></pre>        </div>
        
        <div class="hr"></div>
                <a id="Ext.grid.GroupingView-configs"></a>
        <h2>Config Options</h2>
        <table cellspacing="0" class="member-table">
            <tr>
                <th class="sig-header" colspan="2">Config Options</th>
                <th class="msource-header">Defined By</th>
            </tr>
                <tr class="config-row inherited">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-autoFill"></a>
            <b>autoFill</b> : Boolean            <div class="mdesc">
                            True to auto expand the columns to fit the grid <b>when the grid is created</b>.                        </div>
        </td>
        <td class="msource"><a ext:cls="Ext.grid.GridView" ext:member="#autoFill" href="output/Ext.grid.GridView.html#autoFill">GridView</a></td>
    </tr>
        <tr class="config-row inherited alt">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-deferEmptyText"></a>
            <b>deferEmptyText</b> : Boolean            <div class="mdesc">
                            True to defer emptyText being applied until the store's first load                        </div>
        </td>
        <td class="msource"><a ext:cls="Ext.grid.GridView" ext:member="#deferEmptyText" href="output/Ext.grid.GridView.html#deferEmptyText">GridView</a></td>
    </tr>
        <tr class="config-row">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-emptyGroupText"></a>
            <b>emptyGroupText</b> : String            <div class="mdesc">
                            The text to display when there is an empty group value                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row inherited alt">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-emptyText"></a>
            <b>emptyText</b> : String            <div class="mdesc">
                            Default text to display in the grid body when no rows are available (defaults to '').                        </div>
        </td>
        <td class="msource"><a ext:cls="Ext.grid.GridView" ext:member="#emptyText" href="output/Ext.grid.GridView.html#emptyText">GridView</a></td>
    </tr>
        <tr class="config-row">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-enableGrouping"></a>
            <b>enableGrouping</b> : Boolean            <div class="mdesc">
                            False to disable grouping functionality (defaults to true)                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row alt">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-enableGroupingMenu"></a>
            <b>enableGroupingMenu</b> : Boolean            <div class="mdesc">
                            True to enable the grouping control in the column menu                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-enableNoGroups"></a>
            <b>enableNoGroups</b> : Boolean            <div class="mdesc">
                            True to allow the user to turn off grouping                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row inherited alt expandable">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-enableRowBody"></a>
            <b>enableRowBody</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 that spans beneath the data row. Use t...</div>
            <div class="long">
                True to add a second TR element per row that can be used to provide a row body that spans beneath the data row. Use the <a ext:cls="Ext.grid.GridView" ext:member="getRowClass" href="output/Ext.grid.GridView.html#getRowClass">getRowClass</a> method's rowParams config to customize the row body.            </div>
                        </div>
        </td>
        <td class="msource"><a ext:cls="Ext.grid.GridView" ext:member="#enableRowBody" href="output/Ext.grid.GridView.html#enableRowBody">GridView</a></td>
    </tr>
        <tr class="config-row inherited">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-forceFit"></a>
            <b>forceFit</b> : Boolean            <div class="mdesc">
                            True to auto expand/contract the size of the columns to fit the grid width and prevent horizontal scrolling.                        </div>
        </td>
        <td class="msource"><a ext:cls="Ext.grid.GridView" ext:member="#forceFit" href="output/Ext.grid.GridView.html#forceFit">GridView</a></td>
    </tr>
        <tr class="config-row alt">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-groupByText"></a>
            <b>groupByText</b> : String            <div class="mdesc">
                            Text displayed in the grid header menu for grouping by a column (defaults to 'Group By This Field').                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row expandable">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-groupRenderer"></a>
            <b>groupRenderer</b> : Function            <div class="mdesc">
                        <div class="short">The function used to format the grouping field value for display in the group header. Should return a string value. T...</div>
            <div class="long">
                The function used to format the grouping field value for display in the group header. Should return a string value. This takes the following parameters: <div class="mdetail-params"><ul> <li><b>v</b> : Object<p class="sub-desc">The new value of the group field.</p></li> <li><b>unused</b> : undefined<p class="sub-desc">Unused parameter.</p></li> <li><b>r</b> : Ext.data.Record<p class="sub-desc">The Record providing the data for the row which caused group change.</p></li> <li><b>rowIndex</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li> <li><b>colIndex</b> : Number<p class="sub-desc">The column index of the group field.</p></li> <li><b>ds</b> : Ext.data.Store<p class="sub-desc">The Store which is providing the data Model.</p></li> </ul></div></p>            </div>
                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row alt expandable">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-groupTextTpl"></a>
            <b>groupTextTpl</b> : String            <div class="mdesc">
                        <div class="short">The template used to render the group header. This is used to format an object which contains the following propertie...</div>
            <div class="long">
                The template used to render the group header. This is used to format an object which contains the following properties: <div class="mdetail-params"><ul> <li><b>group</b> : String<p class="sub-desc">The <i>rendered</i> value of the group field. By default this is the unchanged value of the group field. If a <a ext:cls="Ext.grid.GroupingView" ext:member="groupRenderer" href="output/Ext.grid.GroupingView.html#groupRenderer">groupRenderer</a> is specified, it is the result of a call to that.</p></li> <li><b>gvalue</b> : Object<p class="sub-desc">The <i>raw</i> value of the group field.</p></li> <li><b>text</b> : String<p class="sub-desc">The configured <a ext:cls="Ext.grid.GroupingView" ext:member="header" href="output/Ext.grid.GroupingView.html#header">header</a> (If <a ext:cls="Ext.grid.GroupingView" ext:member="showGroupName" href="output/Ext.grid.GroupingView.html#showGroupName">showGroupName</a> is true) plus the <i>rendered</i>group field value.</p></li> <li><b>groupId</b> : String<p class="sub-desc">A unique, generated ID which is applied to the View Element which contains the group.</p></li> <li><b>startRow</b> : Number<p class="sub-desc">The row index of the Record which caused group change.</p></li> <li><b>rs</b> : Array<p class="sub-desc">.Contains a single element: The Record providing the data for the row which caused group change.</p></li> <li><b>cls</b> : String<p class="sub-desc">The generated class name string to apply to the group header Element.</p></li> <li><b>style</b> : String<p class="sub-desc">The inline style rules to apply to the group header Element.</p></li> </ul></div></p> See <a ext:cls="Ext.XTemplate" href="output/Ext.XTemplate.html">Ext.XTemplate</a> for information on how to format data using a template.            </div>
                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-header"></a>
            <b>header</b> : String            <div class="mdesc">
                            The text with which to prefix the group field value in the group header line.                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row alt">
        <td class="micon"><a class="exi" href="#expand">&nbsp;</a></td>
        <td class="sig">
        <a id="Ext.grid.GroupingView-hideGroupedColumn"></a>
            <b>hideGroupedColumn</b> : Boolean            <div class="mdesc">
                            True to hide the column that is currently grouped                        </div>
        </td>
        <td class="msource">GroupingView</td>
    </tr>
        <tr class="config-row">