Upgrade to ExtJS 4.0.7 - Released 10/19/2011
[extjs.git] / docs / source / RowNumberer.html
1 <!DOCTYPE html>
2 <html>
3 <head>
4   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
5   <title>The source code</title>
6   <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
7   <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
8   <style type="text/css">
9     .highlight { display: block; background-color: #ddd; }
10   </style>
11   <script type="text/javascript">
12     function highlight() {
13       document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
14     }
15   </script>
16 </head>
17 <body onload="prettyPrint(); highlight();">
18   <pre class="prettyprint lang-js"><span id='Ext-grid-RowNumberer'>/**
19 </span> * This is a utility class that can be passed into a {@link Ext.grid.column.Column} as a column config that provides
20  * an automatic row numbering column.
21  * 
22  * Usage:
23  *
24  *     columns: [
25  *         {xtype: 'rownumberer'},
26  *         {text: &quot;Company&quot;, flex: 1, sortable: true, dataIndex: 'company'},
27  *         {text: &quot;Price&quot;, width: 120, sortable: true, renderer: Ext.util.Format.usMoney, dataIndex: 'price'},
28  *         {text: &quot;Change&quot;, width: 120, sortable: true, dataIndex: 'change'},
29  *         {text: &quot;% Change&quot;, width: 120, sortable: true, dataIndex: 'pctChange'},
30  *         {text: &quot;Last Updated&quot;, width: 120, sortable: true, renderer: Ext.util.Format.dateRenderer('m/d/Y'), dataIndex: 'lastChange'}
31  *     ]
32  *
33  */
34 Ext.define('Ext.grid.RowNumberer', {
35     extend: 'Ext.grid.column.Column',
36     alias: 'widget.rownumberer',
37
38 <span id='Ext-grid-RowNumberer-cfg-text'>    /**
39 </span>     * @cfg {String} text
40      * Any valid text or HTML fragment to display in the header cell for the row number column.
41      */
42     text: &quot;&amp;#160&quot;,
43
44 <span id='Ext-grid-RowNumberer-cfg-width'>    /**
45 </span>     * @cfg {Number} width
46      * The default width in pixels of the row number column.
47      */
48     width: 23,
49
50 <span id='Ext-grid-RowNumberer-cfg-sortable'>    /**
51 </span>     * @cfg {Boolean} sortable
52      * True if the row number column is sortable.
53      * @hide
54      */
55     sortable: false,
56
57     align: 'right',
58
59     constructor : function(config){
60         this.callParent(arguments);
61         if (this.rowspan) {
62             this.renderer = Ext.Function.bind(this.renderer, this);
63         }
64     },
65
66     // private
67     resizable: false,
68     hideable: false,
69     menuDisabled: true,
70     dataIndex: '',
71     cls: Ext.baseCSSPrefix + 'row-numberer',
72     rowspan: undefined,
73
74     // private
75     renderer: function(value, metaData, record, rowIdx, colIdx, store) {
76         if (this.rowspan){
77             metaData.cellAttr = 'rowspan=&quot;'+this.rowspan+'&quot;';
78         }
79
80         metaData.tdCls = Ext.baseCSSPrefix + 'grid-cell-special';
81         return store.indexOfTotal(record) + 1;
82     }
83 });
84 </pre>
85 </body>
86 </html>