/* This file is part of Ext JS 3.4 Copyright (c) 2011-2013 Sencha Inc Contact: http://www.sencha.com/contact GNU General Public License Usage This file may be used under the terms of the GNU General Public License version 3.0 as published by the Free Software Foundation and appearing in the file LICENSE included in the packaging of this file. Please review the following information to ensure the GNU General Public License version 3.0 requirements will be met: http://www.gnu.org/copyleft/gpl.html. If you are unsure which license is appropriate for your use, please contact the sales department at http://www.sencha.com/contact. Build date: 2013-04-03 15:07:25 */ Ext.data.JsonP.Ext_grid_PivotGridView({"alternateClassNames":[],"aliases":{},"enum":null,"parentMixins":[],"tagname":"class","subclasses":[],"extends":"Ext.grid.GridView","uses":[],"html":"
Hierarchy
Ext.util.ObservableExt.grid.GridViewExt.grid.PivotGridViewFiles
Specialised GridView for rendering Pivot Grid components. Config can be passed to the PivotGridView via the PivotGrid constructor's\nviewConfig option:
\n\nnew Ext.grid.PivotGrid({\n viewConfig: {\n title: 'My Pivot Grid',\n getCellCls: function(value) {\n return value > 10 'red' : 'green';\n }\n }\n});\n
\n\n\nCurrently title and getCellCls are the only configuration options accepted by PivotGridView. All other \ninteraction is performed via the PivotGrid class.
\n\nDefaults to false. Specify true to have the column widths re-proportioned\nwhen the grid is initially rendered. The\ninitially configured width of each column will be adjusted\nto fit the grid width and prevent horizontal scrolling. If columns are later resized (manually\nor programmatically), the other columns in the grid will not be resized to fit the grid width.\nSee forceFit also.
\nDefaults to: false
The selector used to find cells internally (defaults to 'td.x-grid3-cell')
\nDefaults to: 'td.x-grid3-cell'
The number of levels to search for cells in event delegation (defaults to 4)
\nDefaults to: 4
The text displayed in the 'Columns' menu item (defaults to 'Columns')
\nDefaults to: 'Columns'
True to defer emptyText being applied until the store's\nfirst load (defaults to true).
\nDefaults to: true
Default text (html tags are accepted) to display in the grid body when no rows\nare available (defaults to ''). This value will be used to update the mainBody:
\n\n this.mainBody.update('<div class=\"x-grid-empty\">' + this.emptyText + '</div>');\n
\n\nTrue to add a second TR element per row that can be used to provide a row body\nthat spans beneath the data row. Use the getRowClass method's rowParams config to customize the row body.
\nDefaults to false. Specify true to have the column widths re-proportioned\nat all times.
\n\n\nThe initially configured width of each\ncolumn will be adjusted to fit the grid width and prevent horizontal scrolling. If columns are\nlater resized (manually or programmatically), the other columns in the grid will be resized\nto fit the grid width.
\n\n\nColumns which are configured with fixed: true
are omitted from being resized.
See autoFill.
\n\nDefaults to: false
Optional function which should return a CSS class name for each cell value. This is useful when\ncolor coding cells based on their value. Defaults to undefined.
\nThe CSS class to add to the header cell when its menu is visible. Defaults to 'x-grid3-hd-menu-open'
\nDefaults to: 'x-grid3-hd-menu-open'
True to disable the grid column headers (defaults to false).\nUse the ColumnModel menuDisabled\nconfig to disable the menu for individual columns. While this config is true the\nfollowing will be disabled:
True to hide the sorting icons if sorting is disabled for a column. Defaults to false
\nDefaults to: false
(optional)
A config object containing one or more event handlers to be added to this\nobject during initialization. This should be a valid listeners config object as specified in the\naddListener example for attaching multiple handlers at once.
\n\nDOM events from ExtJs Components
\n\n\nWhile some ExtJs Component classes export selected DOM events (e.g. \"click\", \"mouseover\" etc), this\n\n\n
is usually only done when extra value can be added. For example the DataView's\nclick
event passing the node clicked on. To access DOM\nevents directly from a Component's HTMLElement, listeners must be added to the Element after the Component\nhas been rendered. A plugin can simplify this step:
// Plugin is configured with a listeners config object.\n// The Component is appended to the argument list of all handler functions.\nExt.DomObserver = Ext.extend(Object, {\n constructor: function(config) {\n this.listeners = config.listeners ? config.listeners : config;\n },\n\n // Component passes itself into plugin's init method\n init: function(c) {\n var p, l = this.listeners;\n for (p in l) {\n if (Ext.isFunction(l[p])) {\n l[p] = this.createHandler(l[p], c);\n } else {\n l[p].fn = this.createHandler(l[p].fn, c);\n }\n }\n\n // Add the listeners to the Element immediately following the render call\n c.render = c.render.createSequence(function() {\n var e = c.getEl();\n if (e) {\n e.on(l);\n }\n });\n },\n\n createHandler: function(fn, c) {\n return function(e) {\n fn.call(this, e, c);\n };\n }\n});\n\nvar combo = new Ext.form.ComboBox({\n\n // Collapse combo when its element is clicked on\n plugins: [ new Ext.DomObserver({\n click: function(evt, comp) {\n comp.collapse();\n }\n })],\n store: myStore,\n typeAhead: true,\n mode: 'local',\n triggerAction: 'all'\n});\n
\n\n\n\nTrue to show the dirty cell indicator when a cell has been modified. Defaults to true.
\nDefaults to: true
The selector used to find row bodies internally (defaults to 'div.x-grid3-row')
\nDefaults to: 'div.x-grid3-row-body'
The number of levels to search for row bodies in event delegation (defaults to 10)
\nDefaults to: 10
The CSS class added to each row when it is hovered over. Defaults to 'x-grid3-row-over'
\nDefaults to: 'x-grid3-row-over'
The selector used to find rows internally (defaults to 'div.x-grid3-row')
\nDefaults to: 'div.x-grid3-row'
The number of levels to search for rows in event delegation (defaults to 10)
\nDefaults to: 10
The amount of space to reserve for the vertical scrollbar\n(defaults to undefined). If an explicit value isn't specified, this will be automatically\ncalculated.
\nThe CSS class applied to a selected row (defaults to 'x-grid3-row-selected'). An\nexample overriding the default styling:
\n\n .x-grid3-row-selected {background-color: yellow;}\n
\n\n\nNote that this only controls the row, and will not do anything for the text inside it. To style inner\nfacets (like text) use something like:
\n\n .x-grid3-row-selected .x-grid3-cell-inner {\n color: #FFCC00;\n }\n
\n\n\n@type String
\nDefaults to: 'x-grid3-row-selected'
The text displayed in the 'Sort Ascending' menu item (defaults to 'Sort Ascending')
\nDefaults to: 'Sort Ascending'
The CSS classes applied to a header when it is sorted. (defaults to ['sort-asc', 'sort-desc'])
\nDefaults to: ['sort-asc', 'sort-desc']
The master template to use when rendering the GridView. Has a default template
\nOverrides: Ext.grid.GridView.Ext.Template
The template to use when rendering the body. Has a default template
\nThe template to use to render each cell. Has a default template
\nThe CSS class added to all group header cells. Defaults to 'grid-hd-group-cell'
\nDefaults to: 'grid-hd-group-cell'
A customized implementation of a DragZone which provides default implementations\nof the template methods of DragZone to enable dragging of the selected rows of a GridPanel.\nSee Ext.grid.GridDragZone for details.
\n\n\nThis will only be present:
The element that contains the optional title (top left section of the pivot grid)
\nThe element that contains the optional title (top left section of the pivot grid)
\nThe template to use when rendering headers. Has a default template
\nRead-only. The GridView's body Element which encapsulates all rows in the Grid.\nThis Element is only available after the GridPanel has been rendered.
\nAdds the specified events to the list of events which this Observable may fire.
\nEither an object with event names as properties with a value of true
\nor the first event name string if multiple event names are being passed as separate parameters.
. Event name if multiple event names are being passed as separate parameters.\nUsage:
\n\nthis.addEvents('storeloaded', 'storecleared');\n
\n\nAppends an event handler to this object.
\nThe name of the event to listen for.
\nThe method the event invokes.
\nThe scope (this
reference) in which the handler function is executed.\nIf omitted, defaults to the object which fired the event.
An object containing handler configuration.\nproperties. This may contain any of the following properties:
this
reference) in which the handler function is executed.\nIf omitted, defaults to the object which fired the event.\nCombining Options
\nUsing the options argument, it is possible to combine different types of listeners:
\n
\nA delayed, one-time listener.\n
myDataView.on('click', this.onClick, this, {\nsingle: true,\ndelay: 100\n});
\n\nAttaching multiple handlers in 1 call
\nThe method also allows for a single argument to be passed which is a config object containing properties\nwhich specify multiple handlers.\n
\n
myGridPanel.on({\n'click' : {\n fn: this.onClick,\n scope: this,\n delay: 100\n},\n'mouseover' : {\n fn: this.onMouseOver,\n scope: this\n},\n'mouseout' : {\n fn: this.onMouseOut,\n scope: this\n}\n});
\n\nOr a shorthand syntax:
\n
myGridPanel.on({\n'click' : this.onClick,\n'mouseover' : this.onMouseOver,\n'mouseout' : this.onMouseOut,\n scope: this\n});
\n\nprivate - use getRowClass to apply custom row classes
\nThis is always intended to be called after renderUI. Sets up listeners on the UI elements\nand sets up options like column menus, moving and resizing.
\nDisplays the configured emptyText if there are currently no rows to display
\nResizes the configured autoExpandColumn to take the available width after the other columns have\nbeen accounted for
\nTrue to prevent the resizing of all rows (defaults to false)
\nClick handler for the shared column dropdown menu, called on beforeshow. Builds the menu\nwhich displays the list of columns for the user to show or hide.
\nDEPRECATED - will be removed in Ext JS 5.0
\nRemoves any sorting indicator classes from the column headers
\nDEPRECATED - this doesn't appear to be called anywhere in the library, remove in 4.0.
\nDestroys all objects associated with the GridView
\nRenders all of the rows to a string buffer and returns the string. This is called internally\nby renderRows and performs the actual string building for the rows - it does not inject HTML into the DOM.
\nThe column data acquired from getColumnData.
\nThe array of records to render
\nThe store to render the rows from
\nThe index of the first row being rendered. Sometimes we only render a subset of\nthe rows so this is used to maintain logic for striping etc
\nThe total number of columns in the column model
\nTrue to stripe the rows
\nA string containing the HTML for the rendered rows
\nEnables events fired by this Observable to bubble up an owner hierarchy by calling\nthis.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\nimplementation in Ext.Component returns the Component's immediate owner. But if a known target is required, this can be overridden to\naccess the required target more quickly.
\n\n\nExample:
\n\n\nExt.override(Ext.form.Field, {\n // Add functionality to Field's initComponent to enable the change event to bubble\n initComponent : Ext.form.Field.prototype.initComponent.createSequence(function() {\n this.enableBubble('change');\n }),\n\n // We know that we want Field's events to bubble directly to the FormPanel.\n getBubbleTarget : function() {\n if (!this.formPanel) {\n this.formPanel = this.findParentByType('form');\n }\n return this.formPanel;\n }\n});\n\nvar myForm = new Ext.formPanel({\n title: 'User Details',\n items: [{\n ...\n }],\n listeners: {\n change: function() {\n // Title goes red if form has been modified.\n myForm.header.setStyle('color', 'red');\n }\n }\n});\n
\n\nReturn the index of the grid column which contains the passed HTMLElement.
\n\n\nSee also findRowIndex
\nThe target element
\nThe column index, or false if the target element is not within a row of this GridView.
\nReturn the HtmlElement representing the grid row which contains the passed element.
\nThe target HTMLElement
\nThe row element, or null if the target element is not within a row of this GridView.
\nReturn the HtmlElement representing the grid row body which contains the passed element.
\nThe target HTMLElement
\nThe row body element, or null if the target element is not within a row body of this GridView.
\nReturn the index of the grid row which contains the passed HTMLElement.\nSee also findCellIndex
\nThe target HTMLElement
\nThe row index, or false if the target element is not within a row of this GridView.
\nFires the specified event with the passed parameters (minus the event name).
\n\n\nAn event may be set to bubble up an Observable parent hierarchy (See Ext.Component.getBubbleTarget)\nby calling enableBubble.
\n\nThe name of the event to fire.
\nVariable number of parameters are passed to handlers.
\nreturns false if any of the handlers return false otherwise it returns true.
\nTaken care of by PivotAxis
\nOverrides: Ext.grid.GridView.fitColumns
Each GridView has its own private flyweight, accessed through this method
\nReturns an array of column configurations - one for each column
\nArray of column config objects. This includes the column name, renderer, id style and renderer
\nReturns the headers to be rendered at the top of the grid. Should be a 2-dimensional array, where each item specifies the number\nof columns it groups (column in this case refers to normal grid columns). In the example below we have 5 city groups, which are\neach part of a continent supergroup. The colspan for each city group refers to the number of normal grid columns that group spans,\nso in this case the grid would be expected to have a total of 12 columns:
\n\n[\n {\n items: [\n {header: 'England', colspan: 5},\n {header: 'USA', colspan: 3}\n ]\n },\n {\n items: [\n {header: 'London', colspan: 2},\n {header: 'Cambridge', colspan: 3},\n {header: 'Palo Alto', colspan: 3}\n ]\n }\n]\n
\n\n\nIn the example above we have cities nested under countries. The nesting could be deeper if desired - e.g. Continent -> Country ->\nState -> City, or any other structure. The only constaint is that the same depth must be used throughout the structure.
\nA tree structure containing the headers to be rendered. Must include the colspan property at each level, which should\nbe the sum of all child nodes beneath this node.
\nReturns the width of a given column minus its border width
\nThe column index
\nTakes row headers into account when calculating total available width
\nOverrides: Ext.grid.GridView.getGridInnerWidth
Return the <td> HtmlElement which represents the Grid's header cell for the specified column index.
\nThe column index
\nThe td element.
\nReturns the XY co-ordinates of a given row/cell resolution (see resolveCell)
\nX and Y coords
\nReturn the <div> HtmlElement which represents a Grid row for the specified index.
\nThe row index
\nThe div element.
\nOverride this function to apply custom CSS classes to rows during rendering. You can also supply custom\nparameters to the row template for the current row to customize how it is rendered using the rowParams\nparameter. This function should return the CSS class name (or empty string '' for none) that will be added\nto the row's wrapping div. To apply multiple class names, simply return them space-delimited within the string\n(e.g., 'my-class another-class'). Example usage:
\n\nviewConfig: {\n forceFit: true,\n showPreview: true, // custom property\n enableRowBody: true, // required to create a second, full-width row to show expanded Record data\n getRowClass: function(record, rowIndex, rp, ds){ // rp = rowParams\n if(this.showPreview){\n rp.body = '<p>'+record.data.excerpt+'</p>';\n return 'x-grid3-row-expanded';\n }\n return 'x-grid3-row-collapsed';\n }\n},\n
\n\n\n@param {Record} record The Ext.data.Record corresponding to the current row.
\nThe row index.
\nA config object that is passed to the row template during rendering that allows\ncustomization of various aspects of a grid row.
\n\nIf enableRowBody is configured true, then the following properties may be set\nby this function, and will be used to render a full-width expansion row below each grid row:
\n\n\nbody
: String bodyStyle
: String The following property will be passed in, and may be appended to:
\n\ntstyle
: String The Ext.data.Store this grid is bound to
\na CSS class name to add to the row.
\nReturns the headers to be rendered on the left of the grid. Should be a 2-dimensional array, where each item specifies the number\nof rows it groups. In the example below we have 5 city groups, which are each part of a continent supergroup. The rowspan for each\ncity group refers to the number of normal grid columns that group spans, so in this case the grid would be expected to have a\ntotal of 12 rows:
\n\n[\n {\n width: 90,\n items: [\n {header: 'England', rowspan: 5},\n {header: 'USA', rowspan: 3}\n ]\n },\n {\n width: 50,\n items: [\n {header: 'London', rowspan: 2},\n {header: 'Cambridge', rowspan: 3},\n {header: 'Palo Alto', rowspan: 3}\n ]\n }\n]\n
\n\n\nIn the example above we have cities nested under countries. The nesting could be deeper if desired - e.g. Continent -> Country ->\nState -> City, or any other structure. The only constaint is that the same depth must be used throughout the structure.
\nA tree structure containing the headers to be rendered. Must include the colspan property at each level, which should\nbe the sum of all child nodes beneath this node.\nEach group may specify the width it should be rendered with.
\nReturns the total width of all row headers as specified by getRowHeaders
\nThe total width
\nCalled when a header cell is clicked - shows the menu if the click happened over a trigger button
\nAttached as the 'itemclick' handler to the header menu and the column show/hide submenu (if available).\nPerforms sorting if the sorter buttons were clicked, otherwise hides/shows the column that was clicked.
\nCalled by handleHdMenuClick if any button except a sort ASC/DESC button was clicked. The default implementation provides\nthe column hide/show functionality based on the check state of the menu item. A different implementation can be provided\nif needed.
\nThe menu item that was clicked
\nAttached to the headers' mousemove event. This figures out the CSS cursor to use based on where the mouse is currently\npointed. If the mouse is currently hovered over the extreme left or extreme right of any header cell and the cell next\nto it is resizable it is given the resize cursor, otherwise the cursor is set to an empty string.
\nTied to the header element's mouseout event. Removes the hover class from the header cell
\nTied to the header element's mouseover event - adds the over class to the header cell if the menu is not disabled\nfor that cell
\nChecks to see if this object has any listeners for a specified event
\nThe name of the event to check for
\nTrue if the event is being listened for, else false
\nReturns true if there are any rows rendered into the GridView
\nTrue if any rows have been rendered
\nBinds a new Store and ColumnModel to this GridView. Removes any listeners from the old objects (if present)\nand adds listeners to the new ones
\nThe new Store instance
\nThe new ColumnModel instance
\nSets up the reference to the row headers element
\nOverrides: Ext.grid.GridView.initElements
Adds a gcell template to the internal templates object. This is used to render the headers in a multi-level column header.
\nOverrides: Ext.grid.GridView.initTemplates
private
\nOverridden to test whether the user is hovering over a group cell, in which case we don't show the menu
\nOverrides: Ext.grid.GridView.isMenuDisabled
Sizes the grid's header and body elements
\nAppends an event handler to this object (shorthand for addListener.)
\nThe type of event to listen for
\nThe method the event invokes
\nThe scope (this
reference) in which the handler function is executed.\nIf omitted, defaults to the object which fired the event.
An object containing handler configuration.
\nprivate
\nprivate
\nprivate
\nCalled by the SplitDragZone when a drag has been completed. Resizes the columns
\nprivate
\nprivate
\nMake sure that the headers and rows are all sized correctly during layout
\nOverrides: Ext.grid.GridView.onLayout
Called when a store is loaded, scrolls to the top row
\nprivate
\nRemoves the hover class from a row on mouseout
\nAdds the hover class to a row when hovered over
\nAdds CSS classes and rowIndex to each row
\nThe row to start from (defaults to 0)
\nRefreshs the grid UI
\nTrue to also refresh the headers
\nOverrides: Ext.grid.GridView.refresh
Refreshes a row by re-rendering it. Fires the rowupdated event when done
\nRelays selected events from the specified Observable as if the events were fired by this.
\nThe Observable whose events this object is to relay.
\nArray of event names to relay.
\nRemoves an event handler.
\nThe type of event the handler was associated with.
\nThe handler to remove. This must be a reference to the function passed into the addListener call.
\nThe scope originally specified for the handler.
\nprivate
\nRenders all column header groups at all levels based on the structure fetched from getColumnHeaders
\nRenders all row header groups at all levels based on the structure fetched from getGroupRowHeaders
\nBypasses GridView's renderHeaders as they are taken care of separately by the PivotAxis instances
\nOverrides: Ext.grid.GridView.renderHeaders
Slight specialisation of the GridView renderUI - just adds the row headers
\nOverrides: Ext.grid.GridView.renderUI
Resizes all rendered rows to the given width. Usually called by onLayout
\nThe new width
\nCalled on layout, ensures that the width of each column header is correct. Omitting this can lead to faulty\nlayouts when nested in a container.
\nThe new width
\nSets the row header div to the correct width. Should be called after rendering and reconfiguration of headers
\nFinds the Elements corresponding to the given row and column indexes
\nResume firing events. (see suspendEvents)\nIf events were suspended using the queueSuspended parameter, then all\nevents fired during event suspension will be sent to any listeners now.
\nSets the title text in the top left segment of the PivotGridView
\nThe title
\nSuspend the firing of all events. (see resumeEvents)
\nPass as true to queue up suspended events to be fired\nafter the resumeEvents call instead of discarding all suspended events;
\nMoves the focus element to the x and y co-ordinates of the given row and column
\nRemoves an event handler (shorthand for removeListener.)
\nThe type of event the handler was associated with.
\nThe handler to remove. This must be a reference to the function passed into the addListener call.
\nThe scope originally specified for the handler.
\nUpdates the size of every column and cell in the grid
\nSets the hidden status of a given column.
\nThe column index
\nTrue to make the column hidden
\nCalled after a column's width has been updated, this resizes all of the cells for that column in each row
\nThe column index
\nAdds sorting classes to the column headers based on the bound store's sortInfo. Fires the 'sortchange' event\nif the sorting has changed since this function was last run.
\nEnsures that the header is sized to the total width available to it
\nTrue to update the mainBody's width also (defaults to true)
\nUpdates the Row Headers, deferring the updating of Column Headers to GridView
\nOverrides: Ext.grid.GridView.updateHeaders
Ensures the given column has the given icon class
\nInternal UI Event. Fired before a row is removed.
\nThe index of the row to be removed.
\nThe Record to be removed
\nInternal UI Event. Fired before rows are inserted.
\nThe index of the first row to be inserted.
\nThe index of the last row to be inserted.
\nInternal UI Event. Fired after the GridView's body has been refreshed.
\nInternal UI Event. Fired after a row is removed.
\nThe index of the row that was removed.
\nThe Record that was removed
\nInternal UI Event. Fired after rows are inserted.
\nThe index of the first inserted.
\nThe index of the last row inserted.
\nInternal UI Event. Fired after a row has been updated.
\nThe index of the row updated.
\nThe Record backing the row updated.
\n