使用DataTables合并行

效果以下:html

首先须要对数据进行分组查询,使用COUNT(*) OVER(PARTITION BY column名称) as columnCount 获取每组的数据条数 columnCount;使用ROW_NUMBER() OVER(partition by column名称 ORDER BY column名称 DESC) as columnNum 为每组的数据生成排序ID columnNum;

使用createdCell函数进行单元格合并,具体参考:www.datatables.club/reference/o…bash

"columnDefs":[{
    "targets": 0,
    "orderable" : false,
    "data":null,
    "createdCell": function(td, cellData, rowData, row, col) {
        if(rowData.columnNum > 1){
        	$(td).remove();
        }
        if(rowData.columnNum == 1){
        	$(td).attr("rowspan", rowData.columnCount);
        }
    }
}]
复制代码

rowData为每一行的数据内容,判断当前行在分组内的columnNum,等于1的添加属性rowspan,并设置其值为columnCount;大于1的将td单元格删除。 PS:在使用createdCell函数时老是报错以下:函数

通过各类查找,在添加"data":null以后问题解决,具体缘由参考: datatables.net/forums/disc…

Add: data: null to your first column to tell DataTables not to try and source the data from anywhere. Otherwise it will use the column index (0 in this case).this

在第一列中添加:data:null,告诉数据表不要尝试从任何地方获取数据。不然,它将使用列索引(在本例中为0)。spa

相关文章
相关标签/搜索