选择一个检查列时，如何使用户不在EXTJS网格面板中选择其他检查列

我有一个网格面板，其中包括4个检查列

其中三个栏目需要像广播选项一样运作；当用户检查一列时，他们应该无法检查其他两列

第四列应该是独立的，不受其他三列的影响

我使用的是ExtJs版本5.1

Ext.define('MyApp.view.MyGridPanel', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.mygridpanel',

    requires: [
        'MyApp.view.MyGridPanelViewModel',
        'MyApp.view.MyGridPanelViewController',
        'Ext.grid.column.Check',
        'Ext.view.Table'
    ],

    controller: 'mygridpanel',
    viewModel: {
        type: 'mygridpanel'
    },
    height: 250,
    width: 400,
    title: 'My Grid Panel',

    columns: [
        {
            xtype: 'checkcolumn',
            dataIndex: 'string',
            text: 'String'
        },
        {
            xtype: 'checkcolumn',
            dataIndex: 'number',
            text: 'Number',
            listeners: {
                checkchange: 'onCheckcolumnCheckChange'
            }
        },
        {
            xtype: 'checkcolumn',
            dataIndex: 'date',
            text: 'Date'
        },
        {
            xtype: 'checkcolumn',
            dataIndex: 'bool',
            text: 'Boolean'
        }
    ]
});

---

我认为你不能禁用，你可能的意思是取消选中

如果是这样的话，你似乎已经做了一半，我会在你的检查栏中使用侦听器，例如

请在此处查看它的实际操作：

如果只想对某些检查列执行此操作，则始终可以检查dataIndex：

onCheckcolumnCheckChange:function(column,rowIndex,checked,record){
    var gridHeader = column.up();
    gridHeader.items.each(function(col){
        if(checked && checked.dataIndex!='other' && col.xtype==='checkcolumn'&&col!==column){
            record.set(col.dataIndex,false);
        }
    })
}

一种更好的方法是（特别是如果您希望有几个额外的检查列，在检查其他列时这些列不会取消设置）向列中添加一个自定义属性，然后进行检查

{
    xtype: 'checkcolumn',
    dataIndex: 'date',
    text: 'Date',
    checkgroup: 'threecols',
    listeners: {
        checkchange: 'onCheckcolumnCheckChange'
    }
},

注意

checkgroup

不是标准的配置/属性-但您可以通过这种方式设置自定义属性（只要它们不与实际属性冲突）

然后在

onCheckcolumnCheckChange

方法中，您可以检查以下内容：

if (checked && col.checkgroup && col.checkgroup === column.checkgroup && col.xtype === 'checkcolumn' && col !== column) {
    record.set(col.dataIndex, false);
}

---

这种方法的另一个好处是可以轻松设置多组复选框，在这些复选框中可以设置不同的“checkgroup”值。

谢谢Theo。如果我想保持其中一个检查列保持不变，并且用户只需从其余3个检查列中选择一个，该怎么办。你能帮我这里的例子，你给我我想保持字符串检查列保持不变。（用户可以检查和取消选中此列不依赖于其余三个）。用户应该只能从数字、日期和布尔检查列中选择一列。谢谢！！Theo但又是一个新问题，我在我的视图控制器中编写侦听器，我得到一个错误类型错误：record为null。我正在view controller.Ext.define（'Wxample.view.exampleViewController'，{extend:'Ext.app.ViewController'，别名：'controller.examplepanel'，onCheckcolumnCheckChange:function（column，rowIndex，checked，record）{var gridHeader=column.up（）；var record=me.getViewModel（）.get（'record'）中编写侦听器事件；//我想我在gridHeader.items.each（函数（col）{console.log（col）；if（checked&&col.xtype=='checkcolumn'&&col！==column&&col.dataIndex！='taxYesNo'）{record.set（col.dataIndex，false）；}}）；一旦checkColumnCheckChange通过了记录，所以您不需要从任何地方获取它，请创建一个提琴，以便我可以更好地查看代码

if (checked && col.checkgroup && col.checkgroup === column.checkgroup && col.xtype === 'checkcolumn' && col !== column) {
    record.set(col.dataIndex, false);
}