Fix #5681 - fix bootstrap4 detection
[roojs1] / docs / src / Roo_grid_Grid.js.html
1 <html><head><title>Roo/grid/Grid.js</title><link rel="stylesheet" type="text/css" href="../../css/highlight-js.css"/></head><body class="highlightpage"><code class="jsdoc-pretty"><span class="jsdoc-comment">/*
2  * Based on:
3  * Ext JS Library 1.1.1
4  * Copyright(c) 2006-2007, Ext JS, LLC.
5  *
6  * Originally Released Under LGPL - original licence link has changed is not relivant.
7  *
8  * Fork - LGPL
9  * &lt;script type=&quot;text/javascript&quot;&gt;
10  */
11
12 /**
13  * @class Roo.grid.Grid
14  * @extends Roo.util.Observable
15  * This class represents the primary interface of a component based grid control.
16  * &lt;br&gt;&lt;br&gt;Usage:&lt;pre&gt;&lt;code&gt;
17  var grid = new Roo.grid.Grid(&quot;my-container-id&quot;, {
18      ds: myDataStore,
19      cm: myColModel,
20      selModel: mySelectionModel,
21      autoSizeColumns: true,
22      monitorWindowResize: false,
23      trackMouseOver: true
24  });
25  // set any options
26  grid.render();
27  * &lt;/code&gt;&lt;/pre&gt;
28  * &lt;b&gt;Common Problems:&lt;/b&gt;&lt;br/&gt;
29  * - Grid does not resize properly when going smaller: Setting overflow hidden on the container
30  * element will correct this&lt;br/&gt;
31  * - If you get el.style[camel]= NaNpx or -2px or something related, be certain you have given your container element
32  * dimensions. The grid adapts to your container's size, if your container has no size defined then the results
33  * are unpredictable.&lt;br/&gt;
34  * - Do not render the grid into an element with display:none. Try using visibility:hidden. Otherwise there is no way for the
35  * grid to calculate dimensions/offsets.&lt;br/&gt;
36   * @constructor
37  * @param {String/HTMLElement/Roo.Element} container The element into which this grid will be rendered -
38  * The container MUST have some type of size defined for the grid to fill. The container will be
39  * automatically set to position relative if it isn't already.
40  * @param {Object} config A config object that sets properties on this grid.
41  */
42 </span><span class="jsdoc-var">Roo.grid.Grid </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">container</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">){
43         </span><span class="jsdoc-comment">// initialize the container
44         </span><span class="jsdoc-var">this.container </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.get</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">container</span><span class="jsdoc-syntax">);
45         </span><span class="jsdoc-var">this.container.update</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">);
46         </span><span class="jsdoc-var">this.container.setStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;overflow&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-string">&quot;hidden&quot;</span><span class="jsdoc-syntax">);
47     </span><span class="jsdoc-var">this.container.addClass</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'x-grid-container'</span><span class="jsdoc-syntax">);
48
49     </span><span class="jsdoc-var">this.id </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.container.id</span><span class="jsdoc-syntax">;
50
51     </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">config</span><span class="jsdoc-syntax">);
52     </span><span class="jsdoc-comment">// check and correct shorthanded configs
53     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.ds</span><span class="jsdoc-syntax">){
54         </span><span class="jsdoc-var">this.dataSource </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.ds</span><span class="jsdoc-syntax">;
55         </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.ds</span><span class="jsdoc-syntax">;
56     }
57     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.cm</span><span class="jsdoc-syntax">){
58         </span><span class="jsdoc-var">this.colModel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.cm</span><span class="jsdoc-syntax">;
59         </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.cm</span><span class="jsdoc-syntax">;
60     }
61     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.sm</span><span class="jsdoc-syntax">){
62         </span><span class="jsdoc-var">this.selModel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.sm</span><span class="jsdoc-syntax">;
63         </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.sm</span><span class="jsdoc-syntax">;
64     }
65
66     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selModel</span><span class="jsdoc-syntax">) {
67         </span><span class="jsdoc-var">this.selModel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selModel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.grid</span><span class="jsdoc-syntax">);
68         </span><span class="jsdoc-var">this.sm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selModel</span><span class="jsdoc-syntax">;
69         </span><span class="jsdoc-var">this.sm.xmodule </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.xmodule </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
70     }
71     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.colModel.config</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
72         </span><span class="jsdoc-var">this.colModel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.grid.ColumnModel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.colModel</span><span class="jsdoc-syntax">);
73         </span><span class="jsdoc-var">this.cm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.colModel</span><span class="jsdoc-syntax">;
74         </span><span class="jsdoc-var">this.cm.xmodule </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.xmodule </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
75     }
76     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dataSource</span><span class="jsdoc-syntax">) {
77         </span><span class="jsdoc-var">this.dataSource</span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dataSource</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.data</span><span class="jsdoc-syntax">);
78         </span><span class="jsdoc-var">this.ds </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dataSource</span><span class="jsdoc-syntax">;
79         </span><span class="jsdoc-var">this.ds.xmodule </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.xmodule </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
80
81     }
82
83
84
85     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.width</span><span class="jsdoc-syntax">){
86         </span><span class="jsdoc-var">this.container.setWidth</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.width</span><span class="jsdoc-syntax">);
87     }
88
89     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.height</span><span class="jsdoc-syntax">){
90         </span><span class="jsdoc-var">this.container.setHeight</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.height</span><span class="jsdoc-syntax">);
91     }
92     </span><span class="jsdoc-comment">/** @private */
93         </span><span class="jsdoc-var">this.addEvents</span><span class="jsdoc-syntax">({
94         </span><span class="jsdoc-comment">// raw events
95         /**
96          * @event click
97          * The raw click event for the entire grid.
98          * @param {Roo.EventObject} e
99          */
100         </span><span class="jsdoc-string">&quot;click&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
101         </span><span class="jsdoc-comment">/**
102          * @event dblclick
103          * The raw dblclick event for the entire grid.
104          * @param {Roo.EventObject} e
105          */
106         </span><span class="jsdoc-string">&quot;dblclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
107         </span><span class="jsdoc-comment">/**
108          * @event contextmenu
109          * The raw contextmenu event for the entire grid.
110          * @param {Roo.EventObject} e
111          */
112         </span><span class="jsdoc-string">&quot;contextmenu&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
113         </span><span class="jsdoc-comment">/**
114          * @event mousedown
115          * The raw mousedown event for the entire grid.
116          * @param {Roo.EventObject} e
117          */
118         </span><span class="jsdoc-string">&quot;mousedown&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
119         </span><span class="jsdoc-comment">/**
120          * @event mouseup
121          * The raw mouseup event for the entire grid.
122          * @param {Roo.EventObject} e
123          */
124         </span><span class="jsdoc-string">&quot;mouseup&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
125         </span><span class="jsdoc-comment">/**
126          * @event mouseover
127          * The raw mouseover event for the entire grid.
128          * @param {Roo.EventObject} e
129          */
130         </span><span class="jsdoc-string">&quot;mouseover&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
131         </span><span class="jsdoc-comment">/**
132          * @event mouseout
133          * The raw mouseout event for the entire grid.
134          * @param {Roo.EventObject} e
135          */
136         </span><span class="jsdoc-string">&quot;mouseout&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
137         </span><span class="jsdoc-comment">/**
138          * @event keypress
139          * The raw keypress event for the entire grid.
140          * @param {Roo.EventObject} e
141          */
142         </span><span class="jsdoc-string">&quot;keypress&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
143         </span><span class="jsdoc-comment">/**
144          * @event keydown
145          * The raw keydown event for the entire grid.
146          * @param {Roo.EventObject} e
147          */
148         </span><span class="jsdoc-string">&quot;keydown&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
149
150         </span><span class="jsdoc-comment">// custom events
151
152         /**
153          * @event cellclick
154          * Fires when a cell is clicked
155          * @param {Grid} this
156          * @param {Number} rowIndex
157          * @param {Number} columnIndex
158          * @param {Roo.EventObject} e
159          */
160         </span><span class="jsdoc-string">&quot;cellclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
161         </span><span class="jsdoc-comment">/**
162          * @event celldblclick
163          * Fires when a cell is double clicked
164          * @param {Grid} this
165          * @param {Number} rowIndex
166          * @param {Number} columnIndex
167          * @param {Roo.EventObject} e
168          */
169         </span><span class="jsdoc-string">&quot;celldblclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
170         </span><span class="jsdoc-comment">/**
171          * @event rowclick
172          * Fires when a row is clicked
173          * @param {Grid} this
174          * @param {Number} rowIndex
175          * @param {Roo.EventObject} e
176          */
177         </span><span class="jsdoc-string">&quot;rowclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
178         </span><span class="jsdoc-comment">/**
179          * @event rowdblclick
180          * Fires when a row is double clicked
181          * @param {Grid} this
182          * @param {Number} rowIndex
183          * @param {Roo.EventObject} e
184          */
185         </span><span class="jsdoc-string">&quot;rowdblclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
186         </span><span class="jsdoc-comment">/**
187          * @event headerclick
188          * Fires when a header is clicked
189          * @param {Grid} this
190          * @param {Number} columnIndex
191          * @param {Roo.EventObject} e
192          */
193         </span><span class="jsdoc-string">&quot;headerclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
194         </span><span class="jsdoc-comment">/**
195          * @event headerdblclick
196          * Fires when a header cell is double clicked
197          * @param {Grid} this
198          * @param {Number} columnIndex
199          * @param {Roo.EventObject} e
200          */
201         </span><span class="jsdoc-string">&quot;headerdblclick&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
202         </span><span class="jsdoc-comment">/**
203          * @event rowcontextmenu
204          * Fires when a row is right clicked
205          * @param {Grid} this
206          * @param {Number} rowIndex
207          * @param {Roo.EventObject} e
208          */
209         </span><span class="jsdoc-string">&quot;rowcontextmenu&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
210         </span><span class="jsdoc-comment">/**
211          * @event cellcontextmenu
212          * Fires when a cell is right clicked
213          * @param {Grid} this
214          * @param {Number} rowIndex
215          * @param {Number} cellIndex
216          * @param {Roo.EventObject} e
217          */
218          </span><span class="jsdoc-string">&quot;cellcontextmenu&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
219         </span><span class="jsdoc-comment">/**
220          * @event headercontextmenu
221          * Fires when a header is right clicked
222          * @param {Grid} this
223          * @param {Number} columnIndex
224          * @param {Roo.EventObject} e
225          */
226         </span><span class="jsdoc-string">&quot;headercontextmenu&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
227         </span><span class="jsdoc-comment">/**
228          * @event bodyscroll
229          * Fires when the body element is scrolled
230          * @param {Number} scrollLeft
231          * @param {Number} scrollTop
232          */
233         </span><span class="jsdoc-string">&quot;bodyscroll&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
234         </span><span class="jsdoc-comment">/**
235          * @event columnresize
236          * Fires when the user resizes a column
237          * @param {Number} columnIndex
238          * @param {Number} newSize
239          */
240         </span><span class="jsdoc-string">&quot;columnresize&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
241         </span><span class="jsdoc-comment">/**
242          * @event columnmove
243          * Fires when the user moves a column
244          * @param {Number} oldIndex
245          * @param {Number} newIndex
246          */
247         </span><span class="jsdoc-string">&quot;columnmove&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
248         </span><span class="jsdoc-comment">/**
249          * @event startdrag
250          * Fires when row(s) start being dragged
251          * @param {Grid} this
252          * @param {Roo.GridDD} dd The drag drop object
253          * @param {event} e The raw browser event
254          */
255         </span><span class="jsdoc-string">&quot;startdrag&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
256         </span><span class="jsdoc-comment">/**
257          * @event enddrag
258          * Fires when a drag operation is complete
259          * @param {Grid} this
260          * @param {Roo.GridDD} dd The drag drop object
261          * @param {event} e The raw browser event
262          */
263         </span><span class="jsdoc-string">&quot;enddrag&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
264         </span><span class="jsdoc-comment">/**
265          * @event dragdrop
266          * Fires when dragged row(s) are dropped on a valid DD target
267          * @param {Grid} this
268          * @param {Roo.GridDD} dd The drag drop object
269          * @param {String} targetId The target drag drop object
270          * @param {event} e The raw browser event
271          */
272         </span><span class="jsdoc-string">&quot;dragdrop&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
273         </span><span class="jsdoc-comment">/**
274          * @event dragover
275          * Fires while row(s) are being dragged. &quot;targetId&quot; is the id of the Yahoo.util.DD object the selected rows are being dragged over.
276          * @param {Grid} this
277          * @param {Roo.GridDD} dd The drag drop object
278          * @param {String} targetId The target drag drop object
279          * @param {event} e The raw browser event
280          */
281         </span><span class="jsdoc-string">&quot;dragover&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
282         </span><span class="jsdoc-comment">/**
283          * @event dragenter
284          *  Fires when the dragged row(s) first cross another DD target while being dragged
285          * @param {Grid} this
286          * @param {Roo.GridDD} dd The drag drop object
287          * @param {String} targetId The target drag drop object
288          * @param {event} e The raw browser event
289          */
290         </span><span class="jsdoc-string">&quot;dragenter&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
291         </span><span class="jsdoc-comment">/**
292          * @event dragout
293          * Fires when the dragged row(s) leave another DD target while being dragged
294          * @param {Grid} this
295          * @param {Roo.GridDD} dd The drag drop object
296          * @param {String} targetId The target drag drop object
297          * @param {event} e The raw browser event
298          */
299         </span><span class="jsdoc-string">&quot;dragout&quot; </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
300         </span><span class="jsdoc-comment">/**
301          * @event rowclass
302          * Fires when a row is rendered, so you can change add a style to it.
303          * @param {GridView} gridview   The grid view
304          * @param {Object} rowcfg   contains record  rowIndex and rowClass - set rowClass to add a style.
305          */
306         </span><span class="jsdoc-string">'rowclass' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
307
308         </span><span class="jsdoc-comment">/**
309          * @event render
310          * Fires when the grid is rendered
311          * @param {Grid} grid
312          */
313         </span><span class="jsdoc-string">'render' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true
314     </span><span class="jsdoc-syntax">});
315
316     </span><span class="jsdoc-var">Roo.grid.Grid.superclass.constructor.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
317 };
318 </span><span class="jsdoc-var">Roo.extend</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.grid.Grid</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo.util.Observable</span><span class="jsdoc-syntax">, {
319
320     </span><span class="jsdoc-comment">/**
321      * @cfg {String} ddGroup - drag drop group.
322      */
323
324     /**
325      * @cfg {Number} minColumnWidth The minimum width a column can be resized to. Default is 25.
326      */
327     </span><span class="jsdoc-var">minColumnWidth </span><span class="jsdoc-syntax">: 25,
328
329     </span><span class="jsdoc-comment">/**
330      * @cfg {Boolean} autoSizeColumns True to automatically resize the columns to fit their content
331      * &lt;b&gt;on initial render.&lt;/b&gt; It is more efficient to explicitly size the columns
332      * through the ColumnModel's {@link Roo.grid.ColumnModel#width} config option.  Default is false.
333      */
334     </span><span class="jsdoc-var">autoSizeColumns </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
335
336     </span><span class="jsdoc-comment">/**
337      * @cfg {Boolean} autoSizeHeaders True to measure headers with column data when auto sizing columns. Default is true.
338      */
339     </span><span class="jsdoc-var">autoSizeHeaders </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
340
341     </span><span class="jsdoc-comment">/**
342      * @cfg {Boolean} monitorWindowResize True to autoSize the grid when the window resizes. Default is true.
343      */
344     </span><span class="jsdoc-var">monitorWindowResize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
345
346     </span><span class="jsdoc-comment">/**
347      * @cfg {Boolean} maxRowsToMeasure If autoSizeColumns is on, maxRowsToMeasure can be used to limit the number of
348      * rows measured to get a columns size. Default is 0 (all rows).
349      */
350     </span><span class="jsdoc-var">maxRowsToMeasure </span><span class="jsdoc-syntax">: 0,
351
352     </span><span class="jsdoc-comment">/**
353      * @cfg {Boolean} trackMouseOver True to highlight rows when the mouse is over. Default is true.
354      */
355     </span><span class="jsdoc-var">trackMouseOver </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
356
357     </span><span class="jsdoc-comment">/**
358     * @cfg {Boolean} enableDrag  True to enable drag of rows. Default is false. (double check if this is needed?)
359     */
360
361     /**
362     * @cfg {Boolean} enableDragDrop True to enable drag and drop of rows. Default is false.
363     */
364     </span><span class="jsdoc-var">enableDragDrop </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
365
366     </span><span class="jsdoc-comment">/**
367     * @cfg {Boolean} enableColumnMove True to enable drag and drop reorder of columns. Default is true.
368     */
369     </span><span class="jsdoc-var">enableColumnMove </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
370
371     </span><span class="jsdoc-comment">/**
372     * @cfg {Boolean} enableColumnHide True to enable hiding of columns with the header context menu. Default is true.
373     */
374     </span><span class="jsdoc-var">enableColumnHide </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
375
376     </span><span class="jsdoc-comment">/**
377     * @cfg {Boolean} enableRowHeightSync True to manually sync row heights across locked and not locked rows. Default is false.
378     */
379     </span><span class="jsdoc-var">enableRowHeightSync </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
380
381     </span><span class="jsdoc-comment">/**
382     * @cfg {Boolean} stripeRows True to stripe the rows.  Default is true.
383     */
384     </span><span class="jsdoc-var">stripeRows </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">,
385
386     </span><span class="jsdoc-comment">/**
387     * @cfg {Boolean} autoHeight True to fit the height of the grid container to the height of the data. Default is false.
388     */
389     </span><span class="jsdoc-var">autoHeight </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
390
391     </span><span class="jsdoc-comment">/**
392      * @cfg {String} autoExpandColumn The id (or dataIndex) of a column in this grid that should expand to fill unused space. This id can not be 0. Default is false.
393      */
394     </span><span class="jsdoc-var">autoExpandColumn </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
395
396     </span><span class="jsdoc-comment">/**
397     * @cfg {Number} autoExpandMin The minimum width the autoExpandColumn can have (if enabled).
398     * Default is 50.
399     */
400     </span><span class="jsdoc-var">autoExpandMin </span><span class="jsdoc-syntax">: 50,
401
402     </span><span class="jsdoc-comment">/**
403     * @cfg {Number} autoExpandMax The maximum width the autoExpandColumn can have (if enabled). Default is 1000.
404     */
405     </span><span class="jsdoc-var">autoExpandMax </span><span class="jsdoc-syntax">: 1000,
406
407     </span><span class="jsdoc-comment">/**
408     * @cfg {Object} view The {@link Roo.grid.GridView} used by the grid. This can be set before a call to render().
409     */
410     </span><span class="jsdoc-var">view </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">null</span><span class="jsdoc-syntax">,
411
412     </span><span class="jsdoc-comment">/**
413     * @cfg {Object} loadMask An {@link Roo.LoadMask} config or true to mask the grid while loading. Default is false.
414     */
415     </span><span class="jsdoc-var">loadMask </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
416     </span><span class="jsdoc-comment">/**
417     * @cfg {Roo.dd.DropTarget} dropTarget An {@link Roo.dd.DropTarget} config
418     */
419     </span><span class="jsdoc-var">dropTarget</span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
420
421
422
423     </span><span class="jsdoc-comment">// private
424     </span><span class="jsdoc-var">rendered </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">,
425
426     </span><span class="jsdoc-comment">/**
427     * @cfg {Boolean} autoWidth True to set the grid's width to the default total width of the grid's columns instead
428     * of a fixed width. Default is false.
429     */
430     /**
431     * @cfg {Number} maxHeight Sets the maximum height of the grid - ignored if autoHeight is not on.
432     */
433     /**
434      * Called once after all setup has been completed and the grid is ready to be rendered.
435      * @return {Roo.grid.Grid} this
436      */
437     </span><span class="jsdoc-var">render </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">()
438     {
439         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.container</span><span class="jsdoc-syntax">;
440         </span><span class="jsdoc-comment">// try to detect autoHeight/width mode
441         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">((!</span><span class="jsdoc-var">c.dom.offsetHeight </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">c.dom.offsetHeight </span><span class="jsdoc-syntax">&lt; 20) || </span><span class="jsdoc-var">c.getStyle</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;height&quot;</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-string">&quot;auto&quot;</span><span class="jsdoc-syntax">){
442             </span><span class="jsdoc-var">this.autoHeight </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
443         }
444         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">view </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getView</span><span class="jsdoc-syntax">();
445         </span><span class="jsdoc-var">view.init</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
446
447         </span><span class="jsdoc-var">c.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
448         </span><span class="jsdoc-var">c.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;dblclick&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onDblClick</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
449         </span><span class="jsdoc-var">c.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;contextmenu&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onContextMenu</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
450         </span><span class="jsdoc-var">c.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;keydown&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onKeyDown</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
451         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">Roo.isTouch</span><span class="jsdoc-syntax">) {
452             </span><span class="jsdoc-var">c.on</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;touchstart&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.onTouchStart</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
453         }
454
455         </span><span class="jsdoc-var">this.relayEvents</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">c</span><span class="jsdoc-syntax">, [</span><span class="jsdoc-string">&quot;mousedown&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;mouseup&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;mouseover&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;mouseout&quot;</span><span class="jsdoc-syntax">,</span><span class="jsdoc-string">&quot;keypress&quot;</span><span class="jsdoc-syntax">]);
456
457         </span><span class="jsdoc-var">this.getSelectionModel</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.init</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
458
459         </span><span class="jsdoc-var">view.render</span><span class="jsdoc-syntax">();
460
461         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.loadMask</span><span class="jsdoc-syntax">){
462             </span><span class="jsdoc-var">this.loadMask </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.LoadMask</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.container</span><span class="jsdoc-syntax">,
463                     </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">store</span><span class="jsdoc-syntax">:</span><span class="jsdoc-var">this.dataSource</span><span class="jsdoc-syntax">}, </span><span class="jsdoc-var">this.loadMask</span><span class="jsdoc-syntax">));
464         }
465
466
467         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.toolbar </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.toolbar.xtype</span><span class="jsdoc-syntax">) {
468             </span><span class="jsdoc-var">this.toolbar.container </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getView</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getHeaderPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
469             </span><span class="jsdoc-var">this.toolbar </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.Toolbar</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.toolbar</span><span class="jsdoc-syntax">);
470         }
471         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.footer </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.footer.xtype</span><span class="jsdoc-syntax">) {
472             </span><span class="jsdoc-var">this.footer.dataSource </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getDataSource</span><span class="jsdoc-syntax">();
473             </span><span class="jsdoc-var">this.footer.container </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.getView</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.getFooterPanel</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
474             </span><span class="jsdoc-var">this.footer </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">Roo.factory</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.footer</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">Roo</span><span class="jsdoc-syntax">);
475         }
476         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.dropTarget </span><span class="jsdoc-syntax">&amp;&amp; </span><span class="jsdoc-var">this.dropTarget.xtype</span><span class="jsdoc-syntax">) {
477             </span><span class="jsdoc-keyword">delete </span><span class="jsdoc-var">this.dropTarget.xtype</span><span class="jsdoc-syntax">;
478             </span><span class="jsdoc-var">this.dropTarget </span><span class="jsdoc-syntax">=  </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.dd.DropTarget</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.getView</span><span class="jsdoc-syntax">()</span><span class="jsdoc-var">.mainBody</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this.dropTarget</span><span class="jsdoc-syntax">);
479         }
480
481
482         </span><span class="jsdoc-var">this.rendered </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
483         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">'render'</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">);
484         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">;
485     },
486
487         </span><span class="jsdoc-comment">/**
488          * Reconfigures the grid to use a different Store and Column Model.
489          * The View will be bound to the new objects and refreshed.
490          * @param {Roo.data.Store} dataSource The new {@link Roo.data.Store} object
491          * @param {Roo.grid.ColumnModel} The new {@link Roo.grid.ColumnModel} object
492          */
493     </span><span class="jsdoc-var">reconfigure </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataSource</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">colModel</span><span class="jsdoc-syntax">){
494         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.loadMask</span><span class="jsdoc-syntax">){
495             </span><span class="jsdoc-var">this.loadMask.destroy</span><span class="jsdoc-syntax">();
496             </span><span class="jsdoc-var">this.loadMask </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.LoadMask</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.container</span><span class="jsdoc-syntax">,
497                     </span><span class="jsdoc-var">Roo.apply</span><span class="jsdoc-syntax">({</span><span class="jsdoc-var">store</span><span class="jsdoc-syntax">:</span><span class="jsdoc-var">dataSource</span><span class="jsdoc-syntax">}, </span><span class="jsdoc-var">this.loadMask</span><span class="jsdoc-syntax">));
498         }
499         </span><span class="jsdoc-var">this.view.bind</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">dataSource</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">colModel</span><span class="jsdoc-syntax">);
500         </span><span class="jsdoc-var">this.dataSource </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">dataSource</span><span class="jsdoc-syntax">;
501         </span><span class="jsdoc-var">this.colModel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">colModel</span><span class="jsdoc-syntax">;
502         </span><span class="jsdoc-var">this.view.refresh</span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">);
503     },
504
505     </span><span class="jsdoc-comment">// private
506     </span><span class="jsdoc-var">onKeyDown </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
507         </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;keydown&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
508     },
509
510     </span><span class="jsdoc-comment">/**
511      * Destroy this grid.
512      * @param {Boolean} removeEl True to remove the element
513      */
514     </span><span class="jsdoc-var">destroy </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">removeEl</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">keepListeners</span><span class="jsdoc-syntax">){
515         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.loadMask</span><span class="jsdoc-syntax">){
516             </span><span class="jsdoc-var">this.loadMask.destroy</span><span class="jsdoc-syntax">();
517         }
518         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">c </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.container</span><span class="jsdoc-syntax">;
519         </span><span class="jsdoc-var">c.removeAllListeners</span><span class="jsdoc-syntax">();
520         </span><span class="jsdoc-var">this.view.destroy</span><span class="jsdoc-syntax">();
521         </span><span class="jsdoc-var">this.colModel.purgeListeners</span><span class="jsdoc-syntax">();
522         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">keepListeners</span><span class="jsdoc-syntax">){
523             </span><span class="jsdoc-var">this.purgeListeners</span><span class="jsdoc-syntax">();
524         }
525         </span><span class="jsdoc-var">c.update</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;&quot;</span><span class="jsdoc-syntax">);
526         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">removeEl </span><span class="jsdoc-syntax">=== </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
527             </span><span class="jsdoc-var">c.remove</span><span class="jsdoc-syntax">();
528         }
529     },
530
531     </span><span class="jsdoc-comment">// private
532     </span><span class="jsdoc-var">processEvent </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
533         </span><span class="jsdoc-comment">// does this fire select???
534         //Roo.log('grid:processEvent '  + name);
535
536         </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">!= </span><span class="jsdoc-string">'touchstart' </span><span class="jsdoc-syntax">) {
537             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
538         }
539
540         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">t </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">e.getTarget</span><span class="jsdoc-syntax">();
541         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">v </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.view</span><span class="jsdoc-syntax">;
542         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">header </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v.findHeaderIndex</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">);
543         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">header </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
544             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ename </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'touchstart' </span><span class="jsdoc-syntax">? </span><span class="jsdoc-string">'click' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">;
545
546             </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;header&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">ename</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">header</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
547         }</span><span class="jsdoc-keyword">else</span><span class="jsdoc-syntax">{
548             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">row </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v.findRowIndex</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">);
549             </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cell </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">v.findCellIndex</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">);
550             </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">== </span><span class="jsdoc-string">'touchstart'</span><span class="jsdoc-syntax">) {
551                 </span><span class="jsdoc-comment">// first touch is always a click.
552                 // hopefull this happens after selection is updated.?
553                 </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
554
555                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selModel.getSelectedCell</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
556                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selModel.getSelectedCell</span><span class="jsdoc-syntax">();
557                     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">row </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">[0] &amp;&amp; </span><span class="jsdoc-var">cell </span><span class="jsdoc-syntax">== </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">[1]){
558                         </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'dblclick'</span><span class="jsdoc-syntax">;
559                     }
560                 }
561                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-keyword">typeof</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.selModel.getSelections</span><span class="jsdoc-syntax">) != </span><span class="jsdoc-string">'undefined'</span><span class="jsdoc-syntax">) {
562                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cs </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selModel.getSelections</span><span class="jsdoc-syntax">();
563                     </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ds </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dataSource</span><span class="jsdoc-syntax">;
564                     </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cs.length </span><span class="jsdoc-syntax">== 1 &amp;&amp; </span><span class="jsdoc-var">ds.getAt</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">) == </span><span class="jsdoc-var">cs</span><span class="jsdoc-syntax">[0]){
565                         </span><span class="jsdoc-var">name </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">'dblclick'</span><span class="jsdoc-syntax">;
566                     }
567                 }
568                 </span><span class="jsdoc-keyword">if </span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">) {
569                     </span><span class="jsdoc-keyword">return</span><span class="jsdoc-syntax">;
570                 }
571             }
572
573
574             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">row </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
575                 </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;row&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
576                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">cell </span><span class="jsdoc-syntax">!== </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">){
577                     </span><span class="jsdoc-var">this.fireEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;cell&quot; </span><span class="jsdoc-syntax">+ </span><span class="jsdoc-var">name</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cell</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
578                 }
579             }
580         }
581     },
582
583     </span><span class="jsdoc-comment">// private
584     </span><span class="jsdoc-var">onClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
585         </span><span class="jsdoc-var">this.processEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;click&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
586     },
587    </span><span class="jsdoc-comment">// private
588     </span><span class="jsdoc-var">onTouchStart </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
589         </span><span class="jsdoc-var">this.processEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;touchstart&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
590     },
591
592     </span><span class="jsdoc-comment">// private
593     </span><span class="jsdoc-var">onContextMenu </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">t</span><span class="jsdoc-syntax">){
594         </span><span class="jsdoc-var">this.processEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;contextmenu&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
595     },
596
597     </span><span class="jsdoc-comment">// private
598     </span><span class="jsdoc-var">onDblClick </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">){
599         </span><span class="jsdoc-var">this.processEvent</span><span class="jsdoc-syntax">(</span><span class="jsdoc-string">&quot;dblclick&quot;</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">e</span><span class="jsdoc-syntax">);
600     },
601
602     </span><span class="jsdoc-comment">// private
603     </span><span class="jsdoc-var">walkCells </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">step</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">fn</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">scope</span><span class="jsdoc-syntax">){
604         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">cm </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.colModel</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">clen </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">cm.getColumnCount</span><span class="jsdoc-syntax">();
605         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">ds </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.dataSource</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">rlen </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">ds.getCount</span><span class="jsdoc-syntax">(), </span><span class="jsdoc-var">first </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">;
606         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">step </span><span class="jsdoc-syntax">&lt; 0){
607             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">&lt; 0){
608                 </span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">--;
609                 </span><span class="jsdoc-var">first </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
610             }
611             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">row </span><span class="jsdoc-syntax">&gt;= 0){
612                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">first</span><span class="jsdoc-syntax">){
613                     </span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">clen</span><span class="jsdoc-syntax">-1;
614                 }
615                 </span><span class="jsdoc-var">first </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
616                 </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">&gt;= 0){
617                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fn.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">scope </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cm</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
618                         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">];
619                     }
620                     </span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">--;
621                 }
622                 </span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">--;
623             }
624         } </span><span class="jsdoc-keyword">else </span><span class="jsdoc-syntax">{
625             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">&gt;= </span><span class="jsdoc-var">clen</span><span class="jsdoc-syntax">){
626                 </span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">++;
627                 </span><span class="jsdoc-var">first </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
628             }
629             </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">row </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">rlen</span><span class="jsdoc-syntax">){
630                 </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">first</span><span class="jsdoc-syntax">){
631                     </span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">= 0;
632                 }
633                 </span><span class="jsdoc-var">first </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">false</span><span class="jsdoc-syntax">;
634                 </span><span class="jsdoc-keyword">while</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">col </span><span class="jsdoc-syntax">&lt; </span><span class="jsdoc-var">clen</span><span class="jsdoc-syntax">){
635                     </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">fn.call</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">scope </span><span class="jsdoc-syntax">|| </span><span class="jsdoc-var">this</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">cm</span><span class="jsdoc-syntax">) === </span><span class="jsdoc-keyword">true</span><span class="jsdoc-syntax">){
636                         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-syntax">[</span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">];
637                     }
638                     </span><span class="jsdoc-var">col</span><span class="jsdoc-syntax">++;
639                 }
640                 </span><span class="jsdoc-var">row</span><span class="jsdoc-syntax">++;
641             }
642         }
643         </span><span class="jsdoc-keyword">return null</span><span class="jsdoc-syntax">;
644     },
645
646     </span><span class="jsdoc-comment">// private
647     </span><span class="jsdoc-var">getSelections </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
648         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.selModel.getSelections</span><span class="jsdoc-syntax">();
649     },
650
651     </span><span class="jsdoc-comment">/**
652      * Causes the grid to manually recalculate its dimensions. Generally this is done automatically,
653      * but if manual update is required this method will initiate it.
654      */
655     </span><span class="jsdoc-var">autoSize </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
656         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.rendered</span><span class="jsdoc-syntax">){
657             </span><span class="jsdoc-var">this.view.layout</span><span class="jsdoc-syntax">();
658             </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.view.adjustForScroll</span><span class="jsdoc-syntax">){
659                 </span><span class="jsdoc-var">this.view.adjustForScroll</span><span class="jsdoc-syntax">();
660             }
661         }
662     },
663
664     </span><span class="jsdoc-comment">/**
665      * Returns the grid's underlying element.
666      * @return {Element} The element
667      */
668     </span><span class="jsdoc-var">getGridEl </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
669         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.container</span><span class="jsdoc-syntax">;
670     },
671
672     </span><span class="jsdoc-comment">// private for compatibility, overridden by editor grid
673     </span><span class="jsdoc-var">stopEditing </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){},
674
675     </span><span class="jsdoc-comment">/**
676      * Returns the grid's SelectionModel.
677      * @return {SelectionModel}
678      */
679     </span><span class="jsdoc-var">getSelectionModel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
680         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.selModel</span><span class="jsdoc-syntax">){
681             </span><span class="jsdoc-var">this.selModel </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.grid.RowSelectionModel</span><span class="jsdoc-syntax">();
682         }
683         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.selModel</span><span class="jsdoc-syntax">;
684     },
685
686     </span><span class="jsdoc-comment">/**
687      * Returns the grid's DataSource.
688      * @return {DataSource}
689      */
690     </span><span class="jsdoc-var">getDataSource </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
691         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.dataSource</span><span class="jsdoc-syntax">;
692     },
693
694     </span><span class="jsdoc-comment">/**
695      * Returns the grid's ColumnModel.
696      * @return {ColumnModel}
697      */
698     </span><span class="jsdoc-var">getColumnModel </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
699         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.colModel</span><span class="jsdoc-syntax">;
700     },
701
702     </span><span class="jsdoc-comment">/**
703      * Returns the grid's GridView object.
704      * @return {GridView}
705      */
706     </span><span class="jsdoc-var">getView </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
707         </span><span class="jsdoc-keyword">if</span><span class="jsdoc-syntax">(!</span><span class="jsdoc-var">this.view</span><span class="jsdoc-syntax">){
708             </span><span class="jsdoc-var">this.view </span><span class="jsdoc-syntax">= </span><span class="jsdoc-keyword">new </span><span class="jsdoc-var">Roo.grid.GridView</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.viewConfig</span><span class="jsdoc-syntax">);
709         }
710         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">this.view</span><span class="jsdoc-syntax">;
711     },
712     </span><span class="jsdoc-comment">/**
713      * Called to get grid's drag proxy text, by default returns this.ddText.
714      * @return {String}
715      */
716     </span><span class="jsdoc-var">getDragDropText </span><span class="jsdoc-syntax">: </span><span class="jsdoc-keyword">function</span><span class="jsdoc-syntax">(){
717         </span><span class="jsdoc-keyword">var </span><span class="jsdoc-var">count </span><span class="jsdoc-syntax">= </span><span class="jsdoc-var">this.selModel.getCount</span><span class="jsdoc-syntax">();
718         </span><span class="jsdoc-keyword">return </span><span class="jsdoc-var">String.format</span><span class="jsdoc-syntax">(</span><span class="jsdoc-var">this.ddText</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">count</span><span class="jsdoc-syntax">, </span><span class="jsdoc-var">count </span><span class="jsdoc-syntax">== 1 ? </span><span class="jsdoc-string">'' </span><span class="jsdoc-syntax">: </span><span class="jsdoc-string">'s'</span><span class="jsdoc-syntax">);
719     }
720 });
721 </span><span class="jsdoc-comment">/**
722  * Configures the text is the drag proxy (defaults to &quot;%0 selected row(s)&quot;).
723  * %0 is replaced with the number of selected rows.
724  * @type String
725  */
726 </span><span class="jsdoc-var">Roo.grid.Grid.prototype.ddText </span><span class="jsdoc-syntax">= </span><span class="jsdoc-string">&quot;{0} selected row{1}&quot;</span><span class="jsdoc-syntax">;</span></code></body></html>