Extjs怎么给Grid增加一个CheckBox列

Posted 2023-04-29

首先导入扩展CheckColumn的JS文件在extjs文件包的/examples/ux/CheckColumn.js。 然后将你要用来显示true/false的那列的xtype配置成checkcolumn。 例子: xtype:"checkcolumn",header:"头部",dataIndex:"xxxx" 参考技术A var extWindowDepartmentList = new Ext.grid.GridPanel (autoFill : true,
autoHeight : true,
cm : new Ext.grid.ColumnModel([new Ext.grid.CheckboxSelectionModel (singleSelect : false),//checkbox 列
dataIndex : 'AreaID',header : '地区',hidden : false,sortable : false,
dataIndex : 'Dept_Name',header : '部门',hidden : false,sortable : false,
dataIndex : 'Id',header : 'Id',hidden : true,sortable : false
]),
height : 500,
sm : new Ext.grid.CheckboxSelectionModel (singleSelect : false) //这里必须有
,
store : new Ext.data.Store (autoLoad : true,id : 'StoreDepartmentList',proxy : new Ext.data.HttpProxy (url : '/Department/List' ), //数据源
reader : new Ext.data.JsonReader (fields : [type : 'auto' ,name : 'AreaID', type : 'auto',name : 'Dept_Name',type : 'auto', name : 'Id',type : 'auto'])
)
);

如何将复选框列添加到 Extjs Grid

【中文标题】如何将复选框列添加到 Extjs Grid

【英文标题】：how to add checkbox column to Extjs Grid

【发布时间】：2011-03-19 22:53:27

【问题描述】：

我有 EXTjs 网格。我想知道如何将复选框添加到 Extjs 网格列。

在我的数据表中，我将获得“状态”列的值。它可能是真/假。所以基于它应该显示复选框列已选中/未选中。

【参考方案1】：

查看示例here。它使用一个名为 CheckBoxColumn 的插件（您必须查看源代码并找到 JS 文件。

插件文件中的一些示例用法...

var checkColumn = new Ext.grid.CheckColumn( header: 'Indoor?', dataIndex: 'indoor', id: 'check', width: 55 ); // add the column to the column model var cm = new Ext.grid.ColumnModel([ header: 'Foo', ... , checkColumn ]); // create the grid var grid = new Ext.grid.EditorGridPanel( ... cm: cm, plugins: [checkColumn], // include plugin ... );