+++ /dev/null
-<html>\r
-<head>\r
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> \r
- <title>The source code</title>\r
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
-</head>\r
-<body onload="prettyPrint();">\r
- <pre class="prettyprint lang-js"><div id="cls-Ext.grid.GridPanel"></div>/**\r
- * @class Ext.grid.GridPanel\r
- * @extends Ext.Panel\r
- * <p>This class represents the primary interface of a component based grid control to represent data\r
- * in a tabular format of rows and columns. The GridPanel is composed of the following:</p>\r
- * <div class="mdetail-params"><ul>\r
- * <li><b>{@link Ext.data.Store Store}</b> : The Model holding the data records (rows)\r
- * <div class="sub-desc"></div></li>\r
- * <li><b>{@link Ext.grid.ColumnModel Column model}</b> : Column makeup\r
- * <div class="sub-desc"></div></li>\r
- * <li><b>{@link Ext.grid.GridView View}</b> : Encapsulates the user interface \r
- * <div class="sub-desc"></div></li>\r
- * <li><b>{@link Ext.grid.AbstractSelectionModel selection model}</b> : Selection behavior \r
- * <div class="sub-desc"></div></li>\r
- * </ul></div>\r
- * <p>Example usage:</p>\r
- * <pre><code>\r
-var grid = new Ext.grid.GridPanel({\r
- {@link #store}: new {@link Ext.data.Store}({\r
- {@link Ext.data.Store#autoDestroy autoDestroy}: true,\r
- {@link Ext.data.Store#reader reader}: reader,\r
- {@link Ext.data.Store#data data}: xg.dummyData\r
- }),\r
- {@link #colModel}: new {@link Ext.grid.ColumnModel}({\r
- {@link Ext.grid.ColumnModel#defaults defaults}: {\r
- width: 120,\r
- sortable: true\r
- },\r
- {@link Ext.grid.ColumnModel#columns columns}: [\r
- {id: 'company', header: 'Company', width: 200, sortable: true, dataIndex: 'company'},\r
- {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price'},\r
- {header: 'Change', dataIndex: 'change'},\r
- {header: '% Change', dataIndex: 'pctChange'},\r
- // instead of specifying renderer: Ext.util.Format.dateRenderer('m/d/Y') use xtype\r
- {\r
- header: 'Last Updated', width: 135, dataIndex: 'lastChange',\r
- xtype: 'datecolumn', format: 'M d, Y'\r
- }\r
- ],\r
- }),\r
- {@link #viewConfig}: {\r
- {@link Ext.grid.GridView#forceFit forceFit}: true,\r
-\r
-// Return CSS class to apply to rows depending upon data values\r
- {@link Ext.grid.GridView#getRowClass getRowClass}: function(record, index) {\r
- var c = record.{@link Ext.data.Record#get get}('change');\r
- if (c < 0) {\r
- return 'price-fall';\r
- } else if (c > 0) {\r
- return 'price-rise';\r
- }\r
- }\r
- },\r
- {@link #sm}: new Ext.grid.RowSelectionModel({singleSelect:true}),\r
- width: 600,\r
- height: 300,\r
- frame: true,\r
- title: 'Framed with Row Selection and Horizontal Scrolling',\r
- iconCls: 'icon-grid'\r
-});\r
- * </code></pre>\r
- * <p><b><u>Notes:</u></b></p>\r
- * <div class="mdetail-params"><ul>\r
- * <li>Although this class inherits many configuration options from base classes, some of them\r
- * (such as autoScroll, autoWidth, layout, items, etc) are not used by this class, and will\r
- * have no effect.</li>\r
- * <li>A grid <b>requires</b> a width in which to scroll its columns, and a height in which to\r
- * scroll its rows. These dimensions can either be set explicitly through the\r
- * <tt>{@link Ext.BoxComponent#height height}</tt> and <tt>{@link Ext.BoxComponent#width width}</tt>\r
- * configuration options or implicitly set by using the grid as a child item of a\r
- * {@link Ext.Container Container} which will have a {@link Ext.Container#layout layout manager}\r
- * provide the sizing of its child items (for example the Container of the Grid may specify\r
- * <tt>{@link Ext.Container#layout layout}:'fit'</tt>).</li>\r
- * <li>To access the data in a Grid, it is necessary to use the data model encapsulated\r
- * by the {@link #store Store}. See the {@link #cellclick} event for more details.</li>\r
- * </ul></div>\r
- * @constructor\r
- * @param {Object} config The config object\r
- * @xtype grid\r
- */\r
-Ext.grid.GridPanel = Ext.extend(Ext.Panel, {\r
- <div id="cfg-Ext.grid.GridPanel-autoExpandColumn"></div>/**\r
- * @cfg {String} autoExpandColumn\r
- * <p>The <tt>{@link Ext.grid.Column#id id}</tt> of a {@link Ext.grid.Column column} in\r
- * this grid that should expand to fill unused space. This value specified here can not\r
- * be <tt>0</tt>.</p>\r
- * <br><p><b>Note</b>: If the Grid's {@link Ext.grid.GridView view} is configured with\r
- * <tt>{@link Ext.grid.GridView#forceFit forceFit}=true</tt> the <tt>autoExpandColumn</tt>\r
- * is ignored. See {@link Ext.grid.Column}.<tt>{@link Ext.grid.Column#width width}</tt>\r
- * for additional details.</p>\r
- * <p>See <tt>{@link #autoExpandMax}</tt> and <tt>{@link #autoExpandMin}</tt> also.</p>\r
- */\r
- autoExpandColumn : false,\r
- <div id="cfg-Ext.grid.GridPanel-autoExpandMax"></div>/**\r
- * @cfg {Number} autoExpandMax The maximum width the <tt>{@link #autoExpandColumn}</tt>\r
- * can have (if enabled). Defaults to <tt>1000</tt>.\r
- */\r
- autoExpandMax : 1000,\r
- <div id="cfg-Ext.grid.GridPanel-autoExpandMin"></div>/**\r
- * @cfg {Number} autoExpandMin The minimum width the <tt>{@link #autoExpandColumn}</tt>\r
- * can have (if enabled). Defaults to <tt>50</tt>.\r
- */\r
- autoExpandMin : 50,\r
- <div id="cfg-Ext.grid.GridPanel-columnLines"></div>/**\r
- * @cfg {Boolean} columnLines <tt>true</tt> to add css for column separation lines.\r
- * Default is <tt>false</tt>.\r
- */\r
- columnLines : false,\r
- <div id="cfg-Ext.grid.GridPanel-cm"></div>/**\r
- * @cfg {Object} cm Shorthand for <tt>{@link #colModel}</tt>.\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-colModel"></div>/**\r
- * @cfg {Object} colModel The {@link Ext.grid.ColumnModel} to use when rendering the grid (required).\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-columns"></div>/**\r
- * @cfg {Array} columns An array of {@link Ext.grid.Column columns} to auto create a\r
- * {@link Ext.grid.ColumnModel}. The ColumnModel may be explicitly created via the\r
- * <tt>{@link #colModel}</tt> configuration property.\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-ddGroup"></div>/**\r
- * @cfg {String} ddGroup The DD group this GridPanel belongs to. Defaults to <tt>'GridDD'</tt> if not specified.\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-ddText"></div>/**\r
- * @cfg {String} ddText\r
- * Configures the text in the drag proxy. Defaults to:\r
- * <pre><code>\r
- * ddText : '{0} selected row{1}'\r
- * </code></pre>\r
- * <tt>{0}</tt> is replaced with the number of selected rows.\r
- */\r
- ddText : '{0} selected row{1}',\r
- <div id="cfg-Ext.grid.GridPanel-deferRowRender"></div>/**\r
- * @cfg {Boolean} deferRowRender <P>Defaults to <tt>true</tt> to enable deferred row rendering.</p>\r
- * <p>This allows the GridPanel to be initially rendered empty, with the expensive update of the row\r
- * structure deferred so that layouts with GridPanels appear more quickly.</p>\r
- */\r
- deferRowRender : true,\r
- <div id="cfg-Ext.grid.GridPanel-disableSelection"></div>/**\r
- * @cfg {Boolean} disableSelection <p><tt>true</tt> to disable selections in the grid. Defaults to <tt>false</tt>.</p>\r
- * <p>Ignored if a {@link #selModel SelectionModel} is specified.</p>\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-enableColumnResize"></div>/**\r
- * @cfg {Boolean} enableColumnResize <tt>false</tt> to turn off column resizing for the whole grid. Defaults to <tt>true</tt>.\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-enableColumnHide"></div>/**\r
- * @cfg {Boolean} enableColumnHide\r
- * Defaults to <tt>true</tt> to enable {@link Ext.grid.Column#hidden hiding of columns}\r
- * with the {@link #enableHdMenu header menu}.\r
- */\r
- enableColumnHide : true,\r
- <div id="cfg-Ext.grid.GridPanel-enableColumnMove"></div>/**\r
- * @cfg {Boolean} enableColumnMove Defaults to <tt>true</tt> to enable drag and drop reorder of columns. <tt>false</tt>\r
- * to turn off column reordering via drag drop.\r
- */\r
- enableColumnMove : true,\r
- <div id="cfg-Ext.grid.GridPanel-enableDragDrop"></div>/**\r
- * @cfg {Boolean} enableDragDrop <p>Enables dragging of the selected rows of the GridPanel. Defaults to <tt>false</tt>.</p>\r
- * <p>Setting this to <b><tt>true</tt></b> causes this GridPanel's {@link #getView GridView} to\r
- * create an instance of {@link Ext.grid.GridDragZone}. <b>Note</b>: this is available only <b>after</b>\r
- * the Grid has been rendered as the GridView's <tt>{@link Ext.grid.GridView#dragZone dragZone}</tt>\r
- * property.</p>\r
- * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's implementations of\r
- * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},\r
- * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} are able\r
- * to process the {@link Ext.grid.GridDragZone#getDragData data} which is provided.</p>\r
- */\r
- enableDragDrop : false,\r
- <div id="cfg-Ext.grid.GridPanel-enableHdMenu"></div>/**\r
- * @cfg {Boolean} enableHdMenu Defaults to <tt>true</tt> to enable the drop down button for menu in the headers.\r
- */\r
- enableHdMenu : true,\r
- <div id="cfg-Ext.grid.GridPanel-hideHeaders"></div>/**\r
- * @cfg {Boolean} hideHeaders True to hide the grid's header. Defaults to <code>false</code>.\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-loadMask"></div>/**\r
- * @cfg {Object} loadMask An {@link Ext.LoadMask} config or true to mask the grid while\r
- * loading. Defaults to <code>false</code>.\r
- */\r
- loadMask : false,\r
- <div id="cfg-Ext.grid.GridPanel-maxHeight"></div>/**\r
- * @cfg {Number} maxHeight Sets the maximum height of the grid - ignored if <tt>autoHeight</tt> is not on.\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-minColumnWidth"></div>/**\r
- * @cfg {Number} minColumnWidth The minimum width a column can be resized to. Defaults to <tt>25</tt>.\r
- */\r
- minColumnWidth : 25,\r
- <div id="cfg-Ext.grid.GridPanel-sm"></div>/**\r
- * @cfg {Object} sm Shorthand for <tt>{@link #selModel}</tt>.\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-selModel"></div>/**\r
- * @cfg {Object} selModel Any subclass of {@link Ext.grid.AbstractSelectionModel} that will provide\r
- * the selection model for the grid (defaults to {@link Ext.grid.RowSelectionModel} if not specified).\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-store"></div>/**\r
- * @cfg {Ext.data.Store} store The {@link Ext.data.Store} the grid should use as its data source (required).\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-stripeRows"></div>/**\r
- * @cfg {Boolean} stripeRows <tt>true</tt> to stripe the rows. Default is <tt>false</tt>.\r
- * <p>This causes the CSS class <tt><b>x-grid3-row-alt</b></tt> to be added to alternate rows of\r
- * the grid. A default CSS rule is provided which sets a background colour, but you can override this\r
- * with a rule which either overrides the <b>background-color</b> style using the '!important'\r
- * modifier, or which uses a CSS selector of higher specificity.</p>\r
- */\r
- stripeRows : false,\r
- <div id="cfg-Ext.grid.GridPanel-trackMouseOver"></div>/**\r
- * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is <tt>true</tt>\r
- * for GridPanel, but <tt>false</tt> for EditorGridPanel.\r
- */\r
- trackMouseOver : true,\r
- <div id="cfg-Ext.grid.GridPanel-stateEvents"></div>/**\r
- * @cfg {Array} stateEvents\r
- * An array of events that, when fired, should trigger this component to save its state.\r
- * Defaults to:<pre><code>\r
- * stateEvents: ['columnmove', 'columnresize', 'sortchange', 'groupchange']\r
- * </code></pre>\r
- * <p>These can be any types of events supported by this component, including browser or\r
- * custom events (e.g., <tt>['click', 'customerchange']</tt>).</p>\r
- * <p>See {@link Ext.Component#stateful} for an explanation of saving and restoring\r
- * Component state.</p>\r
- */\r
- stateEvents : ['columnmove', 'columnresize', 'sortchange', 'groupchange'],\r
- <div id="cfg-Ext.grid.GridPanel-view"></div>/**\r
- * @cfg {Object} view The {@link Ext.grid.GridView} used by the grid. This can be set\r
- * before a call to {@link Ext.Component#render render()}.\r
- */\r
- view : null,\r
- \r
- <div id="cfg-Ext.grid.GridPanel-bubbleEvents"></div>/**\r
- * @cfg {Array} bubbleEvents\r
- * <p>An array of events that, when fired, should be bubbled to any parent container.\r
- * See {@link Ext.util.Observable#enableBubble}. \r
- * Defaults to <tt>[]</tt>.\r
- */\r
- bubbleEvents: [],\r
- \r
- <div id="cfg-Ext.grid.GridPanel-viewConfig"></div>/**\r
- * @cfg {Object} viewConfig A config object that will be applied to the grid's UI view. Any of\r
- * the config options available for {@link Ext.grid.GridView} can be specified here. This option\r
- * is ignored if <tt>{@link #view}</tt> is specified.\r
- */\r
-\r
- // private\r
- rendered : false,\r
- // private\r
- viewReady : false,\r
-\r
- // private\r
- initComponent : function(){\r
- Ext.grid.GridPanel.superclass.initComponent.call(this);\r
-\r
- if(this.columnLines){\r
- this.cls = (this.cls || '') + ' x-grid-with-col-lines';\r
- }\r
- // override any provided value since it isn't valid\r
- // and is causing too many bug reports ;)\r
- this.autoScroll = false;\r
- this.autoWidth = false;\r
-\r
- if(Ext.isArray(this.columns)){\r
- this.colModel = new Ext.grid.ColumnModel(this.columns);\r
- delete this.columns;\r
- }\r
-\r
- // check and correct shorthanded configs\r
- if(this.ds){\r
- this.store = this.ds;\r
- delete this.ds;\r
- }\r
- if(this.cm){\r
- this.colModel = this.cm;\r
- delete this.cm;\r
- }\r
- if(this.sm){\r
- this.selModel = this.sm;\r
- delete this.sm;\r
- }\r
- this.store = Ext.StoreMgr.lookup(this.store);\r
-\r
- this.addEvents(\r
- // raw events\r
- <div id="event-Ext.grid.GridPanel-click"></div>/**\r
- * @event click\r
- * The raw click event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'click',\r
- <div id="event-Ext.grid.GridPanel-dblclick"></div>/**\r
- * @event dblclick\r
- * The raw dblclick event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'dblclick',\r
- <div id="event-Ext.grid.GridPanel-contextmenu"></div>/**\r
- * @event contextmenu\r
- * The raw contextmenu event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'contextmenu',\r
- <div id="event-Ext.grid.GridPanel-mousedown"></div>/**\r
- * @event mousedown\r
- * The raw mousedown event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'mousedown',\r
- <div id="event-Ext.grid.GridPanel-mouseup"></div>/**\r
- * @event mouseup\r
- * The raw mouseup event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'mouseup',\r
- <div id="event-Ext.grid.GridPanel-mouseover"></div>/**\r
- * @event mouseover\r
- * The raw mouseover event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'mouseover',\r
- <div id="event-Ext.grid.GridPanel-mouseout"></div>/**\r
- * @event mouseout\r
- * The raw mouseout event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'mouseout',\r
- <div id="event-Ext.grid.GridPanel-keypress"></div>/**\r
- * @event keypress\r
- * The raw keypress event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'keypress',\r
- <div id="event-Ext.grid.GridPanel-keydown"></div>/**\r
- * @event keydown\r
- * The raw keydown event for the entire grid.\r
- * @param {Ext.EventObject} e\r
- */\r
- 'keydown',\r
-\r
- // custom events\r
- <div id="event-Ext.grid.GridPanel-cellmousedown"></div>/**\r
- * @event cellmousedown\r
- * Fires before a cell is clicked\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Number} columnIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'cellmousedown',\r
- <div id="event-Ext.grid.GridPanel-rowmousedown"></div>/**\r
- * @event rowmousedown\r
- * Fires before a row is clicked\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'rowmousedown',\r
- <div id="event-Ext.grid.GridPanel-headermousedown"></div>/**\r
- * @event headermousedown\r
- * Fires before a header is clicked\r
- * @param {Grid} this\r
- * @param {Number} columnIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'headermousedown',\r
- \r
- <div id="event-Ext.grid.GridPanel-groupmousedown"></div>/**\r
- * @event groupmousedown\r
- * Fires before a group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.\r
- * @param {Grid} this\r
- * @param {String} groupField\r
- * @param {String} groupValue\r
- * @param {Ext.EventObject} e\r
- */\r
- 'groupmousedown',\r
- \r
- <div id="event-Ext.grid.GridPanel-rowbodymousedown"></div>/**\r
- * @event rowbodymousedown\r
- * Fires before the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'rowbodymousedown',\r
- \r
- <div id="event-Ext.grid.GridPanel-containermousedown"></div>/**\r
- * @event containermousedown\r
- * Fires before the container is clicked. The container consists of any part of the grid body that is not covered by a row.\r
- * @param {Grid} this\r
- * @param {Ext.EventObject} e\r
- */\r
- 'containermousedown',\r
-\r
- <div id="event-Ext.grid.GridPanel-cellclick"></div>/**\r
- * @event cellclick\r
- * Fires when a cell is clicked.\r
- * The data for the cell is drawn from the {@link Ext.data.Record Record}\r
- * for this row. To access the data in the listener function use the\r
- * following technique:\r
- * <pre><code>\r
-function(grid, rowIndex, columnIndex, e) {\r
- var record = grid.getStore().getAt(rowIndex); // Get the Record\r
- var fieldName = grid.getColumnModel().getDataIndex(columnIndex); // Get field name\r
- var data = record.get(fieldName);\r
-}\r
-</code></pre>\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Number} columnIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'cellclick',\r
- <div id="event-Ext.grid.GridPanel-celldblclick"></div>/**\r
- * @event celldblclick\r
- * Fires when a cell is double clicked\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Number} columnIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'celldblclick',\r
- <div id="event-Ext.grid.GridPanel-rowclick"></div>/**\r
- * @event rowclick\r
- * Fires when a row is clicked\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'rowclick',\r
- <div id="event-Ext.grid.GridPanel-rowdblclick"></div>/**\r
- * @event rowdblclick\r
- * Fires when a row is double clicked\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'rowdblclick',\r
- <div id="event-Ext.grid.GridPanel-headerclick"></div>/**\r
- * @event headerclick\r
- * Fires when a header is clicked\r
- * @param {Grid} this\r
- * @param {Number} columnIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'headerclick',\r
- <div id="event-Ext.grid.GridPanel-headerdblclick"></div>/**\r
- * @event headerdblclick\r
- * Fires when a header cell is double clicked\r
- * @param {Grid} this\r
- * @param {Number} columnIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'headerdblclick',\r
- <div id="event-Ext.grid.GridPanel-groupclick"></div>/**\r
- * @event groupclick\r
- * Fires when group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.\r
- * @param {Grid} this\r
- * @param {String} groupField\r
- * @param {String} groupValue\r
- * @param {Ext.EventObject} e\r
- */\r
- 'groupclick',\r
- <div id="event-Ext.grid.GridPanel-groupdblclick"></div>/**\r
- * @event groupdblclick\r
- * Fires when group header is double clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.\r
- * @param {Grid} this\r
- * @param {String} groupField\r
- * @param {String} groupValue\r
- * @param {Ext.EventObject} e\r
- */\r
- 'groupdblclick',\r
- <div id="event-Ext.grid.GridPanel-containerclick"></div>/**\r
- * @event containerclick\r
- * Fires when the container is clicked. The container consists of any part of the grid body that is not covered by a row.\r
- * @param {Grid} this\r
- * @param {Ext.EventObject} e\r
- */\r
- 'containerclick',\r
- <div id="event-Ext.grid.GridPanel-containerdblclick"></div>/**\r
- * @event containerdblclick\r
- * Fires when the container is double clicked. The container consists of any part of the grid body that is not covered by a row.\r
- * @param {Grid} this\r
- * @param {Ext.EventObject} e\r
- */\r
- 'containerdblclick',\r
- \r
- <div id="event-Ext.grid.GridPanel-rowbodyclick"></div>/**\r
- * @event rowbodyclick\r
- * Fires when the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'rowbodyclick',\r
- <div id="event-Ext.grid.GridPanel-rowbodydblclick"></div>/**\r
- * @event rowbodydblclick\r
- * Fires when the row body is double clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'rowbodydblclick',\r
- \r
- <div id="event-Ext.grid.GridPanel-rowcontextmenu"></div>/**\r
- * @event rowcontextmenu\r
- * Fires when a row is right clicked\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'rowcontextmenu',\r
- <div id="event-Ext.grid.GridPanel-cellcontextmenu"></div>/**\r
- * @event cellcontextmenu\r
- * Fires when a cell is right clicked\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Number} cellIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'cellcontextmenu',\r
- <div id="event-Ext.grid.GridPanel-headercontextmenu"></div>/**\r
- * @event headercontextmenu\r
- * Fires when a header is right clicked\r
- * @param {Grid} this\r
- * @param {Number} columnIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'headercontextmenu',\r
- <div id="event-Ext.grid.GridPanel-groupcontextmenu"></div>/**\r
- * @event groupcontextmenu\r
- * Fires when group header is right clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.\r
- * @param {Grid} this\r
- * @param {String} groupField\r
- * @param {String} groupValue\r
- * @param {Ext.EventObject} e\r
- */\r
- 'groupcontextmenu',\r
- <div id="event-Ext.grid.GridPanel-containercontextmenu"></div>/**\r
- * @event containercontextmenu\r
- * Fires when the container is right clicked. The container consists of any part of the grid body that is not covered by a row.\r
- * @param {Grid} this\r
- * @param {Ext.EventObject} e\r
- */\r
- 'containercontextmenu',\r
- <div id="event-Ext.grid.GridPanel-rowbodycontextmenu"></div>/**\r
- * @event rowbodycontextmenu\r
- * Fires when the row body is right clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>\r
- * @param {Grid} this\r
- * @param {Number} rowIndex\r
- * @param {Ext.EventObject} e\r
- */\r
- 'rowbodycontextmenu',\r
- <div id="event-Ext.grid.GridPanel-bodyscroll"></div>/**\r
- * @event bodyscroll\r
- * Fires when the body element is scrolled\r
- * @param {Number} scrollLeft\r
- * @param {Number} scrollTop\r
- */\r
- 'bodyscroll',\r
- <div id="event-Ext.grid.GridPanel-columnresize"></div>/**\r
- * @event columnresize\r
- * Fires when the user resizes a column\r
- * @param {Number} columnIndex\r
- * @param {Number} newSize\r
- */\r
- 'columnresize',\r
- <div id="event-Ext.grid.GridPanel-columnmove"></div>/**\r
- * @event columnmove\r
- * Fires when the user moves a column\r
- * @param {Number} oldIndex\r
- * @param {Number} newIndex\r
- */\r
- 'columnmove',\r
- <div id="event-Ext.grid.GridPanel-sortchange"></div>/**\r
- * @event sortchange\r
- * Fires when the grid's store sort changes\r
- * @param {Grid} this\r
- * @param {Object} sortInfo An object with the keys field and direction\r
- */\r
- 'sortchange',\r
- <div id="event-Ext.grid.GridPanel-groupchange"></div>/**\r
- * @event groupchange\r
- * Fires when the grid's grouping changes (only applies for grids with a {@link Ext.grid.GroupingView GroupingView})\r
- * @param {Grid} this\r
- * @param {String} groupField A string with the grouping field, null if the store is not grouped.\r
- */\r
- 'groupchange',\r
- <div id="event-Ext.grid.GridPanel-reconfigure"></div>/**\r
- * @event reconfigure\r
- * Fires when the grid is reconfigured with a new store and/or column model.\r
- * @param {Grid} this\r
- * @param {Ext.data.Store} store The new store\r
- * @param {Ext.grid.ColumnModel} colModel The new column model\r
- */\r
- 'reconfigure',\r
- <div id="event-Ext.grid.GridPanel-viewready"></div>/**\r
- * @event viewready\r
- * Fires when the grid view is available (use this for selecting a default row). \r
- * @param {Grid} this\r
- */\r
- 'viewready'\r
- );\r
- },\r
-\r
- // private\r
- onRender : function(ct, position){\r
- Ext.grid.GridPanel.superclass.onRender.apply(this, arguments);\r
-\r
- var c = this.getGridEl();\r
-\r
- this.el.addClass('x-grid-panel');\r
-\r
- this.mon(c, {\r
- scope: this,\r
- mousedown: this.onMouseDown,\r
- click: this.onClick,\r
- dblclick: this.onDblClick,\r
- contextmenu: this.onContextMenu\r
- });\r
-\r
- this.relayEvents(c, ['mousedown','mouseup','mouseover','mouseout','keypress', 'keydown']);\r
-\r
- var view = this.getView();\r
- view.init(this);\r
- view.render();\r
- this.getSelectionModel().init(this);\r
- },\r
-\r
- // private\r
- initEvents : function(){\r
- Ext.grid.GridPanel.superclass.initEvents.call(this);\r
-\r
- if(this.loadMask){\r
- this.loadMask = new Ext.LoadMask(this.bwrap,\r
- Ext.apply({store:this.store}, this.loadMask));\r
- }\r
- },\r
-\r
- initStateEvents : function(){\r
- Ext.grid.GridPanel.superclass.initStateEvents.call(this);\r
- this.mon(this.colModel, 'hiddenchange', this.saveState, this, {delay: 100});\r
- },\r
-\r
- applyState : function(state){\r
- var cm = this.colModel,\r
- cs = state.columns,\r
- store = this.store,\r
- s,\r
- c,\r
- oldIndex;\r
- \r
- if(cs){\r
- for(var i = 0, len = cs.length; i < len; i++){\r
- s = cs[i];\r
- c = cm.getColumnById(s.id);\r
- if(c){\r
- c.hidden = s.hidden;\r
- c.width = s.width;\r
- oldIndex = cm.getIndexById(s.id);\r
- if(oldIndex != i){\r
- cm.moveColumn(oldIndex, i);\r
- }\r
- }\r
- }\r
- }\r
- if(store){\r
- s = state.sort;\r
- if(s){\r
- store[store.remoteSort ? 'setDefaultSort' : 'sort'](s.field, s.direction);\r
- }\r
- s = state.group;\r
- if(store.groupBy){\r
- if(s){\r
- store.groupBy(s);\r
- }else{\r
- store.clearGrouping();\r
- }\r
- }\r
-\r
- }\r
- var o = Ext.apply({}, state);\r
- delete o.columns;\r
- delete o.sort;\r
- Ext.grid.GridPanel.superclass.applyState.call(this, o);\r
- },\r
-\r
- getState : function(){\r
- var o = {columns: []},\r
- store = this.store,\r
- ss,\r
- gs;\r
- \r
- for(var i = 0, c; (c = this.colModel.config[i]); i++){\r
- o.columns[i] = {\r
- id: c.id,\r
- width: c.width\r
- };\r
- if(c.hidden){\r
- o.columns[i].hidden = true;\r
- }\r
- }\r
- if(store){\r
- ss = store.getSortState();\r
- if(ss){\r
- o.sort = ss;\r
- }\r
- if(store.getGroupState){\r
- gs = store.getGroupState();\r
- if(gs){\r
- o.group = gs;\r
- }\r
- }\r
- }\r
- return o;\r
- },\r
-\r
- // private\r
- afterRender : function(){\r
- Ext.grid.GridPanel.superclass.afterRender.call(this);\r
- var v = this.view;\r
- this.on('bodyresize', v.layout, v);\r
- v.layout();\r
- if(this.deferRowRender){\r
- v.afterRender.defer(10, this.view);\r
- }else{\r
- v.afterRender();\r
- }\r
- this.viewReady = true;\r
- },\r
-\r
- <div id="method-Ext.grid.GridPanel-reconfigure"></div>/**\r
- * <p>Reconfigures the grid to use a different Store and Column Model\r
- * and fires the 'reconfigure' event. The View will be bound to the new\r
- * objects and refreshed.</p>\r
- * <p>Be aware that upon reconfiguring a GridPanel, certain existing settings <i>may</i> become\r
- * invalidated. For example the configured {@link #autoExpandColumn} may no longer exist in the\r
- * new ColumnModel. Also, an existing {@link Ext.PagingToolbar PagingToolbar} will still be bound\r
- * to the old Store, and will need rebinding. Any {@link #plugins} might also need reconfiguring\r
- * with the new data.</p>\r
- * @param {Ext.data.Store} store The new {@link Ext.data.Store} object\r
- * @param {Ext.grid.ColumnModel} colModel The new {@link Ext.grid.ColumnModel} object\r
- */\r
- reconfigure : function(store, colModel){\r
- var rendered = this.rendered;\r
- if(rendered){\r
- if(this.loadMask){\r
- this.loadMask.destroy();\r
- this.loadMask = new Ext.LoadMask(this.bwrap,\r
- Ext.apply({}, {store:store}, this.initialConfig.loadMask));\r
- }\r
- }\r
- if(this.view){\r
- this.view.initData(store, colModel);\r
- }\r
- this.store = store;\r
- this.colModel = colModel;\r
- if(rendered){\r
- this.view.refresh(true);\r
- }\r
- this.fireEvent('reconfigure', this, store, colModel);\r
- },\r
-\r
- // private\r
- onDestroy : function(){\r
- if(this.rendered){\r
- Ext.destroy(this.view, this.loadMask);\r
- }else if(this.store && this.store.autoDestroy){\r
- this.store.destroy();\r
- }\r
- Ext.destroy(this.colModel, this.selModel);\r
- this.store = this.selModel = this.colModel = this.view = this.loadMask = null;\r
- Ext.grid.GridPanel.superclass.onDestroy.call(this);\r
- },\r
-\r
- // private\r
- processEvent : function(name, e){\r
- this.fireEvent(name, e);\r
- var t = e.getTarget(),\r
- v = this.view,\r
- header = v.findHeaderIndex(t);\r
- \r
- if(header !== false){\r
- this.fireEvent('header' + name, this, header, e);\r
- }else{\r
- var row = v.findRowIndex(t),\r
- cell,\r
- body;\r
- if(row !== false){\r
- this.fireEvent('row' + name, this, row, e);\r
- cell = v.findCellIndex(t);\r
- body = v.findRowBody(t);\r
- if(cell !== false){\r
- this.fireEvent('cell' + name, this, row, cell, e);\r
- }\r
- if(body){\r
- this.fireEvent('rowbody' + name, this, row, e);\r
- }\r
- }else{\r
- this.fireEvent('container' + name, this, e);\r
- }\r
- }\r
- this.view.processEvent(name, e);\r
- },\r
-\r
- // private\r
- onClick : function(e){\r
- this.processEvent('click', e);\r
- },\r
-\r
- // private\r
- onMouseDown : function(e){\r
- this.processEvent('mousedown', e);\r
- },\r
-\r
- // private\r
- onContextMenu : function(e, t){\r
- this.processEvent('contextmenu', e);\r
- },\r
-\r
- // private\r
- onDblClick : function(e){\r
- this.processEvent('dblclick', e);\r
- },\r
-\r
- // private\r
- walkCells : function(row, col, step, fn, scope){\r
- var cm = this.colModel, \r
- clen = cm.getColumnCount(),\r
- ds = this.store, \r
- rlen = ds.getCount(), \r
- first = true;\r
- if(step < 0){\r
- if(col < 0){\r
- row--;\r
- first = false;\r
- }\r
- while(row >= 0){\r
- if(!first){\r
- col = clen-1;\r
- }\r
- first = false;\r
- while(col >= 0){\r
- if(fn.call(scope || this, row, col, cm) === true){\r
- return [row, col];\r
- }\r
- col--;\r
- }\r
- row--;\r
- }\r
- } else {\r
- if(col >= clen){\r
- row++;\r
- first = false;\r
- }\r
- while(row < rlen){\r
- if(!first){\r
- col = 0;\r
- }\r
- first = false;\r
- while(col < clen){\r
- if(fn.call(scope || this, row, col, cm) === true){\r
- return [row, col];\r
- }\r
- col++;\r
- }\r
- row++;\r
- }\r
- }\r
- return null;\r
- },\r
-\r
- // private\r
- onResize : function(){\r
- Ext.grid.GridPanel.superclass.onResize.apply(this, arguments);\r
- if(this.viewReady){\r
- this.view.layout();\r
- }\r
- },\r
-\r
- <div id="method-Ext.grid.GridPanel-getGridEl"></div>/**\r
- * Returns the grid's underlying element.\r
- * @return {Element} The element\r
- */\r
- getGridEl : function(){\r
- return this.body;\r
- },\r
-\r
- // private for compatibility, overridden by editor grid\r
- stopEditing : Ext.emptyFn,\r
-\r
- <div id="method-Ext.grid.GridPanel-getSelectionModel"></div>/**\r
- * Returns the grid's selection model configured by the <code>{@link #selModel}</code>\r
- * configuration option. If no selection model was configured, this will create\r
- * and return a {@link Ext.grid.RowSelectionModel RowSelectionModel}.\r
- * @return {SelectionModel}\r
- */\r
- getSelectionModel : function(){\r
- if(!this.selModel){\r
- this.selModel = new Ext.grid.RowSelectionModel(\r
- this.disableSelection ? {selectRow: Ext.emptyFn} : null);\r
- }\r
- return this.selModel;\r
- },\r
-\r
- <div id="method-Ext.grid.GridPanel-getStore"></div>/**\r
- * Returns the grid's data store.\r
- * @return {Ext.data.Store} The store\r
- */\r
- getStore : function(){\r
- return this.store;\r
- },\r
-\r
- <div id="method-Ext.grid.GridPanel-getColumnModel"></div>/**\r
- * Returns the grid's ColumnModel.\r
- * @return {Ext.grid.ColumnModel} The column model\r
- */\r
- getColumnModel : function(){\r
- return this.colModel;\r
- },\r
-\r
- <div id="method-Ext.grid.GridPanel-getView"></div>/**\r
- * Returns the grid's GridView object.\r
- * @return {Ext.grid.GridView} The grid view\r
- */\r
- getView : function(){\r
- if(!this.view){\r
- this.view = new Ext.grid.GridView(this.viewConfig);\r
- }\r
- return this.view;\r
- },\r
- <div id="method-Ext.grid.GridPanel-getDragDropText"></div>/**\r
- * Called to get grid's drag proxy text, by default returns this.ddText.\r
- * @return {String} The text\r
- */\r
- getDragDropText : function(){\r
- var count = this.selModel.getCount();\r
- return String.format(this.ddText, count, count == 1 ? '' : 's');\r
- }\r
-\r
- <div id="cfg-Ext.grid.GridPanel-activeItem"></div>/** \r
- * @cfg {String/Number} activeItem \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-autoDestroy"></div>/** \r
- * @cfg {Boolean} autoDestroy \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-autoLoad"></div>/** \r
- * @cfg {Object/String/Function} autoLoad \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-autoWidth"></div>/** \r
- * @cfg {Boolean} autoWidth \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-bufferResize"></div>/** \r
- * @cfg {Boolean/Number} bufferResize \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-defaultType"></div>/** \r
- * @cfg {String} defaultType \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-defaults"></div>/** \r
- * @cfg {Object} defaults \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-hideBorders"></div>/** \r
- * @cfg {Boolean} hideBorders \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-items"></div>/** \r
- * @cfg {Mixed} items \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-layout"></div>/** \r
- * @cfg {String} layout \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-layoutConfig"></div>/** \r
- * @cfg {Object} layoutConfig \r
- * @hide \r
- */\r
- <div id="cfg-Ext.grid.GridPanel-monitorResize"></div>/** \r
- * @cfg {Boolean} monitorResize \r
- * @hide \r
- */\r
- <div id="prop-Ext.grid.GridPanel-items"></div>/** \r
- * @property items \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-add"></div>/** \r
- * @method add \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-cascade"></div>/** \r
- * @method cascade \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-doLayout"></div>/** \r
- * @method doLayout \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-find"></div>/** \r
- * @method find \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-findBy"></div>/** \r
- * @method findBy \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-findById"></div>/** \r
- * @method findById \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-findByType"></div>/** \r
- * @method findByType \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-getComponent"></div>/** \r
- * @method getComponent \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-getLayout"></div>/** \r
- * @method getLayout \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-getUpdater"></div>/** \r
- * @method getUpdater \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-insert"></div>/** \r
- * @method insert \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-load"></div>/** \r
- * @method load \r
- * @hide \r
- */\r
- <div id="method-Ext.grid.GridPanel-remove"></div>/** \r
- * @method remove \r
- * @hide \r
- */\r
- <div id="event-Ext.grid.GridPanel-add"></div>/** \r
- * @event add \r
- * @hide \r
- */\r
- <div id="event-Ext.grid.GridPanel-afterlayout"></div>/** \r
- * @event afterlayout \r
- * @hide \r
- */\r
- <div id="event-Ext.grid.GridPanel-beforeadd"></div>/** \r
- * @event beforeadd \r
- * @hide \r
- */\r
- <div id="event-Ext.grid.GridPanel-beforeremove"></div>/** \r
- * @event beforeremove \r
- * @hide \r
- */\r
- <div id="event-Ext.grid.GridPanel-remove"></div>/** \r
- * @event remove \r
- * @hide \r
- */\r
-\r
-\r
-\r
- <div id="cfg-Ext.grid.GridPanel-allowDomMove"></div>/**\r
- * @cfg {String} allowDomMove @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-autoEl"></div>/**\r
- * @cfg {String} autoEl @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-applyTo"></div>/**\r
- * @cfg {String} applyTo @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-autoScroll"></div>/**\r
- * @cfg {String} autoScroll @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-bodyBorder"></div>/**\r
- * @cfg {String} bodyBorder @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-bodyStyle"></div>/**\r
- * @cfg {String} bodyStyle @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-contentEl"></div>/**\r
- * @cfg {String} contentEl @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-disabledClass"></div>/**\r
- * @cfg {String} disabledClass @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-elements"></div>/**\r
- * @cfg {String} elements @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-html"></div>/**\r
- * @cfg {String} html @hide\r
- */\r
- <div id="cfg-Ext.grid.GridPanel-preventBodyReset"></div>/**\r
- * @cfg {Boolean} preventBodyReset\r
- * @hide\r
- */\r
- <div id="prop-Ext.grid.GridPanel-disabled"></div>/**\r
- * @property disabled\r
- * @hide\r
- */\r
- <div id="method-Ext.grid.GridPanel-applyToMarkup"></div>/**\r
- * @method applyToMarkup\r
- * @hide\r
- */\r
- <div id="method-Ext.grid.GridPanel-enable"></div>/**\r
- * @method enable\r
- * @hide\r
- */\r
- <div id="method-Ext.grid.GridPanel-disable"></div>/**\r
- * @method disable\r
- * @hide\r
- */\r
- <div id="method-Ext.grid.GridPanel-setDisabled"></div>/**\r
- * @method setDisabled\r
- * @hide\r
- */\r
-});\r
-Ext.reg('grid', Ext.grid.GridPanel);</pre> \r
-</body>\r
-</html>
\ No newline at end of file