| autoFill : BooleanDefaults to false. Specify true to have the column widths re-proportioned
-when the grid is initially rendered. The ... Defaults to false. Specify true to have the column widths re-proportioned
-when the grid is initially rendered. The
+ Adds the ability for single level grouping to the grid. A GroupingStore
+must be used to enable grouping. Some grouping characteristics may also be configured at the
+ Column level
+ Sample usage:
+ var grid = new Ext.grid.GridPanel({
+ // A groupingStore is required for a GroupingView
+ store: new Ext.data.GroupingStore({
+ autoDestroy: true,
+ reader: reader,
+ data: xg.dummyData,
+ sortInfo: {field: 'company', direction: 'ASC'},
+ groupOnSort: true,
+ remoteGroup: true,
+ groupField: 'industry'
+ }),
+ colModel: new Ext.grid.ColumnModel({
+ columns:[
+ {id:'company',header: 'Company', width: 60, dataIndex: 'company'},
+ // groupable, groupName, groupRender are also configurable at column level
+ {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price', groupable: false},
+ {header: 'Change', dataIndex: 'change', renderer: Ext.util.Format.usMoney},
+ {header: 'Industry', dataIndex: 'industry'},
+ {header: 'Last Updated', renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
+ ],
+ defaults: {
+ sortable: true,
+ menuDisabled: false,
+ width: 20
+ }
+ }),
+
+ view: new Ext.grid.GroupingView({
+ forceFit: true,
+ // custom grouping text template to display the number of items per group
+ groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
+ }),
+
+ frame:true,
+ width: 700,
+ height: 450,
+ collapsible: true,
+ animCollapse: false,
+ title: 'Grouping Example',
+ iconCls: 'icon-grid',
+ renderTo: document.body
+});
Config Options|
| autoFill : BooleanDefaults to false. Specify true to have the column widths re-proportioned
+when the grid is initially rendered. The
+... Defaults to false. Specify true to have the column widths re-proportioned
+when the grid is initially rendered. The
initially configured width of each column will be adjusted
to fit the grid width and prevent horizontal scrolling. If columns are later resized (manually
or programmatically), the other columns in the grid will not be resized to fit the grid width.
-See forceFit also. | GridView | | cellSelector : String The selector used to find cells internally (defaults to 'td.x-grid3-cell') | GridView | | cellSelectorDepth : Number The number of levels to search for cells in event delegation (defaults to 4) | GridView | | columnsText : String The text displayed in the 'Columns' menu item (defaults to 'Columns') | GridView | | deferEmptyText : BooleanTrue to defer emptyText being applied until the store's
-first load (defaults to true). | GridView | | emptyGroupText : StringThe text to display when there is an empty group value (defaults to '(None)').
-May also be specified per column, see... The text to display when there is an empty group value (defaults to '(None)').
-May also be specified per column, see Ext.grid.Column. emptyGroupText. | GroupingView | | emptyText : StringDefault text (html tags are accepted) to display in the grid body when no rows
+See forceFit also. | GridView | | cancelEditOnToggle : Boolean True to cancel any editing when the group header is toggled. Defaults to true. | GroupingView | | cellSelector : String The selector used to find cells internally (defaults to 'td.x-grid3-cell') | GridView | | cellSelectorDepth : Number The number of levels to search for cells in event delegation (defaults to 4) | GridView | | columnsText : String The text displayed in the 'Columns' menu item (defaults to 'Columns') | GridView | | deferEmptyText : BooleanTrue to defer emptyText being applied until the store's
+first load (defaults to true). | GridView | | emptyGroupText : StringThe text to display when there is an empty group value (defaults to '(None)').
+May also be specified per column, see ... The text to display when there is an empty group value (defaults to '(None)').
+May also be specified per column, see Ext.grid.Column. emptyGroupText. | GroupingView | | emptyText : StringDefault text (html tags are accepted) to display in the grid body when no rows
are available (defaults to ''). This v... Default text (html tags are accepted) to display in the grid body when no rows
are available (defaults to ''). This value will be used to update the mainBody:
- this.mainBody.update('<div class="x-grid-empty">' + this.emptyText + '</div>');
| GridView | | enableGrouping : Boolean false to disable grouping functionality (defaults to true) | GroupingView | | enableGroupingMenu : Boolean true to enable the grouping control in the column menu (defaults to true) | GroupingView | | enableNoGroups : Boolean true to allow the user to turn off grouping (defaults to true) | GroupingView | | enableRowBody : BooleanTrue to add a second TR element per row that can be used to provide a row body
+ this.mainBody.update('<div class="x-grid-empty">' + this.emptyText + '</div>');
| GridView | | enableGrouping : Boolean false to disable grouping functionality (defaults to true) | GroupingView | | enableGroupingMenu : Boolean true to enable the grouping control in the column menu (defaults to true) | GroupingView | | enableNoGroups : Boolean true to allow the user to turn off grouping (defaults to true) | GroupingView | | enableRowBody : BooleanTrue to add a second TR element per row that can be used to provide a row body
that spans beneath the data row. Use ... 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 getRowClass method's rowParams config to customize the row body. | GridView | | forceFit : BooleanDefaults to false. Specify true to have the column widths re-proportioned
-at all times. The initially configured wi... Defaults to false. Specify true to have the column widths re-proportioned
-at all times. The initially configured width of each
+that spans beneath the data row. Use the getRowClass method's rowParams config to customize the row body. | GridView | | forceFit : BooleanDefaults to false. Specify true to have the column widths re-proportioned
+at all times.
+The initially configured wid... Defaults to false. Specify true to have the column widths re-proportioned
+at all times.
+ The initially configured width of each
column will be adjusted to fit the grid width and prevent horizontal scrolling. If columns are
later resized (manually or programmatically), the other columns in the grid will be resized
-to fit the grid width. See autoFill also. | GridView | | groupByText : String Text displayed in the grid header menu for grouping by a column
-(defaults to 'Group By This Field'). | GroupingView | | groupMode : StringIndicates how to construct the group identifier. 'value' constructs the id using
-raw value, 'display' constructs the... Indicates how to construct the group identifier. 'value' constructs the id using
-raw value, 'display' constructs the id using the rendered value. Defaults to 'value'. | GroupingView | | groupRenderer : Function | GroupingView | | groupTextTpl : StringThe template used to render the group header (defaults to '{text}').
-This is used to format an object which contains... The template used to render the group header (defaults to '{text}').
-This is used to format an object which contains the following properties:
-
-- group : String
The rendered value of the group field.
-By default this is the unchanged value of the group field. If a groupRenderer
-is specified, it is the result of a call to that function.
-- gvalue : Object
The raw value of the group field.
-- text : String
The configured header (as described in showGroupName)
-if showGroupName is true) plus the rendered group field value.
-- groupId : String
A unique, generated ID which is applied to the
-View Element which contains the group.
-- startRow : Number
The row index of the Record which caused group change.
-- rs : Array
Contains a single element: The Record providing the data
-for the row which caused group change.
-- cls : String
The generated class name string to apply to the group header Element.
-- style : String
The inline style rules to apply to the group header Element.
-
-See Ext.XTemplate for information on how to format data using a template. Possible usage: var grid = new Ext.grid.GridPanel({
- ...
- view: new Ext.grid.GroupingView({
- groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
- }),
-});
| GroupingView | | headersDisabled : BooleanTrue to disable the grid column headers (defaults to false).
-Use the ColumnModel menuDisabled
-config to disable the ... True to disable the grid column headers (defaults to false).
+to fit the grid width.
+ Columns which are configured with fixed: true are omitted from being resized.
+ See autoFill. | GridView | | groupByText : String Text displayed in the grid header menu for grouping by a column
+(defaults to 'Group By This Field'). | GroupingView | | groupMode : StringIndicates how to construct the group identifier. 'value' constructs the id using
+raw value, 'display' constructs the ... Indicates how to construct the group identifier. 'value' constructs the id using
+raw value, 'display' constructs the id using the rendered value. Defaults to 'value'. | GroupingView | | groupRenderer : Function | GroupingView | | groupTextTpl : StringThe template used to render the group header (defaults to '{text}').
+This is used to format an object which contains ... The template used to render the group header (defaults to '{text}').
+This is used to format an object which contains the following properties:
+
+- group : String
The rendered value of the group field.
+By default this is the unchanged value of the group field. If a groupRenderer
+is specified, it is the result of a call to that function.
+- gvalue : Object
The raw value of the group field.
+- text : String
The configured header (as described in showGroupName)
+if showGroupName is true) plus the rendered group field value.
+- groupId : String
A unique, generated ID which is applied to the
+View Element which contains the group.
+- startRow : Number
The row index of the Record which caused group change.
+- rs : Array
Contains a single element: The Record providing the data
+for the row which caused group change.
+- cls : String
The generated class name string to apply to the group header Element.
+- style : String
The inline style rules to apply to the group header Element.
+
+See Ext.XTemplate for information on how to format data using a template. Possible usage: var grid = new Ext.grid.GridPanel({
+ ...
+ view: new Ext.grid.GroupingView({
+ groupTextTpl: '{text} ({[values.rs.length]} {[values.rs.length > 1 ? "Items" : "Item"]})'
+ }),
+});
| GroupingView | | headerMenuOpenCls : String The CSS class to add to the header cell when its menu is visible. Defaults to 'x-grid3-hd-menu-open' | GridView | | headersDisabled : BooleanTrue to disable the grid column headers (defaults to false).
+Use the ColumnModel menuDisabled
+config to disable the m... True to disable the grid column headers (defaults to false).
Use the ColumnModel menuDisabled
config to disable the menu for individual columns. While this config is true the
following will be disabled:
- clicking on header to sort
- the trigger to reveal the menu.
- | GridView | | hideGroupedColumn : Boolean true to hide the column that is currently grouped (defaults to false) | GroupingView | | ignoreAdd : Boolean true to skip refreshing the view when new rows are added (defaults to false) | GroupingView | | listeners : ObjectA config object containing one or more event handlers to be added to this
+ | GridView | | hideGroupedColumn : Boolean true to hide the column that is currently grouped (defaults to false) | GroupingView | | ignoreAdd : Boolean true to skip refreshing the view when new rows are added (defaults to false) | GroupingView | | listeners : ObjectA config object containing one or more event handlers to be added to this
object during initialization. This should ... A config object containing one or more event handlers to be added to this
object during initialization. This should be a valid listeners config object as specified in the
addListener example for attaching multiple handlers at once.
@@ -158,10 +164,10 @@ Ext.DomObserver = Ext.extend(Object, {
typeAhead: true,
mode: 'local',
triggerAction: 'all'
-}); | Observable | | rowBodySelector : String The selector used to find row bodies internally (defaults to 'div.x-grid3-row') | GridView | | rowBodySelectorDepth : Number The number of levels to search for row bodies in event delegation (defaults to 10) | GridView | | rowSelector : String The selector used to find rows internally (defaults to 'div.x-grid3-row') | GridView | | rowSelectorDepth : Number The number of levels to search for rows in event delegation (defaults to 10) | GridView | | scrollOffset : NumberThe amount of space to reserve for the vertical scrollbar
+}); | Observable | | markDirty : Boolean True to show the dirty cell indicator when a cell has been modified. Defaults to true. | GridView | | rowBodySelector : String The selector used to find row bodies internally (defaults to 'div.x-grid3-row') | GridView | | rowBodySelectorDepth : Number The number of levels to search for row bodies in event delegation (defaults to 10) | GridView | | rowOverCls : String The CSS class added to each row when it is hovered over. Defaults to 'x-grid3-row-over' | GridView | | rowSelector : String The selector used to find rows internally (defaults to 'div.x-grid3-row') | GridView | | rowSelectorDepth : Number The number of levels to search for rows in event delegation (defaults to 10) | GridView | | scrollOffset : NumberThe amount of space to reserve for the vertical scrollbar
(defaults to undefined). If an explicit value isn't specifi... The amount of space to reserve for the vertical scrollbar
(defaults to undefined). If an explicit value isn't specified, this will be automatically
-calculated. | GridView | | selectedRowClass : StringThe CSS class applied to a selected row (defaults to 'x-grid3-row-selected'). An
+calculated. | GridView | | selectedRowClass : StringThe CSS class applied to a selected row (defaults to 'x-grid3-row-selected'). An
example overriding the default styli... The CSS class applied to a selected row (defaults to 'x-grid3-row-selected'). An
example overriding the default styling:
.x-grid3-row-selected {background-color: yellow;}
@@ -169,27 +175,27 @@ Note that this only controls the row, and will not do anything for the text insi
facets (like text) use something like:
.x-grid3-row-selected .x-grid3-cell-inner {
color: #FFCC00;
- }
| GridView | | showGroupName : BooleanIf true will display a prefix plus a ': ' before the group field value
-in the group header line. The prefix will co... If true will display a prefix plus a ': ' before the group field value
-in the group header line. The prefix will consist of the groupName
-(or the configured header if not provided) configured in the
- Ext.grid.Column for each set of grouped rows (defaults to true). | GroupingView | | showGroupsText : String Text displayed in the grid header for enabling/disabling grouping
-(defaults to 'Show in Groups'). | GroupingView | | sortAscText : String The text displayed in the 'Sort Ascending' menu item (defaults to 'Sort Ascending') | GridView | | sortClasses : Array The CSS classes applied to a header when it is sorted. (defaults to ['sort-asc', 'sort-desc']) | GridView | | sortDescText : String The text displayed in the 'Sort Descending' menu item (defaults to 'Sort Descending') | GridView | | startCollapsed : Boolean true to start all groups collapsed (defaults to false) | GroupingView |
Public Properties|
| dragZone : Ext.grid.GridDragZoneA customized implementation of a DragZone which provides default implementations
+ } | GridView | | showGroupName : BooleanIf true will display a prefix plus a ': ' before the group field value
+in the group header line. The prefix will con... If true will display a prefix plus a ': ' before the group field value
+in the group header line. The prefix will consist of the groupName
+(or the configured header if not provided) configured in the
+ Ext.grid.Column for each set of grouped rows (defaults to true). | GroupingView | | showGroupsText : String Text displayed in the grid header for enabling/disabling grouping
+(defaults to 'Show in Groups'). | GroupingView | | sortAscText : String The text displayed in the 'Sort Ascending' menu item (defaults to 'Sort Ascending') | GridView | | sortClasses : Array The CSS classes applied to a header when it is sorted. (defaults to ['sort-asc', 'sort-desc']) | GridView | | sortDescText : String The text displayed in the 'Sort Descending' menu item (defaults to 'Sort Descending') | GridView | | startCollapsed : Boolean true to start all groups collapsed (defaults to false) | GroupingView |
Public Properties|
| Ext.Template : masterTpl The master template to use when rendering the GridView. Has a default template | GridView | | bodyTpl : Ext.Template The template to use when rendering the body. Has a default template | GridView | | cellTpl : Ext.Template The template to use to render each cell. Has a default template | GridView | | dragZone : Ext.grid.GridDragZoneA customized implementation of a DragZone which provides default implementations
of the template methods of DragZone ... A customized implementation of a DragZone which provides default implementations
of the template methods of DragZone to enable dragging of the selected rows of a GridPanel.
See Ext.grid.GridDragZone for details.
This will only be present:
- if the owning GridPanel was configured with enableDragDrop: true.
- after the owning GridPanel has been rendered.
- | GridView | | mainBody : Ext.ElementRead-only. The GridView's body Element which encapsulates all rows in the Grid.
+ | GridView | | headerTpl : Ext.Template The template to use when rendering headers. Has a default template | GridView | | mainBody : Ext.ElementRead-only. The GridView's body Element which encapsulates all rows in the Grid.
This Element is only available after ... Read-only. The GridView's body Element which encapsulates all rows in the Grid.
-This Element is only available after the GridPanel has been rendered. | GridView |
Public MethodsPublic Methods|
| GroupingView( Object config )
+ | GroupingView | | addEvents( Object|String o , string Optional. )
+ :
voidAdds the specified events to the list of events which this Observable may fire. Adds the specified events to the list of events which this Observable may fire. | Observable | | addListener( String eventName , Function handler , [Object scope ], [Object options ] )
- :
+Usage:this.addEvents('storeloaded', 'storecleared'); Returns: | Observable | | addListener( String eventName , Function handler , [Object scope ], [Object options ] )
+ :
voidAppends an event handler to this object. Appends an event handler to this object. Parameters:eventName : StringThe name of the event to listen for. handler : FunctionThe method the event invokes. scope : Object(optional) The scope (this reference) in which the handler function is executed.
If omitted, defaults to the object which fired the event. options : Object(optional) An object containing handler configuration.
properties. This may contain any of the following properties:
@@ -239,76 +245,78 @@ Or a shorthand syntax:
'mouseover' : this.onMouseOver,
'mouseout' : this.onMouseOut,
scope: this
-}); Returns: | Observable | | collapseAllGroups()
- :
- voidCollapses all grouped rows. Collapses all grouped rows. | GroupingView | | enableBubble( String/Array events )
- :
- voidEnables events fired by this Observable to bubble up an owner hierarchy by calling
-this.getBubbleTarget() if present... Enables events fired by this Observable to bubble up an owner hierarchy by calling
-this.getBubbleTarget() if present. There is no implementation in the Observable base class.
- This is commonly used by Ext.Components to bubble events to owner Containers. See Ext.Component.getBubbleTarget. The default
-implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to
-access the required target more quickly.
- Example: Ext.override(Ext.form.Field, {
- // Add functionality to Field's initComponent to enable the change event to bubble
- initComponent : Ext.form.Field.prototype.initComponent.createSequence(function() {
- this.enableBubble('change');
- }),
-
- // We know that we want Field's events to bubble directly to the FormPanel.
- getBubbleTarget : function() {
- if (!this.formPanel) {
- this.formPanel = this.findParentByType('form');
- }
- return this.formPanel;
- }
-});
-
-var myForm = new Ext.formPanel({
- title: 'User Details',
- items: [{
- ...
- }],
- listeners: {
- change: function() {
- // Title goes red if form has been modified.
- myForm.header.setStyle('color', 'red');
- }
- }
-});
| Observable | | expandAllGroups()
- :
- voidExpands all grouped rows. Expands all grouped rows. | GroupingView | | findCellIndex( HTMLElement el )
- :
- NumberReturn the index of the grid column which contains the passed HTMLElement.
+}); Returns: | Observable | | collapseAllGroups()
+ :
+ voidCollapses all grouped rows. Collapses all grouped rows. | GroupingView | | enableBubble( String/Array events )
+ :
+ voidEnables events fired by this Observable to bubble up an owner hierarchy by calling
+this.getBubbleTarget() if present.... Enables events fired by this Observable to bubble up an owner hierarchy by calling
+this.getBubbleTarget() if present. There is no implementation in the Observable base class.
+ This is commonly used by Ext.Components to bubble events to owner Containers. See Ext.Component.getBubbleTarget. The default
+implementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to
+access the required target more quickly.
+ Example: Ext.override(Ext.form.Field, {
+ // Add functionality to Field's initComponent to enable the change event to bubble
+ initComponent : Ext.form.Field.prototype.initComponent.createSequence(function() {
+ this.enableBubble('change');
+ }),
+
+ // We know that we want Field's events to bubble directly to the FormPanel.
+ getBubbleTarget : function() {
+ if (!this.formPanel) {
+ this.formPanel = this.findParentByType('form');
+ }
+ return this.formPanel;
+ }
+});
+
+var myForm = new Ext.formPanel({
+ title: 'User Details',
+ items: [{
+ ...
+ }],
+ listeners: {
+ change: function() {
+ // Title goes red if form has been modified.
+ myForm.header.setStyle('color', 'red');
+ }
+ }
+});
| Observable | | expandAllGroups()
+ :
+ voidExpands all grouped rows. Expands all grouped rows. | GroupingView | | findCellIndex( HTMLElement el )
+ :
+ NumberReturn the index of the grid column which contains the passed HTMLElement.
See also findRowIndex Return the index of the grid column which contains the passed HTMLElement.
-See also findRowIndexParameters:el : HTMLElementThe target element Returns: | GridView | | findRow( HTMLElement el )
- :
- HTMLElementReturn the HtmlElement representing the grid row which contains the passed element. Return the HtmlElement representing the grid row which contains the passed element. Parameters:el : HTMLElementThe target HTMLElement Returns: | GridView | | findRowBody( HTMLElement el )
- :
- HTMLElementReturn the HtmlElement representing the grid row body which contains the passed element. Return the HtmlElement representing the grid row body which contains the passed element. Parameters:el : HTMLElementThe target HTMLElement Returns: | GridView | | findRowIndex( HTMLElement el )
- :
- NumberReturn the index of the grid row which contains the passed HTMLElement.
-See also findCellIndex Return the index of the grid row which contains the passed HTMLElement.
-See also findCellIndexParameters:el : HTMLElementThe target HTMLElement Returns: | GridView | | fireEvent( String eventName , Object... args )
- :
- BooleanFires the specified event with the passed parameters (minus the event name).
+See also findRowIndexParameters:el : HTMLElementThe target element Returns: | GridView | | findRow( HTMLElement el )
+ :
+ HTMLElementReturn the HtmlElement representing the grid row which contains the passed element. Return the HtmlElement representing the grid row which contains the passed element. Parameters:el : HTMLElementThe target HTMLElement Returns: | GridView | | findRowBody( HTMLElement el )
+ :
+ HTMLElementReturn the HtmlElement representing the grid row body which contains the passed element. Return the HtmlElement representing the grid row body which contains the passed element. Parameters:el : HTMLElementThe target HTMLElement Returns: | GridView | | findRowIndex( HTMLElement el )
+ :
+ NumberReturn the index of the grid row which contains the passed HTMLElement.
+See also findCellIndex Return the index of the grid row which contains the passed HTMLElement.
+See also findCellIndexParameters:el : HTMLElementThe target HTMLElement Returns: | GridView | | fireEvent( String eventName , Object... args )
+ :
+ BooleanFires the specified event with the passed parameters (minus the event name).
An event may be set to bubble up an Obse... | Observable | | focusCell( Number row , Number col )
- :
- voidFocuses the specified cell. Focuses the specified cell. Parameters:row : NumberThe row index col : NumberThe column index Returns: | GridView | | focusRow( Number row )
- :
- voidFocuses the specified row. Focuses the specified row. Parameters:row : NumberThe row index Returns: | GridView | | getCell( Number row , Number col )
- :
- HtmlElementReturns the grid's <td> HtmlElement at the specified coordinates. Returns the grid's <td> HtmlElement at the specified coordinates. | GridView | | getGroupId( String value )
- :
- StringDynamically tries to determine the groupId of a specific value Dynamically tries to determine the groupId of a specific value | GroupingView | | getHeaderCell( Number index )
- :
- HtmlElementReturn the <td> HtmlElement which represents the Grid's header cell for the specified column index. Return the <td> HtmlElement which represents the Grid's header cell for the specified column index. Parameters:index : NumberThe column index Returns:HtmlElement The td element.
| GridView | | getRow( Number index )
- :
- HtmlElementReturn the <div> HtmlElement which represents a Grid row for the specified index. Return the <div> HtmlElement which represents a Grid row for the specified index. Parameters:index : NumberThe row index Returns:HtmlElement The div element.
| GridView | | getRowClass( Record record , Number index , Object rowParams , Store store )
- :
- StringOverride this function to apply custom CSS classes to rows during rendering. You can also supply custom
+by calling enableBubble. | Observable | | focusCell( Number row , Number col )
+ :
+ voidFocuses the specified cell. Focuses the specified cell. Parameters:row : NumberThe row index col : NumberThe column index Returns: | GridView | | focusRow( Number row )
+ :
+ voidFocuses the specified row. Focuses the specified row. Parameters:row : NumberThe row index Returns: | GridView | | getCell( Number row , Number col )
+ :
+ HtmlElementReturns the grid's <td> HtmlElement at the specified coordinates. Returns the grid's <td> HtmlElement at the specified coordinates. | GridView | | getGridInnerWidth()
+ :
+ NumberReturns the total internal width available to the grid, taking the scrollbar into account Returns the total internal width available to the grid, taking the scrollbar into account | GridView | | getGroupId( String value )
+ :
+ StringDynamically tries to determine the groupId of a specific value Dynamically tries to determine the groupId of a specific value | GroupingView | | getHeaderCell( Number index )
+ :
+ HtmlElementReturn the <td> HtmlElement which represents the Grid's header cell for the specified column index. Return the <td> HtmlElement which represents the Grid's header cell for the specified column index. Parameters:index : NumberThe column index Returns:HtmlElement The td element.
| GridView | | getRow( Number index )
+ :
+ HtmlElementReturn the <div> HtmlElement which represents a Grid row for the specified index. Return the <div> HtmlElement which represents a Grid row for the specified index. Parameters:index : NumberThe row index Returns:HtmlElement The div element.
| GridView | | getRowClass( Record record , Number index , Object rowParams , Store store )
+ :
+ StringOverride this function to apply custom CSS classes to rows during rendering. You can also supply custom
parameters t... Override this function to apply custom CSS classes to rows during rendering. You can also supply custom
parameters to the row template for the current row to customize how it is rendered using the rowParams
parameter. This function should return the CSS class name (or empty string '' for none) that will be added
@@ -337,50 +345,54 @@ The following property will be passed in, and may be appended to:
store : StoreReturns: | GridView | | hasListener( String eventName )
- :
- BooleanChecks to see if this object has any listeners for a specified event Checks to see if this object has any listeners for a specified event | Observable | | on( String eventName , Function handler , [Object scope ], [Object options ] )
- :
+store : StoreReturns: | GridView | | handleHdMenuClickDefault( Ext.menu.BaseItem item )
+ :
+ voidCalled by handleHdMenuClick if any button except a sort ASC/DESC button was clicked. The default implementation provi... Called by handleHdMenuClick if any button except a sort ASC/DESC button was clicked. The default implementation provides
+the column hide/show functionality based on the check state of the menu item. A different implementation can be provided
+if needed. | GridView | | hasListener( String eventName )
+ :
+ BooleanChecks to see if this object has any listeners for a specified event Checks to see if this object has any listeners for a specified event | Observable | | on( String eventName , Function handler , [Object scope ], [Object options ] )
+ :
voidAppends an event handler to this object (shorthand for addListener.) Appends an event handler to this object (shorthand for addListener.) Parameters:eventName : StringThe type of event to listen for handler : FunctionThe method the event invokes scope : Object(optional) The scope (this reference) in which the handler function is executed.
-If omitted, defaults to the object which fired the event. options : Object(optional) An object containing handler configuration. Returns: | Observable | | purgeListeners()
- :
- voidRemoves all listeners for this object Removes all listeners for this object | Observable | | refresh( [Boolean headersToo ] )
- :
- void | GridView | | relayEvents( Object o , Array events )
- :
- voidRelays selected events from the specified Observable as if the events were fired by this. Relays selected events from the specified Observable as if the events were fired by this. | Observable | | removeListener( String eventName , Function handler , [Object scope ] )
- :
- voidRemoves an event handler. Removes an event handler. | Observable | | resumeEvents()
- :
- voidResume firing events. (see suspendEvents)
-If events were suspended using the queueSuspended parameter, then all
+If omitted, defaults to the object which fired the event. options : Object(optional) An object containing handler configuration. Returns: | Observable | | purgeListeners()
+ :
+ voidRemoves all listeners for this object Removes all listeners for this object | Observable | | refresh( [Boolean headersToo ] )
+ :
+ void | GridView | | relayEvents( Object o , Array events )
+ :
+ voidRelays selected events from the specified Observable as if the events were fired by this. Relays selected events from the specified Observable as if the events were fired by this. | Observable | | removeListener( String eventName , Function handler , [Object scope ] )
+ :
+ voidRemoves an event handler. Removes an event handler. | Observable | | resumeEvents()
+ :
+ voidResume firing events. (see suspendEvents)
+If events were suspended using the queueSuspended parameter, then all
event... Resume firing events. (see suspendEvents)
If events were suspended using the queueSuspended parameter, then all
-events fired during event suspension will be sent to any listeners now. | Observable | | scrollToTop()
- :
- voidScrolls the grid to the top Scrolls the grid to the top | GridView | | suspendEvents( Boolean queueSuspended )
- :
+events fired during event suspension will be sent to any listeners now. | Observable | | scrollToTop()
+ :
+ voidScrolls the grid to the top Scrolls the grid to the top | GridView | | suspendEvents( Boolean queueSuspended )
+ :
voidSuspend the firing of all events. (see resumeEvents) Suspend the firing of all events. (see resumeEvents) Parameters:queueSuspended : BooleanPass as true to queue up suspended events to be fired
-after the resumeEvents call instead of discarding all suspended events; Returns: | Observable | | toggleAllGroups( [Boolean expanded ] )
- :
- voidToggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed. Toggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed. Parameters:expanded : Boolean(optional) Returns: | GroupingView | | toggleGroup( String groupId , [Boolean expanded ] )
- :
- voidToggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed... Toggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed. | GroupingView | | toggleRowIndex( Number rowIndex , [Boolean expanded ] )
- :
- voidToggle the group that contains the specific row. Toggle the group that contains the specific row. Parameters:rowIndex : NumberThe row inside the group expanded : Boolean(optional) Returns: | GroupingView | | un( String eventName , Function handler , [Object scope ] )
- :
- voidRemoves an event handler (shorthand for removeListener.) | Observable |
Public Events|
| beforerefresh :
- ( Ext.grid.GridView view )
- Internal UI Event. Fired before the view is refreshed. Internal UI Event. Fired before the view is refreshed. Listeners will be called with the following arguments: | GridView | | beforerowremoved :
- ( Ext.grid.GridView view , Number rowIndex , Ext.data.Record record )
- Internal UI Event. Fired before a row is removed. Internal UI Event. Fired before a row is removed. Listeners will be called with the following arguments: | GridView | | beforerowsinserted :
- ( Ext.grid.GridView view , Number firstRow , Number lastRow )
- Internal UI Event. Fired before rows are inserted. Internal UI Event. Fired before rows are inserted. Listeners will be called with the following arguments: | GridView | | refresh :
- ( Ext.grid.GridView view )
- Internal UI Event. Fired after the GridView's body has been refreshed. Internal UI Event. Fired after the GridView's body has been refreshed. Listeners will be called with the following arguments: | GridView | | rowremoved :
- ( Ext.grid.GridView view , Number rowIndex , Ext.data.Record record )
- Internal UI Event. Fired after a row is removed. Internal UI Event. Fired after a row is removed. Listeners will be called with the following arguments: | GridView | | rowsinserted :
- ( Ext.grid.GridView view , Number firstRow , Number lastRow )
- Internal UI Event. Fired after rows are inserted. Internal UI Event. Fired after rows are inserted. Listeners will be called with the following arguments: | GridView | | rowupdated :
- ( Ext.grid.GridView view , Number firstRow , Ext.data.record record )
+after the resumeEvents call instead of discarding all suspended events;Returns: | Observable | | toggleAllGroups( [Boolean expanded ] )
+ :
+ voidToggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed. Toggles all groups if no value is passed, otherwise sets the expanded state of all groups to the value passed. Parameters:expanded : Boolean(optional) Returns: | GroupingView | | toggleGroup( String groupId , [Boolean expanded ] )
+ :
+ voidToggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed... Toggles the specified group if no value is passed, otherwise sets the expanded state of the group to the value passed. | GroupingView | | toggleRowIndex( Number rowIndex , [Boolean expanded ] )
+ :
+ voidToggle the group that contains the specific row. Toggle the group that contains the specific row. Parameters:rowIndex : NumberThe row inside the group expanded : Boolean(optional) Returns: | GroupingView | | un( String eventName , Function handler , [Object scope ] )
+ :
+ voidRemoves an event handler (shorthand for removeListener.) | Observable |
Public Events|
| beforerefresh :
+ ( Ext.grid.GridView view )
+ Internal UI Event. Fired before the view is refreshed. Internal UI Event. Fired before the view is refreshed. Listeners will be called with the following arguments: | GridView | | beforerowremoved :
+ ( Ext.grid.GridView view , Number rowIndex , Ext.data.Record record )
+ Internal UI Event. Fired before a row is removed. Internal UI Event. Fired before a row is removed. Listeners will be called with the following arguments: | GridView | | beforerowsinserted :
+ ( Ext.grid.GridView view , Number firstRow , Number lastRow )
+ Internal UI Event. Fired before rows are inserted. Internal UI Event. Fired before rows are inserted. Listeners will be called with the following arguments: | GridView | | refresh :
+ ( Ext.grid.GridView view )
+ Internal UI Event. Fired after the GridView's body has been refreshed. Internal UI Event. Fired after the GridView's body has been refreshed. Listeners will be called with the following arguments: | GridView | | rowremoved :
+ ( Ext.grid.GridView view , Number rowIndex , Ext.data.Record record )
+ Internal UI Event. Fired after a row is removed. Internal UI Event. Fired after a row is removed. Listeners will be called with the following arguments: | GridView | | rowsinserted :
+ ( Ext.grid.GridView view , Number firstRow , Number lastRow )
+ Internal UI Event. Fired after rows are inserted. Internal UI Event. Fired after rows are inserted. Listeners will be called with the following arguments: | GridView | | rowupdated :
+ ( Ext.grid.GridView view , Number firstRow , Ext.data.record record )
Internal UI Event. Fired after a row has been updated. Internal UI Event. Fired after a row has been updated. Listeners will be called with the following arguments: | GridView |
\ No newline at end of file
|