docs/source/GridPanel.html

   1 <html>\r
   2 <head>\r
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
   4   <title>The source code</title>\r
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   7 </head>\r
   8 <body  onload="prettyPrint();">\r
   9     <pre class="prettyprint lang-js"><div id="cls-Ext.grid.GridPanel"></div>/**\r
  10  * @class Ext.grid.GridPanel\r
  11  * @extends Ext.Panel\r
  12  * <p>This class represents the primary interface of a component based grid control to represent data\r
  13  * in a tabular format of rows and columns. The GridPanel is composed of the following:</p>\r
  14  * <div class="mdetail-params"><ul>\r
  15  * <li><b>{@link Ext.data.Store Store}</b> : The Model holding the data records (rows)\r
  16  * <div class="sub-desc"></div></li>\r
  17  * <li><b>{@link Ext.grid.ColumnModel Column model}</b> : Column makeup\r
  18  * <div class="sub-desc"></div></li>\r
  19  * <li><b>{@link Ext.grid.GridView View}</b> : Encapsulates the user interface \r
  20  * <div class="sub-desc"></div></li>\r
  21  * <li><b>{@link Ext.grid.AbstractSelectionModel selection model}</b> : Selection behavior \r
  22  * <div class="sub-desc"></div></li>\r
  23  * </ul></div>\r
  24  * <p>Example usage:</p>\r
  25  * <pre><code>\r
  26 var grid = new Ext.grid.GridPanel({\r
  27     {@link #store}: new {@link Ext.data.Store}({\r
  28         {@link Ext.data.Store#autoDestroy autoDestroy}: true,\r
  29         {@link Ext.data.Store#reader reader}: reader,\r
  30         {@link Ext.data.Store#data data}: xg.dummyData\r
  31     }),\r
  32     {@link #colModel}: new {@link Ext.grid.ColumnModel}({\r
  33         {@link Ext.grid.ColumnModel#defaults defaults}: {\r
  34             width: 120,\r
  35             sortable: true\r
  36         },\r
  37         {@link Ext.grid.ColumnModel#columns columns}: [\r
  38             {id: 'company', header: 'Company', width: 200, sortable: true, dataIndex: 'company'},\r
  39             {header: 'Price', renderer: Ext.util.Format.usMoney, dataIndex: 'price'},\r
  40             {header: 'Change', dataIndex: 'change'},\r
  41             {header: '% Change', dataIndex: 'pctChange'},\r
  42             // instead of specifying renderer: Ext.util.Format.dateRenderer('m/d/Y') use xtype\r
  43             {\r
  44                 header: 'Last Updated', width: 135, dataIndex: 'lastChange',\r
  45                 xtype: 'datecolumn', format: 'M d, Y'\r
  46             }\r
  47         ],\r
  48     }),\r
  49     {@link #viewConfig}: {\r
  50         {@link Ext.grid.GridView#forceFit forceFit}: true,\r
  51 \r
  52 //      Return CSS class to apply to rows depending upon data values\r
  53         {@link Ext.grid.GridView#getRowClass getRowClass}: function(record, index) {\r
  54             var c = record.{@link Ext.data.Record#get get}('change');\r
  55             if (c < 0) {\r
  56                 return 'price-fall';\r
  57             } else if (c > 0) {\r
  58                 return 'price-rise';\r
  59             }\r
  60         }\r
  61     },\r
  62     {@link #sm}: new Ext.grid.RowSelectionModel({singleSelect:true}),\r
  63     width: 600,\r
  64     height: 300,\r
  65     frame: true,\r
  66     title: 'Framed with Row Selection and Horizontal Scrolling',\r
  67     iconCls: 'icon-grid'\r
  68 });\r
  69  * </code></pre>\r
  70  * <p><b><u>Notes:</u></b></p>\r
  71  * <div class="mdetail-params"><ul>\r
  72  * <li>Although this class inherits many configuration options from base classes, some of them\r
  73  * (such as autoScroll, autoWidth, layout, items, etc) are not used by this class, and will\r
  74  * have no effect.</li>\r
  75  * <li>A grid <b>requires</b> a width in which to scroll its columns, and a height in which to\r
  76  * scroll its rows. These dimensions can either be set explicitly through the\r
  77  * <tt>{@link Ext.BoxComponent#height height}</tt> and <tt>{@link Ext.BoxComponent#width width}</tt>\r
  78  * configuration options or implicitly set by using the grid as a child item of a\r
  79  * {@link Ext.Container Container} which will have a {@link Ext.Container#layout layout manager}\r
  80  * provide the sizing of its child items (for example the Container of the Grid may specify\r
  81  * <tt>{@link Ext.Container#layout layout}:'fit'</tt>).</li>\r
  82  * <li>To access the data in a Grid, it is necessary to use the data model encapsulated\r
  83  * by the {@link #store Store}. See the {@link #cellclick} event for more details.</li>\r
  84  * </ul></div>\r
  85  * @constructor\r
  86  * @param {Object} config The config object\r
  87  * @xtype grid\r
  88  */\r
  89 Ext.grid.GridPanel = Ext.extend(Ext.Panel, {\r
  90     <div id="cfg-Ext.grid.GridPanel-autoExpandColumn"></div>/**\r
  91      * @cfg {String} autoExpandColumn\r
  92      * <p>The <tt>{@link Ext.grid.Column#id id}</tt> of a {@link Ext.grid.Column column} in\r
  93      * this grid that should expand to fill unused space. This value specified here can not\r
  94      * be <tt>0</tt>.</p>\r
  95      * <br><p><b>Note</b>: If the Grid's {@link Ext.grid.GridView view} is configured with\r
  96      * <tt>{@link Ext.grid.GridView#forceFit forceFit}=true</tt> the <tt>autoExpandColumn</tt>\r
  97      * is ignored. See {@link Ext.grid.Column}.<tt>{@link Ext.grid.Column#width width}</tt>\r
  98      * for additional details.</p>\r
  99      * <p>See <tt>{@link #autoExpandMax}</tt> and <tt>{@link #autoExpandMin}</tt> also.</p>\r
 100      */\r
 101     autoExpandColumn : false,\r
 102     <div id="cfg-Ext.grid.GridPanel-autoExpandMax"></div>/**\r
 103      * @cfg {Number} autoExpandMax The maximum width the <tt>{@link #autoExpandColumn}</tt>\r
 104      * can have (if enabled). Defaults to <tt>1000</tt>.\r
 105      */\r
 106     autoExpandMax : 1000,\r
 107     <div id="cfg-Ext.grid.GridPanel-autoExpandMin"></div>/**\r
 108      * @cfg {Number} autoExpandMin The minimum width the <tt>{@link #autoExpandColumn}</tt>\r
 109      * can have (if enabled). Defaults to <tt>50</tt>.\r
 110      */\r
 111     autoExpandMin : 50,\r
 112     <div id="cfg-Ext.grid.GridPanel-columnLines"></div>/**\r
 113      * @cfg {Boolean} columnLines <tt>true</tt> to add css for column separation lines.\r
 114      * Default is <tt>false</tt>.\r
 115      */\r
 116     columnLines : false,\r
 117     <div id="cfg-Ext.grid.GridPanel-cm"></div>/**\r
 118      * @cfg {Object} cm Shorthand for <tt>{@link #colModel}</tt>.\r
 119      */\r
 120     <div id="cfg-Ext.grid.GridPanel-colModel"></div>/**\r
 121      * @cfg {Object} colModel The {@link Ext.grid.ColumnModel} to use when rendering the grid (required).\r
 122      */\r
 123     <div id="cfg-Ext.grid.GridPanel-columns"></div>/**\r
 124      * @cfg {Array} columns An array of {@link Ext.grid.Column columns} to auto create a\r
 125      * {@link Ext.grid.ColumnModel}.  The ColumnModel may be explicitly created via the\r
 126      * <tt>{@link #colModel}</tt> configuration property.\r
 127      */\r
 128     <div id="cfg-Ext.grid.GridPanel-ddGroup"></div>/**\r
 129      * @cfg {String} ddGroup The DD group this GridPanel belongs to. Defaults to <tt>'GridDD'</tt> if not specified.\r
 130      */\r
 131     <div id="cfg-Ext.grid.GridPanel-ddText"></div>/**\r
 132      * @cfg {String} ddText\r
 133      * Configures the text in the drag proxy.  Defaults to:\r
 134      * <pre><code>\r
 135      * ddText : '{0} selected row{1}'\r
 136      * </code></pre>\r
 137      * <tt>{0}</tt> is replaced with the number of selected rows.\r
 138      */\r
 139     ddText : '{0} selected row{1}',\r
 140     <div id="cfg-Ext.grid.GridPanel-deferRowRender"></div>/**\r
 141      * @cfg {Boolean} deferRowRender <P>Defaults to <tt>true</tt> to enable deferred row rendering.</p>\r
 142      * <p>This allows the GridPanel to be initially rendered empty, with the expensive update of the row\r
 143      * structure deferred so that layouts with GridPanels appear more quickly.</p>\r
 144      */\r
 145     deferRowRender : true,\r
 146     <div id="cfg-Ext.grid.GridPanel-disableSelection"></div>/**\r
 147      * @cfg {Boolean} disableSelection <p><tt>true</tt> to disable selections in the grid. Defaults to <tt>false</tt>.</p>\r
 148      * <p>Ignored if a {@link #selModel SelectionModel} is specified.</p>\r
 149      */\r
 150     <div id="cfg-Ext.grid.GridPanel-enableColumnResize"></div>/**\r
 151      * @cfg {Boolean} enableColumnResize <tt>false</tt> to turn off column resizing for the whole grid. Defaults to <tt>true</tt>.\r
 152      */\r
 153     <div id="cfg-Ext.grid.GridPanel-enableColumnHide"></div>/**\r
 154      * @cfg {Boolean} enableColumnHide\r
 155      * Defaults to <tt>true</tt> to enable {@link Ext.grid.Column#hidden hiding of columns}\r
 156      * with the {@link #enableHdMenu header menu}.\r
 157      */\r
 158     enableColumnHide : true,\r
 159     <div id="cfg-Ext.grid.GridPanel-enableColumnMove"></div>/**\r
 160      * @cfg {Boolean} enableColumnMove Defaults to <tt>true</tt> to enable drag and drop reorder of columns. <tt>false</tt>\r
 161      * to turn off column reordering via drag drop.\r
 162      */\r
 163     enableColumnMove : true,\r
 164     <div id="cfg-Ext.grid.GridPanel-enableDragDrop"></div>/**\r
 165      * @cfg {Boolean} enableDragDrop <p>Enables dragging of the selected rows of the GridPanel. Defaults to <tt>false</tt>.</p>\r
 166      * <p>Setting this to <b><tt>true</tt></b> causes this GridPanel's {@link #getView GridView} to\r
 167      * create an instance of {@link Ext.grid.GridDragZone}. <b>Note</b>: this is available only <b>after</b>\r
 168      * the Grid has been rendered as the GridView's <tt>{@link Ext.grid.GridView#dragZone dragZone}</tt>\r
 169      * property.</p>\r
 170      * <p>A cooperating {@link Ext.dd.DropZone DropZone} must be created who's implementations of\r
 171      * {@link Ext.dd.DropZone#onNodeEnter onNodeEnter}, {@link Ext.dd.DropZone#onNodeOver onNodeOver},\r
 172      * {@link Ext.dd.DropZone#onNodeOut onNodeOut} and {@link Ext.dd.DropZone#onNodeDrop onNodeDrop} are able\r
 173      * to process the {@link Ext.grid.GridDragZone#getDragData data} which is provided.</p>\r
 174      */\r
 175     enableDragDrop : false,\r
 176     <div id="cfg-Ext.grid.GridPanel-enableHdMenu"></div>/**\r
 177      * @cfg {Boolean} enableHdMenu Defaults to <tt>true</tt> to enable the drop down button for menu in the headers.\r
 178      */\r
 179     enableHdMenu : true,\r
 180     <div id="cfg-Ext.grid.GridPanel-hideHeaders"></div>/**\r
 181      * @cfg {Boolean} hideHeaders True to hide the grid's header. Defaults to <code>false</code>.\r
 182      */\r
 183     <div id="cfg-Ext.grid.GridPanel-loadMask"></div>/**\r
 184      * @cfg {Object} loadMask An {@link Ext.LoadMask} config or true to mask the grid while\r
 185      * loading. Defaults to <code>false</code>.\r
 186      */\r
 187     loadMask : false,\r
 188     <div id="cfg-Ext.grid.GridPanel-maxHeight"></div>/**\r
 189      * @cfg {Number} maxHeight Sets the maximum height of the grid - ignored if <tt>autoHeight</tt> is not on.\r
 190      */\r
 191     <div id="cfg-Ext.grid.GridPanel-minColumnWidth"></div>/**\r
 192      * @cfg {Number} minColumnWidth The minimum width a column can be resized to. Defaults to <tt>25</tt>.\r
 193      */\r
 194     minColumnWidth : 25,\r
 195     <div id="cfg-Ext.grid.GridPanel-sm"></div>/**\r
 196      * @cfg {Object} sm Shorthand for <tt>{@link #selModel}</tt>.\r
 197      */\r
 198     <div id="cfg-Ext.grid.GridPanel-selModel"></div>/**\r
 199      * @cfg {Object} selModel Any subclass of {@link Ext.grid.AbstractSelectionModel} that will provide\r
 200      * the selection model for the grid (defaults to {@link Ext.grid.RowSelectionModel} if not specified).\r
 201      */\r
 202     <div id="cfg-Ext.grid.GridPanel-store"></div>/**\r
 203      * @cfg {Ext.data.Store} store The {@link Ext.data.Store} the grid should use as its data source (required).\r
 204      */\r
 205     <div id="cfg-Ext.grid.GridPanel-stripeRows"></div>/**\r
 206      * @cfg {Boolean} stripeRows <tt>true</tt> to stripe the rows. Default is <tt>false</tt>.\r
 207      * <p>This causes the CSS class <tt><b>x-grid3-row-alt</b></tt> to be added to alternate rows of\r
 208      * the grid. A default CSS rule is provided which sets a background colour, but you can override this\r
 209      * with a rule which either overrides the <b>background-color</b> style using the '!important'\r
 210      * modifier, or which uses a CSS selector of higher specificity.</p>\r
 211      */\r
 212     stripeRows : false,\r
 213     <div id="cfg-Ext.grid.GridPanel-trackMouseOver"></div>/**\r
 214      * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is <tt>true</tt>\r
 215      * for GridPanel, but <tt>false</tt> for EditorGridPanel.\r
 216      */\r
 217     trackMouseOver : true,\r
 218     <div id="cfg-Ext.grid.GridPanel-stateEvents"></div>/**\r
 219      * @cfg {Array} stateEvents\r
 220      * An array of events that, when fired, should trigger this component to save its state.\r
 221      * Defaults to:<pre><code>\r
 222      * stateEvents: ['columnmove', 'columnresize', 'sortchange', 'groupchange']\r
 223      * </code></pre>\r
 224      * <p>These can be any types of events supported by this component, including browser or\r
 225      * custom events (e.g., <tt>['click', 'customerchange']</tt>).</p>\r
 226      * <p>See {@link Ext.Component#stateful} for an explanation of saving and restoring\r
 227      * Component state.</p>\r
 228      */\r
 229     stateEvents : ['columnmove', 'columnresize', 'sortchange', 'groupchange'],\r
 230     <div id="cfg-Ext.grid.GridPanel-view"></div>/**\r
 231      * @cfg {Object} view The {@link Ext.grid.GridView} used by the grid. This can be set\r
 232      * before a call to {@link Ext.Component#render render()}.\r
 233      */\r
 234     view : null,\r
 235     \r
 236     <div id="cfg-Ext.grid.GridPanel-bubbleEvents"></div>/**\r
 237      * @cfg {Array} bubbleEvents\r
 238      * <p>An array of events that, when fired, should be bubbled to any parent container.\r
 239      * See {@link Ext.util.Observable#enableBubble}. \r
 240      * Defaults to <tt>[]</tt>.\r
 241      */\r
 242     bubbleEvents: [],\r
 243     \r
 244     <div id="cfg-Ext.grid.GridPanel-viewConfig"></div>/**\r
 245      * @cfg {Object} viewConfig A config object that will be applied to the grid's UI view.  Any of\r
 246      * the config options available for {@link Ext.grid.GridView} can be specified here. This option\r
 247      * is ignored if <tt>{@link #view}</tt> is specified.\r
 248      */\r
 249 \r
 250     // private\r
 251     rendered : false,\r
 252     // private\r
 253     viewReady : false,\r
 254 \r
 255     // private\r
 256     initComponent : function(){\r
 257         Ext.grid.GridPanel.superclass.initComponent.call(this);\r
 258 \r
 259         if(this.columnLines){\r
 260             this.cls = (this.cls || '') + ' x-grid-with-col-lines';\r
 261         }\r
 262         // override any provided value since it isn't valid\r
 263         // and is causing too many bug reports ;)\r
 264         this.autoScroll = false;\r
 265         this.autoWidth = false;\r
 266 \r
 267         if(Ext.isArray(this.columns)){\r
 268             this.colModel = new Ext.grid.ColumnModel(this.columns);\r
 269             delete this.columns;\r
 270         }\r
 271 \r
 272         // check and correct shorthanded configs\r
 273         if(this.ds){\r
 274             this.store = this.ds;\r
 275             delete this.ds;\r
 276         }\r
 277         if(this.cm){\r
 278             this.colModel = this.cm;\r
 279             delete this.cm;\r
 280         }\r
 281         if(this.sm){\r
 282             this.selModel = this.sm;\r
 283             delete this.sm;\r
 284         }\r
 285         this.store = Ext.StoreMgr.lookup(this.store);\r
 286 \r
 287         this.addEvents(\r
 288             // raw events\r
 289             <div id="event-Ext.grid.GridPanel-click"></div>/**\r
 290              * @event click\r
 291              * The raw click event for the entire grid.\r
 292              * @param {Ext.EventObject} e\r
 293              */\r
 294             'click',\r
 295             <div id="event-Ext.grid.GridPanel-dblclick"></div>/**\r
 296              * @event dblclick\r
 297              * The raw dblclick event for the entire grid.\r
 298              * @param {Ext.EventObject} e\r
 299              */\r
 300             'dblclick',\r
 301             <div id="event-Ext.grid.GridPanel-contextmenu"></div>/**\r
 302              * @event contextmenu\r
 303              * The raw contextmenu event for the entire grid.\r
 304              * @param {Ext.EventObject} e\r
 305              */\r
 306             'contextmenu',\r
 307             <div id="event-Ext.grid.GridPanel-mousedown"></div>/**\r
 308              * @event mousedown\r
 309              * The raw mousedown event for the entire grid.\r
 310              * @param {Ext.EventObject} e\r
 311              */\r
 312             'mousedown',\r
 313             <div id="event-Ext.grid.GridPanel-mouseup"></div>/**\r
 314              * @event mouseup\r
 315              * The raw mouseup event for the entire grid.\r
 316              * @param {Ext.EventObject} e\r
 317              */\r
 318             'mouseup',\r
 319             <div id="event-Ext.grid.GridPanel-mouseover"></div>/**\r
 320              * @event mouseover\r
 321              * The raw mouseover event for the entire grid.\r
 322              * @param {Ext.EventObject} e\r
 323              */\r
 324             'mouseover',\r
 325             <div id="event-Ext.grid.GridPanel-mouseout"></div>/**\r
 326              * @event mouseout\r
 327              * The raw mouseout event for the entire grid.\r
 328              * @param {Ext.EventObject} e\r
 329              */\r
 330             'mouseout',\r
 331             <div id="event-Ext.grid.GridPanel-keypress"></div>/**\r
 332              * @event keypress\r
 333              * The raw keypress event for the entire grid.\r
 334              * @param {Ext.EventObject} e\r
 335              */\r
 336             'keypress',\r
 337             <div id="event-Ext.grid.GridPanel-keydown"></div>/**\r
 338              * @event keydown\r
 339              * The raw keydown event for the entire grid.\r
 340              * @param {Ext.EventObject} e\r
 341              */\r
 342             'keydown',\r
 343 \r
 344             // custom events\r
 345             <div id="event-Ext.grid.GridPanel-cellmousedown"></div>/**\r
 346              * @event cellmousedown\r
 347              * Fires before a cell is clicked\r
 348              * @param {Grid} this\r
 349              * @param {Number} rowIndex\r
 350              * @param {Number} columnIndex\r
 351              * @param {Ext.EventObject} e\r
 352              */\r
 353             'cellmousedown',\r
 354             <div id="event-Ext.grid.GridPanel-rowmousedown"></div>/**\r
 355              * @event rowmousedown\r
 356              * Fires before a row is clicked\r
 357              * @param {Grid} this\r
 358              * @param {Number} rowIndex\r
 359              * @param {Ext.EventObject} e\r
 360              */\r
 361             'rowmousedown',\r
 362             <div id="event-Ext.grid.GridPanel-headermousedown"></div>/**\r
 363              * @event headermousedown\r
 364              * Fires before a header is clicked\r
 365              * @param {Grid} this\r
 366              * @param {Number} columnIndex\r
 367              * @param {Ext.EventObject} e\r
 368              */\r
 369             'headermousedown',\r
 370             \r
 371             <div id="event-Ext.grid.GridPanel-groupmousedown"></div>/**\r
 372              * @event groupmousedown\r
 373              * Fires before a group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.\r
 374              * @param {Grid} this\r
 375              * @param {String} groupField\r
 376              * @param {String} groupValue\r
 377              * @param {Ext.EventObject} e\r
 378              */\r
 379             'groupmousedown',\r
 380             \r
 381             <div id="event-Ext.grid.GridPanel-rowbodymousedown"></div>/**\r
 382              * @event rowbodymousedown\r
 383              * Fires before the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>\r
 384              * @param {Grid} this\r
 385              * @param {Number} rowIndex\r
 386              * @param {Ext.EventObject} e\r
 387              */\r
 388             'rowbodymousedown',\r
 389             \r
 390             <div id="event-Ext.grid.GridPanel-containermousedown"></div>/**\r
 391              * @event containermousedown\r
 392              * Fires before the container is clicked. The container consists of any part of the grid body that is not covered by a row.\r
 393              * @param {Grid} this\r
 394              * @param {Ext.EventObject} e\r
 395              */\r
 396             'containermousedown',\r
 397 \r
 398             <div id="event-Ext.grid.GridPanel-cellclick"></div>/**\r
 399              * @event cellclick\r
 400              * Fires when a cell is clicked.\r
 401              * The data for the cell is drawn from the {@link Ext.data.Record Record}\r
 402              * for this row. To access the data in the listener function use the\r
 403              * following technique:\r
 404              * <pre><code>\r
 405 function(grid, rowIndex, columnIndex, e) {\r
 406     var record = grid.getStore().getAt(rowIndex);  // Get the Record\r
 407     var fieldName = grid.getColumnModel().getDataIndex(columnIndex); // Get field name\r
 408     var data = record.get(fieldName);\r
 409 }\r
 410 </code></pre>\r
 411              * @param {Grid} this\r
 412              * @param {Number} rowIndex\r
 413              * @param {Number} columnIndex\r
 414              * @param {Ext.EventObject} e\r
 415              */\r
 416             'cellclick',\r
 417             <div id="event-Ext.grid.GridPanel-celldblclick"></div>/**\r
 418              * @event celldblclick\r
 419              * Fires when a cell is double clicked\r
 420              * @param {Grid} this\r
 421              * @param {Number} rowIndex\r
 422              * @param {Number} columnIndex\r
 423              * @param {Ext.EventObject} e\r
 424              */\r
 425             'celldblclick',\r
 426             <div id="event-Ext.grid.GridPanel-rowclick"></div>/**\r
 427              * @event rowclick\r
 428              * Fires when a row is clicked\r
 429              * @param {Grid} this\r
 430              * @param {Number} rowIndex\r
 431              * @param {Ext.EventObject} e\r
 432              */\r
 433             'rowclick',\r
 434             <div id="event-Ext.grid.GridPanel-rowdblclick"></div>/**\r
 435              * @event rowdblclick\r
 436              * Fires when a row is double clicked\r
 437              * @param {Grid} this\r
 438              * @param {Number} rowIndex\r
 439              * @param {Ext.EventObject} e\r
 440              */\r
 441             'rowdblclick',\r
 442             <div id="event-Ext.grid.GridPanel-headerclick"></div>/**\r
 443              * @event headerclick\r
 444              * Fires when a header is clicked\r
 445              * @param {Grid} this\r
 446              * @param {Number} columnIndex\r
 447              * @param {Ext.EventObject} e\r
 448              */\r
 449             'headerclick',\r
 450             <div id="event-Ext.grid.GridPanel-headerdblclick"></div>/**\r
 451              * @event headerdblclick\r
 452              * Fires when a header cell is double clicked\r
 453              * @param {Grid} this\r
 454              * @param {Number} columnIndex\r
 455              * @param {Ext.EventObject} e\r
 456              */\r
 457             'headerdblclick',\r
 458             <div id="event-Ext.grid.GridPanel-groupclick"></div>/**\r
 459              * @event groupclick\r
 460              * Fires when group header is clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.\r
 461              * @param {Grid} this\r
 462              * @param {String} groupField\r
 463              * @param {String} groupValue\r
 464              * @param {Ext.EventObject} e\r
 465              */\r
 466             'groupclick',\r
 467             <div id="event-Ext.grid.GridPanel-groupdblclick"></div>/**\r
 468              * @event groupdblclick\r
 469              * Fires when group header is double clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.\r
 470              * @param {Grid} this\r
 471              * @param {String} groupField\r
 472              * @param {String} groupValue\r
 473              * @param {Ext.EventObject} e\r
 474              */\r
 475             'groupdblclick',\r
 476             <div id="event-Ext.grid.GridPanel-containerclick"></div>/**\r
 477              * @event containerclick\r
 478              * Fires when the container is clicked. The container consists of any part of the grid body that is not covered by a row.\r
 479              * @param {Grid} this\r
 480              * @param {Ext.EventObject} e\r
 481              */\r
 482             'containerclick',\r
 483             <div id="event-Ext.grid.GridPanel-containerdblclick"></div>/**\r
 484              * @event containerdblclick\r
 485              * 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
 486              * @param {Grid} this\r
 487              * @param {Ext.EventObject} e\r
 488              */\r
 489             'containerdblclick',\r
 490             \r
 491             <div id="event-Ext.grid.GridPanel-rowbodyclick"></div>/**\r
 492              * @event rowbodyclick\r
 493              * Fires when the row body is clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>\r
 494              * @param {Grid} this\r
 495              * @param {Number} rowIndex\r
 496              * @param {Ext.EventObject} e\r
 497              */\r
 498             'rowbodyclick',\r
 499             <div id="event-Ext.grid.GridPanel-rowbodydblclick"></div>/**\r
 500              * @event rowbodydblclick\r
 501              * Fires when the row body is double clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>\r
 502              * @param {Grid} this\r
 503              * @param {Number} rowIndex\r
 504              * @param {Ext.EventObject} e\r
 505              */\r
 506             'rowbodydblclick',\r
 507             \r
 508             <div id="event-Ext.grid.GridPanel-rowcontextmenu"></div>/**\r
 509              * @event rowcontextmenu\r
 510              * Fires when a row is right clicked\r
 511              * @param {Grid} this\r
 512              * @param {Number} rowIndex\r
 513              * @param {Ext.EventObject} e\r
 514              */\r
 515             'rowcontextmenu',\r
 516             <div id="event-Ext.grid.GridPanel-cellcontextmenu"></div>/**\r
 517              * @event cellcontextmenu\r
 518              * Fires when a cell is right clicked\r
 519              * @param {Grid} this\r
 520              * @param {Number} rowIndex\r
 521              * @param {Number} cellIndex\r
 522              * @param {Ext.EventObject} e\r
 523              */\r
 524             'cellcontextmenu',\r
 525             <div id="event-Ext.grid.GridPanel-headercontextmenu"></div>/**\r
 526              * @event headercontextmenu\r
 527              * Fires when a header is right clicked\r
 528              * @param {Grid} this\r
 529              * @param {Number} columnIndex\r
 530              * @param {Ext.EventObject} e\r
 531              */\r
 532             'headercontextmenu',\r
 533             <div id="event-Ext.grid.GridPanel-groupcontextmenu"></div>/**\r
 534              * @event groupcontextmenu\r
 535              * Fires when group header is right clicked. <b>Only applies for grids with a {@link Ext.grid.GroupingView GroupingView}</b>.\r
 536              * @param {Grid} this\r
 537              * @param {String} groupField\r
 538              * @param {String} groupValue\r
 539              * @param {Ext.EventObject} e\r
 540              */\r
 541             'groupcontextmenu',\r
 542             <div id="event-Ext.grid.GridPanel-containercontextmenu"></div>/**\r
 543              * @event containercontextmenu\r
 544              * 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
 545              * @param {Grid} this\r
 546              * @param {Ext.EventObject} e\r
 547              */\r
 548             'containercontextmenu',\r
 549             <div id="event-Ext.grid.GridPanel-rowbodycontextmenu"></div>/**\r
 550              * @event rowbodycontextmenu\r
 551              * Fires when the row body is right clicked. <b>Only applies for grids with {@link Ext.grid.GridView#enableRowBody enableRowBody} configured.</b>\r
 552              * @param {Grid} this\r
 553              * @param {Number} rowIndex\r
 554              * @param {Ext.EventObject} e\r
 555              */\r
 556             'rowbodycontextmenu',\r
 557             <div id="event-Ext.grid.GridPanel-bodyscroll"></div>/**\r
 558              * @event bodyscroll\r
 559              * Fires when the body element is scrolled\r
 560              * @param {Number} scrollLeft\r
 561              * @param {Number} scrollTop\r
 562              */\r
 563             'bodyscroll',\r
 564             <div id="event-Ext.grid.GridPanel-columnresize"></div>/**\r
 565              * @event columnresize\r
 566              * Fires when the user resizes a column\r
 567              * @param {Number} columnIndex\r
 568              * @param {Number} newSize\r
 569              */\r
 570             'columnresize',\r
 571             <div id="event-Ext.grid.GridPanel-columnmove"></div>/**\r
 572              * @event columnmove\r
 573              * Fires when the user moves a column\r
 574              * @param {Number} oldIndex\r
 575              * @param {Number} newIndex\r
 576              */\r
 577             'columnmove',\r
 578             <div id="event-Ext.grid.GridPanel-sortchange"></div>/**\r
 579              * @event sortchange\r
 580              * Fires when the grid's store sort changes\r
 581              * @param {Grid} this\r
 582              * @param {Object} sortInfo An object with the keys field and direction\r
 583              */\r
 584             'sortchange',\r
 585             <div id="event-Ext.grid.GridPanel-groupchange"></div>/**\r
 586              * @event groupchange\r
 587              * Fires when the grid's grouping changes (only applies for grids with a {@link Ext.grid.GroupingView GroupingView})\r
 588              * @param {Grid} this\r
 589              * @param {String} groupField A string with the grouping field, null if the store is not grouped.\r
 590              */\r
 591             'groupchange',\r
 592             <div id="event-Ext.grid.GridPanel-reconfigure"></div>/**\r
 593              * @event reconfigure\r
 594              * Fires when the grid is reconfigured with a new store and/or column model.\r
 595              * @param {Grid} this\r
 596              * @param {Ext.data.Store} store The new store\r
 597              * @param {Ext.grid.ColumnModel} colModel The new column model\r
 598              */\r
 599             'reconfigure',\r
 600             <div id="event-Ext.grid.GridPanel-viewready"></div>/**\r
 601              * @event viewready\r
 602              * Fires when the grid view is available (use this for selecting a default row). \r
 603              * @param {Grid} this\r
 604              */\r
 605             'viewready'\r
 606         );\r
 607     },\r
 608 \r
 609     // private\r
 610     onRender : function(ct, position){\r
 611         Ext.grid.GridPanel.superclass.onRender.apply(this, arguments);\r
 612 \r
 613         var c = this.getGridEl();\r
 614 \r
 615         this.el.addClass('x-grid-panel');\r
 616 \r
 617         this.mon(c, {\r
 618             scope: this,\r
 619             mousedown: this.onMouseDown,\r
 620             click: this.onClick,\r
 621             dblclick: this.onDblClick,\r
 622             contextmenu: this.onContextMenu\r
 623         });\r
 624 \r
 625         this.relayEvents(c, ['mousedown','mouseup','mouseover','mouseout','keypress', 'keydown']);\r
 626 \r
 627         var view = this.getView();\r
 628         view.init(this);\r
 629         view.render();\r
 630         this.getSelectionModel().init(this);\r
 631     },\r
 632 \r
 633     // private\r
 634     initEvents : function(){\r
 635         Ext.grid.GridPanel.superclass.initEvents.call(this);\r
 636 \r
 637         if(this.loadMask){\r
 638             this.loadMask = new Ext.LoadMask(this.bwrap,\r
 639                     Ext.apply({store:this.store}, this.loadMask));\r
 640         }\r
 641     },\r
 642 \r
 643     initStateEvents : function(){\r
 644         Ext.grid.GridPanel.superclass.initStateEvents.call(this);\r
 645         this.mon(this.colModel, 'hiddenchange', this.saveState, this, {delay: 100});\r
 646     },\r
 647 \r
 648     applyState : function(state){\r
 649         var cm = this.colModel,\r
 650             cs = state.columns,\r
 651             store = this.store,\r
 652             s,\r
 653             c,\r
 654             oldIndex;\r
 655             \r
 656         if(cs){\r
 657             for(var i = 0, len = cs.length; i < len; i++){\r
 658                 s = cs[i];\r
 659                 c = cm.getColumnById(s.id);\r
 660                 if(c){\r
 661                     c.hidden = s.hidden;\r
 662                     c.width = s.width;\r
 663                     oldIndex = cm.getIndexById(s.id);\r
 664                     if(oldIndex != i){\r
 665                         cm.moveColumn(oldIndex, i);\r
 666                     }\r
 667                 }\r
 668             }\r
 669         }\r
 670         if(store){\r
 671             s = state.sort;\r
 672             if(s){\r
 673                 store[store.remoteSort ? 'setDefaultSort' : 'sort'](s.field, s.direction);\r
 674             }\r
 675             s = state.group;\r
 676             if(store.groupBy){\r
 677                 if(s){\r
 678                     store.groupBy(s);\r
 679                 }else{\r
 680                     store.clearGrouping();\r
 681                 }\r
 682             }\r
 683 \r
 684         }\r
 685         var o = Ext.apply({}, state);\r
 686         delete o.columns;\r
 687         delete o.sort;\r
 688         Ext.grid.GridPanel.superclass.applyState.call(this, o);\r
 689     },\r
 690 \r
 691     getState : function(){\r
 692         var o = {columns: []},\r
 693             store = this.store,\r
 694             ss,\r
 695             gs;\r
 696             \r
 697         for(var i = 0, c; (c = this.colModel.config[i]); i++){\r
 698             o.columns[i] = {\r
 699                 id: c.id,\r
 700                 width: c.width\r
 701             };\r
 702             if(c.hidden){\r
 703                 o.columns[i].hidden = true;\r
 704             }\r
 705         }\r
 706         if(store){\r
 707             ss = store.getSortState();\r
 708             if(ss){\r
 709                 o.sort = ss;\r
 710             }\r
 711             if(store.getGroupState){\r
 712                 gs = store.getGroupState();\r
 713                 if(gs){\r
 714                     o.group = gs;\r
 715                 }\r
 716             }\r
 717         }\r
 718         return o;\r
 719     },\r
 720 \r
 721     // private\r
 722     afterRender : function(){\r
 723         Ext.grid.GridPanel.superclass.afterRender.call(this);\r
 724         var v = this.view;\r
 725         this.on('bodyresize', v.layout, v);\r
 726         v.layout();\r
 727         if(this.deferRowRender){\r
 728             v.afterRender.defer(10, this.view);\r
 729         }else{\r
 730             v.afterRender();\r
 731         }\r
 732         this.viewReady = true;\r
 733     },\r
 734 \r
 735     <div id="method-Ext.grid.GridPanel-reconfigure"></div>/**\r
 736      * <p>Reconfigures the grid to use a different Store and Column Model\r
 737      * and fires the 'reconfigure' event. The View will be bound to the new\r
 738      * objects and refreshed.</p>\r
 739      * <p>Be aware that upon reconfiguring a GridPanel, certain existing settings <i>may</i> become\r
 740      * invalidated. For example the configured {@link #autoExpandColumn} may no longer exist in the\r
 741      * new ColumnModel. Also, an existing {@link Ext.PagingToolbar PagingToolbar} will still be bound\r
 742      * to the old Store, and will need rebinding. Any {@link #plugins} might also need reconfiguring\r
 743      * with the new data.</p>\r
 744      * @param {Ext.data.Store} store The new {@link Ext.data.Store} object\r
 745      * @param {Ext.grid.ColumnModel} colModel The new {@link Ext.grid.ColumnModel} object\r
 746      */\r
 747     reconfigure : function(store, colModel){\r
 748         var rendered = this.rendered;\r
 749         if(rendered){\r
 750             if(this.loadMask){\r
 751                 this.loadMask.destroy();\r
 752                 this.loadMask = new Ext.LoadMask(this.bwrap,\r
 753                         Ext.apply({}, {store:store}, this.initialConfig.loadMask));\r
 754             }\r
 755         }\r
 756         if(this.view){\r
 757             this.view.initData(store, colModel);\r
 758         }\r
 759         this.store = store;\r
 760         this.colModel = colModel;\r
 761         if(rendered){\r
 762             this.view.refresh(true);\r
 763         }\r
 764         this.fireEvent('reconfigure', this, store, colModel);\r
 765     },\r
 766 \r
 767     // private\r
 768     onDestroy : function(){\r
 769         if(this.rendered){\r
 770             Ext.destroy(this.view, this.loadMask);\r
 771         }else if(this.store && this.store.autoDestroy){\r
 772             this.store.destroy();\r
 773         }\r
 774         Ext.destroy(this.colModel, this.selModel);\r
 775         this.store = this.selModel = this.colModel = this.view = this.loadMask = null;\r
 776         Ext.grid.GridPanel.superclass.onDestroy.call(this);\r
 777     },\r
 778 \r
 779     // private\r
 780     processEvent : function(name, e){\r
 781         this.fireEvent(name, e);\r
 782         var t = e.getTarget(),\r
 783             v = this.view,\r
 784             header = v.findHeaderIndex(t);\r
 785             \r
 786         if(header !== false){\r
 787             this.fireEvent('header' + name, this, header, e);\r
 788         }else{\r
 789             var row = v.findRowIndex(t),\r
 790                 cell,\r
 791                 body;\r
 792             if(row !== false){\r
 793                 this.fireEvent('row' + name, this, row, e);\r
 794                 cell = v.findCellIndex(t);\r
 795                 body = v.findRowBody(t);\r
 796                 if(cell !== false){\r
 797                     this.fireEvent('cell' + name, this, row, cell, e);\r
 798                 }\r
 799                 if(body){\r
 800                     this.fireEvent('rowbody' + name, this, row, e);\r
 801                 }\r
 802             }else{\r
 803                 this.fireEvent('container' + name, this, e);\r
 804             }\r
 805         }\r
 806         this.view.processEvent(name, e);\r
 807     },\r
 808 \r
 809     // private\r
 810     onClick : function(e){\r
 811         this.processEvent('click', e);\r
 812     },\r
 813 \r
 814     // private\r
 815     onMouseDown : function(e){\r
 816         this.processEvent('mousedown', e);\r
 817     },\r
 818 \r
 819     // private\r
 820     onContextMenu : function(e, t){\r
 821         this.processEvent('contextmenu', e);\r
 822     },\r
 823 \r
 824     // private\r
 825     onDblClick : function(e){\r
 826         this.processEvent('dblclick', e);\r
 827     },\r
 828 \r
 829     // private\r
 830     walkCells : function(row, col, step, fn, scope){\r
 831         var cm = this.colModel, \r
 832             clen = cm.getColumnCount(),\r
 833             ds = this.store, \r
 834             rlen = ds.getCount(), \r
 835             first = true;\r
 836         if(step < 0){\r
 837             if(col < 0){\r
 838                 row--;\r
 839                 first = false;\r
 840             }\r
 841             while(row >= 0){\r
 842                 if(!first){\r
 843                     col = clen-1;\r
 844                 }\r
 845                 first = false;\r
 846                 while(col >= 0){\r
 847                     if(fn.call(scope || this, row, col, cm) === true){\r
 848                         return [row, col];\r
 849                     }\r
 850                     col--;\r
 851                 }\r
 852                 row--;\r
 853             }\r
 854         } else {\r
 855             if(col >= clen){\r
 856                 row++;\r
 857                 first = false;\r
 858             }\r
 859             while(row < rlen){\r
 860                 if(!first){\r
 861                     col = 0;\r
 862                 }\r
 863                 first = false;\r
 864                 while(col < clen){\r
 865                     if(fn.call(scope || this, row, col, cm) === true){\r
 866                         return [row, col];\r
 867                     }\r
 868                     col++;\r
 869                 }\r
 870                 row++;\r
 871             }\r
 872         }\r
 873         return null;\r
 874     },\r
 875 \r
 876     // private\r
 877     onResize : function(){\r
 878         Ext.grid.GridPanel.superclass.onResize.apply(this, arguments);\r
 879         if(this.viewReady){\r
 880             this.view.layout();\r
 881         }\r
 882     },\r
 883 \r
 884     <div id="method-Ext.grid.GridPanel-getGridEl"></div>/**\r
 885      * Returns the grid's underlying element.\r
 886      * @return {Element} The element\r
 887      */\r
 888     getGridEl : function(){\r
 889         return this.body;\r
 890     },\r
 891 \r
 892     // private for compatibility, overridden by editor grid\r
 893     stopEditing : Ext.emptyFn,\r
 894 \r
 895     <div id="method-Ext.grid.GridPanel-getSelectionModel"></div>/**\r
 896      * Returns the grid's selection model configured by the <code>{@link #selModel}</code>\r
 897      * configuration option. If no selection model was configured, this will create\r
 898      * and return a {@link Ext.grid.RowSelectionModel RowSelectionModel}.\r
 899      * @return {SelectionModel}\r
 900      */\r
 901     getSelectionModel : function(){\r
 902         if(!this.selModel){\r
 903             this.selModel = new Ext.grid.RowSelectionModel(\r
 904                     this.disableSelection ? {selectRow: Ext.emptyFn} : null);\r
 905         }\r
 906         return this.selModel;\r
 907     },\r
 908 \r
 909     <div id="method-Ext.grid.GridPanel-getStore"></div>/**\r
 910      * Returns the grid's data store.\r
 911      * @return {Ext.data.Store} The store\r
 912      */\r
 913     getStore : function(){\r
 914         return this.store;\r
 915     },\r
 916 \r
 917     <div id="method-Ext.grid.GridPanel-getColumnModel"></div>/**\r
 918      * Returns the grid's ColumnModel.\r
 919      * @return {Ext.grid.ColumnModel} The column model\r
 920      */\r
 921     getColumnModel : function(){\r
 922         return this.colModel;\r
 923     },\r
 924 \r
 925     <div id="method-Ext.grid.GridPanel-getView"></div>/**\r
 926      * Returns the grid's GridView object.\r
 927      * @return {Ext.grid.GridView} The grid view\r
 928      */\r
 929     getView : function(){\r
 930         if(!this.view){\r
 931             this.view = new Ext.grid.GridView(this.viewConfig);\r
 932         }\r
 933         return this.view;\r
 934     },\r
 935     <div id="method-Ext.grid.GridPanel-getDragDropText"></div>/**\r
 936      * Called to get grid's drag proxy text, by default returns this.ddText.\r
 937      * @return {String} The text\r
 938      */\r
 939     getDragDropText : function(){\r
 940         var count = this.selModel.getCount();\r
 941         return String.format(this.ddText, count, count == 1 ? '' : 's');\r
 942     }\r
 943 \r
 944     <div id="cfg-Ext.grid.GridPanel-activeItem"></div>/** \r
 945      * @cfg {String/Number} activeItem \r
 946      * @hide \r
 947      */\r
 948     <div id="cfg-Ext.grid.GridPanel-autoDestroy"></div>/** \r
 949      * @cfg {Boolean} autoDestroy \r
 950      * @hide \r
 951      */\r
 952     <div id="cfg-Ext.grid.GridPanel-autoLoad"></div>/** \r
 953      * @cfg {Object/String/Function} autoLoad \r
 954      * @hide \r
 955      */\r
 956     <div id="cfg-Ext.grid.GridPanel-autoWidth"></div>/** \r
 957      * @cfg {Boolean} autoWidth \r
 958      * @hide \r
 959      */\r
 960     <div id="cfg-Ext.grid.GridPanel-bufferResize"></div>/** \r
 961      * @cfg {Boolean/Number} bufferResize \r
 962      * @hide \r
 963      */\r
 964     <div id="cfg-Ext.grid.GridPanel-defaultType"></div>/** \r
 965      * @cfg {String} defaultType \r
 966      * @hide \r
 967      */\r
 968     <div id="cfg-Ext.grid.GridPanel-defaults"></div>/** \r
 969      * @cfg {Object} defaults \r
 970      * @hide \r
 971      */\r
 972     <div id="cfg-Ext.grid.GridPanel-hideBorders"></div>/** \r
 973      * @cfg {Boolean} hideBorders \r
 974      * @hide \r
 975      */\r
 976     <div id="cfg-Ext.grid.GridPanel-items"></div>/** \r
 977      * @cfg {Mixed} items \r
 978      * @hide \r
 979      */\r
 980     <div id="cfg-Ext.grid.GridPanel-layout"></div>/** \r
 981      * @cfg {String} layout \r
 982      * @hide \r
 983      */\r
 984     <div id="cfg-Ext.grid.GridPanel-layoutConfig"></div>/** \r
 985      * @cfg {Object} layoutConfig \r
 986      * @hide \r
 987      */\r
 988     <div id="cfg-Ext.grid.GridPanel-monitorResize"></div>/** \r
 989      * @cfg {Boolean} monitorResize \r
 990      * @hide \r
 991      */\r
 992     <div id="prop-Ext.grid.GridPanel-items"></div>/** \r
 993      * @property items \r
 994      * @hide \r
 995      */\r
 996     <div id="method-Ext.grid.GridPanel-add"></div>/** \r
 997      * @method add \r
 998      * @hide \r
 999      */\r
1000     <div id="method-Ext.grid.GridPanel-cascade"></div>/** \r
1001      * @method cascade \r
1002      * @hide \r
1003      */\r
1004     <div id="method-Ext.grid.GridPanel-doLayout"></div>/** \r
1005      * @method doLayout \r
1006      * @hide \r
1007      */\r
1008     <div id="method-Ext.grid.GridPanel-find"></div>/** \r
1009      * @method find \r
1010      * @hide \r
1011      */\r
1012     <div id="method-Ext.grid.GridPanel-findBy"></div>/** \r
1013      * @method findBy \r
1014      * @hide \r
1015      */\r
1016     <div id="method-Ext.grid.GridPanel-findById"></div>/** \r
1017      * @method findById \r
1018      * @hide \r
1019      */\r
1020     <div id="method-Ext.grid.GridPanel-findByType"></div>/** \r
1021      * @method findByType \r
1022      * @hide \r
1023      */\r
1024     <div id="method-Ext.grid.GridPanel-getComponent"></div>/** \r
1025      * @method getComponent \r
1026      * @hide \r
1027      */\r
1028     <div id="method-Ext.grid.GridPanel-getLayout"></div>/** \r
1029      * @method getLayout \r
1030      * @hide \r
1031      */\r
1032     <div id="method-Ext.grid.GridPanel-getUpdater"></div>/** \r
1033      * @method getUpdater \r
1034      * @hide \r
1035      */\r
1036     <div id="method-Ext.grid.GridPanel-insert"></div>/** \r
1037      * @method insert \r
1038      * @hide \r
1039      */\r
1040     <div id="method-Ext.grid.GridPanel-load"></div>/** \r
1041      * @method load \r
1042      * @hide \r
1043      */\r
1044     <div id="method-Ext.grid.GridPanel-remove"></div>/** \r
1045      * @method remove \r
1046      * @hide \r
1047      */\r
1048     <div id="event-Ext.grid.GridPanel-add"></div>/** \r
1049      * @event add \r
1050      * @hide \r
1051      */\r
1052     <div id="event-Ext.grid.GridPanel-afterlayout"></div>/** \r
1053      * @event afterlayout \r
1054      * @hide \r
1055      */\r
1056     <div id="event-Ext.grid.GridPanel-beforeadd"></div>/** \r
1057      * @event beforeadd \r
1058      * @hide \r
1059      */\r
1060     <div id="event-Ext.grid.GridPanel-beforeremove"></div>/** \r
1061      * @event beforeremove \r
1062      * @hide \r
1063      */\r
1064     <div id="event-Ext.grid.GridPanel-remove"></div>/** \r
1065      * @event remove \r
1066      * @hide \r
1067      */\r
1068 \r
1069 \r
1070 \r
1071     <div id="cfg-Ext.grid.GridPanel-allowDomMove"></div>/**\r
1072      * @cfg {String} allowDomMove  @hide\r
1073      */\r
1074     <div id="cfg-Ext.grid.GridPanel-autoEl"></div>/**\r
1075      * @cfg {String} autoEl @hide\r
1076      */\r
1077     <div id="cfg-Ext.grid.GridPanel-applyTo"></div>/**\r
1078      * @cfg {String} applyTo  @hide\r
1079      */\r
1080     <div id="cfg-Ext.grid.GridPanel-autoScroll"></div>/**\r
1081      * @cfg {String} autoScroll  @hide\r
1082      */\r
1083     <div id="cfg-Ext.grid.GridPanel-bodyBorder"></div>/**\r
1084      * @cfg {String} bodyBorder  @hide\r
1085      */\r
1086     <div id="cfg-Ext.grid.GridPanel-bodyStyle"></div>/**\r
1087      * @cfg {String} bodyStyle  @hide\r
1088      */\r
1089     <div id="cfg-Ext.grid.GridPanel-contentEl"></div>/**\r
1090      * @cfg {String} contentEl  @hide\r
1091      */\r
1092     <div id="cfg-Ext.grid.GridPanel-disabledClass"></div>/**\r
1093      * @cfg {String} disabledClass  @hide\r
1094      */\r
1095     <div id="cfg-Ext.grid.GridPanel-elements"></div>/**\r
1096      * @cfg {String} elements  @hide\r
1097      */\r
1098     <div id="cfg-Ext.grid.GridPanel-html"></div>/**\r
1099      * @cfg {String} html  @hide\r
1100      */\r
1101     <div id="cfg-Ext.grid.GridPanel-preventBodyReset"></div>/**\r
1102      * @cfg {Boolean} preventBodyReset\r
1103      * @hide\r
1104      */\r
1105     <div id="prop-Ext.grid.GridPanel-disabled"></div>/**\r
1106      * @property disabled\r
1107      * @hide\r
1108      */\r
1109     <div id="method-Ext.grid.GridPanel-applyToMarkup"></div>/**\r
1110      * @method applyToMarkup\r
1111      * @hide\r
1112      */\r
1113     <div id="method-Ext.grid.GridPanel-enable"></div>/**\r
1114      * @method enable\r
1115      * @hide\r
1116      */\r
1117     <div id="method-Ext.grid.GridPanel-disable"></div>/**\r
1118      * @method disable\r
1119      * @hide\r
1120      */\r
1121     <div id="method-Ext.grid.GridPanel-setDisabled"></div>/**\r
1122      * @method setDisabled\r
1123      * @hide\r
1124      */\r
1125 });\r
1126 Ext.reg('grid', Ext.grid.GridPanel);</pre>    \r
1127 </body>\r
1128 </html>