ext2 gridPanel 选择框列

最新推荐文章于 2018-07-18 22:31:23 发布

qujianjiutian

最新推荐文章于 2018-07-18 22:31:23 发布

阅读量591

点赞数

CC 4.0 BY-SA版权

分类专栏： ext2 gridpanel 选择框文章标签： ext function class header div c

本文链接：https://blog.youkuaiyun.com/qujianjiutian/article/details/7709228

ext2 gridpanel 选择框专栏收录该内容

1 篇文章

订阅专栏

本文详细介绍了 Ext.grid.CheckColumn 组件的功能、实现原理及使用方法，帮助开发者在网格应用中实现复选框列的高效集成与操作。包括组件属性解析、事件响应与复选框状态管理等核心内容。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Ext.grid.CheckColumn = function(config){
    Ext.apply(this, config);
    if(!this.globalId){
        this.globalId = Ext.id();
    }
    this.renderer = this.renderer.createDelegate(this);
};

Ext.grid.CheckColumn.prototype ={
   header : '<div class="x-grid3-hd-checker1"> </div>',
   sortable : false,
   menuDisabled : true,
   fixed : true,
   dataIndex : "checkColumn",
   width:30,
    init : function(grid){
        this.grid = grid;
        this.grid.on('render', function(){
            var view = this.grid.getView();
            view.mainBody.on('mousedown', this.onMouseDown, this);
            Ext.fly(view.innerHd).on("mousedown", this.onHdMouseDown,this);
        }, this);
    },
    onMouseDown : function(e, t){
        if(t.className && t.className.indexOf('x-grid3-cc-'+this.globalId) != -1){
            e.stopEvent();
            var v=this.grid.getView();
            var rowIndex = v.findRowIndex(t);
            var columnIndex = v.findCellIndex(t);
            var record = this.grid.store.getAt(rowIndex);
            var value=false;
            if(typeof(record.data[this.dataIndex]) != 'boolean'){
               value=!(record.data[this.dataIndex]==2);
            }else{
               value=!record.data[this.dataIndex];
            }
            var ev = {
               grid : this.grid,
               record : record,
               field : this.dataIndex,
               originalValue : !value,
               value : value,
               row : rowIndex,
               column : columnIndex,
               cancel : false
           };
            if(this.grid.fireEvent('beforeedit',ev))
              record.set(this.dataIndex, value);
            else
               return ;
            this.grid.fireEvent('afteredit',ev);
        }
    },
    selectAll : function(g) {
       var d = this.grid.view;
       var c = d.getRows();
       for (var f = 0; f < c.length; f++) {
           var b = this.grid.store.getAt(f);
           b.data[this.dataIndex] = g;
           var a = d.getCell(f, this.id);
           var e = Ext.get(a).child("div.x-grid3-cc-" + this.globalId);
           e.dom.className = this.getClassName(g);
       }
   },
    onHdMouseDown : function(c, a) {
       if (a.className == "x-grid3-hd-checker1") {
           c.stopEvent();
           var b = Ext.fly(a.parentNode);
           var d = b.hasClass("x-grid3-hd-checker1-on");
           if (d) {
               b.removeClass("x-grid3-hd-checker1-on");
               this.selectAll(false)
           } else {
               b.addClass("x-grid3-hd-checker1-on");
               this.selectAll(true)
           }
       }
   },
    getClassName : function(a) {
       return "x-grid3-check-col" + (a ? "-on" : "") + " x-grid3-cc-"
               + this.globalId;
   },
    renderer : function(v, p, record){
       if(typeof(v) != 'boolean'){
           v=v==2;
       }
        p.css += ' x-grid3-check-col-td';
        return '<div class="'+this.getClassName(v)+'"> </div>';
    }
};
Ext.reg('checkcolumn', Ext.grid.CheckColumn);//2代表true，其它值代表false