在做项目时有用到bootstrap-table需要合并单元格的问题。之前是网上找的合并单元格的代码,并且测试起来也是能用,贴上代码。
function mergeCells(data,fieldName,colspan,target){//声明一个map计算相同属性值在data对象出现的次数和var sortMap = {};for(var i = 0 ; i < data.length ; i++){for(var prop in data[i]){if(prop == fieldName){var key = data[i][prop]//fieldName的valueif(sortMap.hasOwnProperty(key)){sortMap[key] = sortMap[key] * 1 + 1;} else {sortMap[key] = 1;}break;}}}//合并单元格var index = 0;for(var prop in sortMap){var count = sortMap[prop] * 1;$(target).bootstrapTable('mergeCells',{index:index, field:fieldName, colspan: colspan, rowspan: count});index += count;}}
因为后端已经将表格的顺序排好了再返回过来。这样会有一种问题出现。
在图中红框处加入一条数据,分别是“周星驰、科长 橘右京 梁朝伟 王一、王大锤0821”
加完后会发现,原本在画红框位置的“党委书记 李云龙”被合并到上一个了,下一行却多了一个科长橘右京
分析后发现,因为这边保存是通过sortMap.hasOwnProperty(key)判断key存不存在。而正确方法是判断当前的key是否和上一个key一样,一样的话才进行合并。如图:
最终的代码如下:
function mergeCells(data, fieldName, colspan, target) {//声明一个map计算相同属性值在data对象出现的次数和var sortMap = [];var lastKey;for (var i = 0; i < data.length; i++) {for (var prop in data[i]) {if (prop == fieldName) {var key = data[i][prop];if (key == lastKey){sortMap[sortMap.length-1].val += 1;}else {sortMap.push({key:key,val:1})lastKey= key;}break;}}}var index = 0;for (var i = 0; i < sortMap.length; i++) {var item = sortMap[i];var count = item.val * 1;target.bootstrapTable('mergeCells', {index: index, field: fieldName, colspan: colspan, rowspan: count});index += count;}}