extjs的数据表格,可以通过设置 selModel:{type: 'checkboxmodel'}来控制复选框的显示;也可以通过设置selType: 'checkboxmodel'来控制;
需要注意的是回显:
_this.getSelectionModel().select(index,true)
var dataSourceColumn=[
{
'dataName':'数据源',
'dataId':'1',
},
{
'dataName':'数据源1',
'dataId':'2',
}
]
Ext.create('Ext.window.Window', {
title: "创建弹框",
id: 'startController',
width: 325,
height: 400,
modal: true,
header: {
cls: 'x-panel-header-new',
},
items: [
{
xtype: 'panel',
height: 35,
title: '',
cls: 'startControllerTitle',
tools: [
{
tooltip: '提示信息',
iconCls: 'icon_fpd_help'
},
],
},
{
xtype: 'grid',
border: false,
autoHeight: true,
stripeRows: false, //斑马线效果
sortableColumns: false, // 禁用排序
enableColumnHide: false, // 禁用menu
columnLines: true, // 列间线
cls: 'startController',
style: 'padding:0 0px 0 15px;',
id:'mutilationData',
width: '100%',
selModel: {
type: 'checkboxmodel',
},
store: {
fields: ['dataName','dataId'],
data: dataSourceColumn
},
columns: [
{
header: '名称',
dataIndex: 'dataName',
width: 260,
style: 'text-align:left;border-left:1px solid #263646;padding:5px 6px',
editor: {
allowBlank: true
}
},
],
listeners: {
render: function (_this, eOpts) {
//获取选中的配置
var echartsData = echartsData;
// checked回显
if(echartsData){
//获取 列表
var items = _this.getSelectionModel().store.data.items;
$(items).each(function (index,ele) {
for(var item in echartsData){
//设置回显
if(ele.data.dataName== echartsData[item].dataName){
_this.getSelectionModel().select(index,true)
}
}
})
}
}
}
}
],
buttons: [
{
text: '确定',
id: "loadUrlTick",
handler: function () {
var dataArr = [];
//获取选中
var select = Ext.getCmp('mutilationData').getSelection();
//存在选中
if (select.length > 0) {
select.forEach(function (item) {
//获取选中的名称
var dataName = item.data.dataName;
dataArr.push(dataName);
})
};
//关闭弹窗
Ext.getCmp('startController').destroy();
}
},
{
text: '取消',
handler: function () {
Ext.getCmp('startController').destroy();
}
}
],
}).show();