代码之家  ›  专栏  ›  技术社区  ›  Surya Prakash Tumma

Ext.grid.column。选中复选框本身的单击事件,而不是整个单元格区域

  •  1
  • Surya Prakash Tumma  · 技术社区  · 8 年前

    是否有任何方法将检查列操作限制为仅复选框并限制为单元格区域。我从文档中复制的检查列的示例代码。

    var store = Ext.create('Ext.data.Store', {
        fields: ['name', 'email', 'phone', 'active'],
        data: [{
            name: 'Lisa',
            email: 'lisa@simpsons.com',
            phone: '555-111-1224',
            active: true
        }, {
            name: 'Bart',
            email: 'bart@simpsons.com',
            phone: '555-222-1234',
            active: true
        }, {
            name: 'Homer',
            email: 'homer@simpsons.com',
            phone: '555-222-1244',
            active: false
        }, {
            name: 'Marge',
            email: 'marge@simpsons.com',
            phone: '555-222-1254',
            active: true
        }]
     });
    
    Ext.create('Ext.grid.Panel', {
        title: 'Simpsons',
        height: 200,
        width: 400,
        renderTo: Ext.getBody(),
        store: store,
        columns: [{
            text: 'Name',
            dataIndex: 'name'
        }, {
            text: 'Email',
            dataIndex: 'email',
            flex: 1
        }, {
            text: 'Phone',
            dataIndex: 'phone'
        }, {
            xtype: 'checkcolumn',
            text: 'Active',
            dataIndex: 'active'
        }]
    });
    

    请在这方面帮助我。

    2 回复  |  直到 8 年前
        1
  •  2
  •   Guilherme Lopes    8 年前

    该解决方案将适用于从4.2.0到4.2.6的每个版本的ExtJS。

    Ext.define('CheckColumn', {
        override: 'Ext.grid.column.' + (!!Ext.grid.column.Check ? 'Check': 'CheckColumn'),
        processEvent: function(type, view, cell, recordIndex, cellIndex, e, record, row) {
            var me = this,
                key = type === 'keydown' && e.getKey(),
                mousedown = type == 'mousedown';
    
            if (mousedown && !Ext.fly(e.getTarget()).hasCls('x-grid-checkcolumn')) {
                return !me.stopSelection;
            }
    
            me.callParent([type, view, cell, recordIndex, cellIndex, e, record, row]);
        }
    });
    
        2
  •  1
  •   Surya Prakash Tumma    8 年前

    基于Guierme lopes的回答,我已经在beforecheckchange中应用了修复。

     beforecheckchange: function(me , rowIndex , checked , record , e , eOpts){
               if(!Ext.fly(e.getTarget()).hasCls('x-grid-checkcolumn')){
                  return false;
                }
                return true;
            }