如何通过单击网格ExtJS 6中的一个单元格来选择记录

我有一个网格，我想通过单击一个特定的单元格来选择整个记录。问题是我不能使用checkboxmodel seltype，因为我想在每个单元格上显示一个自定义图标。那么有什么办法可以做到这一点呢？

嗨，我想你需要有一个单元格点击事件。请找到我的例子，希望能有所帮助

Ext.create('Ext.data.Store', {
    storeId: 'simpsonsStore',
    fields:[ 'name', 'email', 'phone'],
    data: [
        { name: 'Lisa', email: 'lisa@simpsons.com', phone: '555-111-1224' },
        { name: 'Bart', email: 'bart@simpsons.com', phone: '555-222-1234' },
        { name: 'Homer', email: 'homer@simpsons.com', phone: '555-222-1244' },
        { name: 'Marge', email: 'marge@simpsons.com', phone: '555-222-1254' }
    ]
});

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    store: Ext.data.StoreManager.lookup('simpsonsStore'),
    columns: [
        { text: 'Name', dataIndex: 'name' },
        { text: 'Email', dataIndex: 'email', flex: 1 },
        { text: 'Phone', dataIndex: 'phone' }
    ],
    listeners: {
        cellclick: function( grid, td, cellIndex, record, tr, rowIndex, e, eOpts )  {
            grid.getSelectionModel().selection(record);

        }
    },
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
}); 

---

嗨，我想你需要有细胞点击事件。请找到我的例子，希望能有所帮助

Ext.create('Ext.data.Store', {
    storeId: 'simpsonsStore',
    fields:[ 'name', 'email', 'phone'],
    data: [
        { name: 'Lisa', email: 'lisa@simpsons.com', phone: '555-111-1224' },
        { name: 'Bart', email: 'bart@simpsons.com', phone: '555-222-1234' },
        { name: 'Homer', email: 'homer@simpsons.com', phone: '555-222-1244' },
        { name: 'Marge', email: 'marge@simpsons.com', phone: '555-222-1254' }
    ]
});

Ext.create('Ext.grid.Panel', {
    title: 'Simpsons',
    store: Ext.data.StoreManager.lookup('simpsonsStore'),
    columns: [
        { text: 'Name', dataIndex: 'name' },
        { text: 'Email', dataIndex: 'email', flex: 1 },
        { text: 'Phone', dataIndex: 'phone' }
    ],
    listeners: {
        cellclick: function( grid, td, cellIndex, record, tr, rowIndex, e, eOpts )  {
            grid.getSelectionModel().selection(record);

        }
    },
    height: 200,
    width: 400,
    renderTo: Ext.getBody()
}); 

---

我解决了beforecellclick事件的问题。现在看起来是这样的：

beforecellclick:function(grid,record,index){
                        if(index != 0){
                            return false
                        }
               }

我在colIndex 0上有一个动作栏：

xtype: 'actioncolumn',
        tooltip:'löschen',
        width: 30,
        icon: '../../../../../../resources/images/16/delete_2.png',
        handler:function(grid, rowIndex, colIndex){
            var record = grid.getStore().getAt(rowIndex);
            if( grid.getSelectionModel().isSelected(record) == false){
                grid.getSelectionModel().select(record, true)
            }else{
                grid.getSelectionModel().deselect(record)
            }      
        } 

---

我解决了beforecellclick事件的问题。现在看起来是这样的：

beforecellclick:function(grid,record,index){
                        if(index != 0){
                            return false
                        }
               }

我在colIndex 0上有一个动作栏：

xtype: 'actioncolumn',
        tooltip:'löschen',
        width: 30,
        icon: '../../../../../../resources/images/16/delete_2.png',
        handler:function(grid, rowIndex, colIndex){
            var record = grid.getStore().getAt(rowIndex);
            if( grid.getSelectionModel().isSelected(record) == false){
                grid.getSelectionModel().select(record, true)
            }else{
                grid.getSelectionModel().deselect(record)
            }      
        }