CheckColumn.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:2k
源码类别:

中间件编程

开发平台:

JavaScript

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