Javascript 删除extjs checkboxmodel中的全选复选框

我的

extjs

页面中有一个复选框模型

var saCheckBox= Ext.create('Ext.selection.CheckboxModel', {mode: 'SINGLE'});

我通过selModel在

网格.Panel

中使用它。
我想从模型中删除复选框。
我找到并相应地添加了一个侦听器，但仍然得到了复选框

var saCheckBox= Ext.create('Ext.selection.CheckboxModel', {mode: 'SINGLE'}, {listeners: {

    afterrender: function (grid) {
       $('.x-column-header-checkbox').css('display','none');
    }
}});

---

我使用了

display:none

作为特定的span，它在Mozilla中运行良好，但在其他浏览器中不起作用。有人能提供与浏览器兼容的解决方案吗？

您想使用：showHeaderCheckbox:false

见下例：

Ext.create('Ext.data.Store', {
storeId: 'simpsonsStore',
fields: ['name', 'email', 'phone'],
data: {
    'items': [{
        'name': 'Lisa',
            "email": "lisa@simpsons.com",
            "phone": "555-111-1224"
    }, {
        'name': 'Bart',
            "email": "bart@simpsons.com",
            "phone": "555-222-1234"
    }, {
        'name': 'Homer',
            "email": "home@simpsons.com",
            "phone": "555-222-1244"
    }, {
        'name': 'Marge',
            "email": "marge@simpsons.com",
            "phone": "555-222-1254"
    }]
},
proxy: {
    type: 'memory',
    reader: {
        type: 'json',
        root: 'items'
    }
}
});


var grid = Ext.create('Ext.grid.Panel', {
title: 'Simpsons',
id: 'sheetproductionrestin',
store: Ext.data.StoreManager.lookup('simpsonsStore'),
selModel: Ext.create('Ext.selection.CheckboxModel', {
    checkOnly: true,
    showHeaderCheckbox: false,  //here is where it is added.
    mode: 'MULTI'
}),
listeners: {
    cellclick: function (sender, td, cellIndex, record, tr, rowIndex, e, eOpts) {
        clickedColIndex = cellIndex;
    },
        beforedeselect: function (rowmodel, record, index, eOpts) {
        return (clickedColIndex == 0);
    }
},
columns: [{
    header: 'Name',
    dataIndex: 'name',
    editor: {
        xtype: 'textfield'
    }
}, {
    header: 'Email',
    dataIndex: 'email',
    flex: 1
}, {
    header: 'Phone',
    dataIndex: 'phone'
}],
height: 200,
width: 400,
renderTo: Ext.getBody(),
plugins: [Ext.create('Ext.grid.plugin.CellEditing', {
    clicksToEdit: 1,
    pluginId: 'cellplugin'
})]
// ...
});

---

我使用的是

extjs6.7.0

Modern工具包，但我认为它适用于经典版本

在下面的代码中，我在

selectable

对象文本中将

headerCheckbox

设置为

false

Ext.define('TestCheckboc.MyGrid') {
  extend: 'Ext.grid.Grid',
  selectable: {
    columns: false,
    cells: false,
    checkbox: true,
    checkboxColumnIndex: 0,
    checkboxSelect: true,
    headerCheckbox: false,
    mode: 'single'
  },
  items[{
    // ...
  }]
});

以下是结果的屏幕截图：

---

var saCheckBox=Ext.create（'Ext.selection.CheckboxModel'，{mode:'SINGLE'}，{showHeaderCheckbox:false}）