3 * Copyright(c) 2006-2010 Ext JS, Inc.
5 * http://www.extjs.com/license
10 * @class Ext.ux.grid.CheckColumn
12 * GridPanel plugin to add a column with check boxes to a grid.
13 * <p>Example usage:</p>
16 var checkColumn = new Ext.grid.CheckColumn({
23 // add the column to the column model
24 var cm = new Ext.grid.ColumnModel([{
32 var grid = new Ext.grid.EditorGridPanel({
35 plugins: [checkColumn], // include plugin
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
44 Ext.ux.grid.CheckColumn = function(config){
45 Ext.apply(this, config);
49 this.renderer = this.renderer.createDelegate(this);
52 Ext.ux.grid.CheckColumn.prototype ={
53 init : function(grid){
55 this.grid.on('render', function(){
56 var view = this.grid.getView();
57 view.mainBody.on('mousedown', this.onMouseDown, this);
61 onMouseDown : function(e, t){
62 if(Ext.fly(t).hasClass(this.createId())){
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]);
70 renderer : function(v, p, record){
71 p.css += ' x-grid3-check-col-td';
72 return String.format('<div class="x-grid3-check-col{0} {1}"> </div>', v ? '-on' : '', this.createId());
75 createId : function(){
76 return 'x-grid3-cc-' + this.id;
81 Ext.preg('checkcolumn', Ext.ux.grid.CheckColumn);
84 Ext.grid.CheckColumn = Ext.ux.grid.CheckColumn;