1 | /*! |
---|
2 | * Ext JS Library 3.0.0 |
---|
3 | * Copyright(c) 2006-2009 Ext JS, LLC |
---|
4 | * licensing@extjs.com |
---|
5 | * http://www.extjs.com/license |
---|
6 | */ |
---|
7 | Ext.ns('Ext.ux.grid'); |
---|
8 | |
---|
9 | /** |
---|
10 | * @class Ext.ux.grid.CheckColumn |
---|
11 | * @extends Object |
---|
12 | * GridPanel plugin to add a column with check boxes to a grid. |
---|
13 | * <p>Example usage:</p> |
---|
14 | * <pre><code> |
---|
15 | // create the column |
---|
16 | var checkColumn = new Ext.grid.CheckColumn({ |
---|
17 | header: 'Indoor?', |
---|
18 | dataIndex: 'indoor', |
---|
19 | id: 'check', |
---|
20 | width: 55 |
---|
21 | }); |
---|
22 | |
---|
23 | // add the column to the column model |
---|
24 | var cm = new Ext.grid.ColumnModel([{ |
---|
25 | header: 'Foo', |
---|
26 | ... |
---|
27 | }, |
---|
28 | checkColumn |
---|
29 | ]); |
---|
30 | |
---|
31 | // create the grid |
---|
32 | var grid = new Ext.grid.EditorGridPanel({ |
---|
33 | ... |
---|
34 | cm: cm, |
---|
35 | plugins: [checkColumn], // include plugin |
---|
36 | ... |
---|
37 | }); |
---|
38 | * </code></pre> |
---|
39 | * In addition to storing a Boolean value within the record data, this |
---|
40 | * class toggles a css class between <tt>'x-grid3-check-col'</tt> and |
---|
41 | * <tt>'x-grid3-check-col-on'</tt> to alter the background image used for |
---|
42 | * a column. |
---|
43 | */ |
---|
44 | Ext.ux.grid.CheckColumn = function(config){ |
---|
45 | Ext.apply(this, config); |
---|
46 | if(!this.id){ |
---|
47 | this.id = Ext.id(); |
---|
48 | } |
---|
49 | this.renderer = this.renderer.createDelegate(this); |
---|
50 | }; |
---|
51 | |
---|
52 | Ext.ux.grid.CheckColumn.prototype ={ |
---|
53 | init : function(grid){ |
---|
54 | this.grid = grid; |
---|
55 | this.grid.on('render', function(){ |
---|
56 | var view = this.grid.getView(); |
---|
57 | view.mainBody.on('mousedown', this.onMouseDown, this); |
---|
58 | }, this); |
---|
59 | }, |
---|
60 | |
---|
61 | onMouseDown : function(e, t){ |
---|
62 | if(t.className && t.className.indexOf('x-grid3-cc-'+this.id) != -1){ |
---|
63 | e.stopEvent(); |
---|
64 | var index = this.grid.getView().findRowIndex(t); |
---|
65 | var record = this.grid.store.getAt(index); |
---|
66 | record.set(this.dataIndex, !record.data[this.dataIndex]); |
---|
67 | } |
---|
68 | }, |
---|
69 | |
---|
70 | renderer : function(v, p, record){ |
---|
71 | p.css += ' x-grid3-check-col-td'; |
---|
72 | return '<div class="x-grid3-check-col'+(v?'-on':'')+' x-grid3-cc-'+this.id+'"> </div>'; |
---|
73 | } |
---|
74 | }; |
---|
75 | |
---|
76 | // register ptype |
---|
77 | Ext.preg('checkcolumn', Ext.ux.grid.CheckColumn); |
---|
78 | |
---|
79 | // backwards compat |
---|
80 | Ext.grid.CheckColumn = Ext.ux.grid.CheckColumn; |
---|