使用Extjs 组合表头必须引用extjs自带的表头分组包 在这里我提供了两个表头分组包,ColumnHeaderGroup.js和GroupHeaderPlugin.js。ColumnHeaderGroup.js是Extjs3.1中自带的,提供表头组合,但无法进行筛选;GroupHeaderPlugin.js是改进过的,可进行筛选。
接下来就是实际代码
var group1 = [{}, {
header : '分组1-1a',
colspan : 4,
align : 'center'
}, {}, {
header : '分组1-3',
colspan : 5,
align : 'center'
}];
// 如果使用的是ColumnHeaderGroup.js 这地方需要改一下
// var group = new Ext.ux.grid.ColumnHeaderGroup({
// rows : [group1]
// });
var group = new Ext.ux.plugins.GroupHeaderGrid({
rows : [group1]
});
// 定义自动当前页行号
var rownum = new Ext.grid.RowNumberer({
header : 'NO',
width : 28
});
// 定义列模型
var cm = new Ext.grid.ColumnModel([rownum, {
header : '项目ID', // 列标题
dataIndex : 'xmid', // 数据索引:和Store模型对应