3 * Copyright(c) 2006-2010 Ext JS, LLC
5 * http://www.extjs.com/license
7 Ext.ns('Ext.ux.grid');
\r
10 * @class Ext.ux.grid.CheckColumn
\r
12 * GridPanel plugin to add a column with check boxes to a grid.
\r
13 * <p>Example usage:</p>
\r
15 // create the column
\r
16 var checkColumn = new Ext.grid.CheckColumn({
\r
18 dataIndex: 'indoor',
\r
23 // add the column to the column model
\r
24 var cm = new Ext.grid.ColumnModel([{
\r
32 var grid = new Ext.grid.EditorGridPanel({
\r
35 plugins: [checkColumn], // include plugin
\r
39 * In addition to storing a Boolean value within the record data, this
\r
40 * class toggles a css class between <tt>'x-grid3-check-col'</tt> and
\r
41 * <tt>'x-grid3-check-col-on'</tt> to alter the background image used for
\r
44 Ext.ux.grid.CheckColumn = function(config){
\r
45 Ext.apply(this, config);
\r
49 this.renderer = this.renderer.createDelegate(this);
\r
52 Ext.ux.grid.CheckColumn.prototype ={
\r
53 init : function(grid){
\r
55 this.grid.on('render', function(){
\r
56 var view = this.grid.getView();
\r
57 view.mainBody.on('mousedown', this.onMouseDown, this);
\r
61 onMouseDown : function(e, t){
\r
62 if(Ext.fly(t).hasClass(this.createId())){
\r
64 var index = this.grid.getView().findRowIndex(t);
\r
65 var record = this.grid.store.getAt(index);
\r
66 record.set(this.dataIndex, !record.data[this.dataIndex]);
\r
70 renderer : function(v, p, record){
\r
71 p.css += ' x-grid3-check-col-td';
\r
72 return String.format('<div class="x-grid3-check-col{0} {1}"> </div>', v ? '-on' : '', this.createId());
\r
75 createId : function(){
\r
76 return 'x-grid3-cc-' + this.id;
\r
81 Ext.preg('checkcolumn', Ext.ux.grid.CheckColumn);
\r
84 Ext.grid.CheckColumn = Ext.ux.grid.CheckColumn;