Extjs gridpanel 加入全选列

2019独角兽企业重金招聘Python工程师标准>>>

我们在用Extjs的gridpanel时，往往会用到选择列，该选择列最好带有全选和取消全选功能。

具体代码如下：

var tableCheckboxModel = Ext.create('Ext.selection.CheckboxModel', {
    mode:"SIMPLE",
    showHeaderCheckbox: true
});

Ext.define('BaseDataGeneApp.view.TableReleationList', {
    extend: 'Ext.grid.Panel',
    alias: 'widget.tableReleationList',
    title: '关联表',
    store: 'BaseDataTableRelations',
    selModel: tableCheckboxModel,
    allowDeselect: true,
    columns :[
        {header: '字段名',dataIndex: 'columnName',width: 120},
        {header :'关联表名',dataIndex :'releatedTable',width :120}
    ]
});

我们首先定义一个CheckboxModel，然后在定义gridPanel时，加入

selModel: tableCheckboxModel,
allowDeselect: true

这样就可以得到如下图所示的gridpanel

var selectedTableRelations = Ext.ComponentQuery.query('tableReleationList')[0].
   getSelectionModel().getSelection();

通过上述代码，可以得到选中的数据。

转载于:https://my.oschina.net/friendship/blog/304983