使用table2excel导出不规则table
项目需要导出不规则数据,根据他的js改完后,发现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] if(sortMap.hasOwnProperty(key)){ sortMap[key] = sortMap[key] * 1 + 1; } else { sortMap[key] = 1; } break; } } } for(var prop in sortMap){ // console.log(prop,sortMap[prop]) } 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; }}
根据其他列:
function mergeOtherCells(data, fieldName,otherName, colspan, target) {
var sort = Array();
var num = 1;
for (var i = 0; i < data.length - 1; i++) {
for ( var prop in data[i]) { if (prop == fieldName) { if (data[i][prop] == data[i + 1][prop]) { num++; if (i == data.length - 2) { sort.push(num); } } else { sort.push(num); num = 1; } break; } } } var index = 0; for (var j = 0; j < sort.length; j++) { var count = sort[j]; $(target).bootstrapTable('mergeCells', { index : index, field : otherName, colspan : colspan, rowspan : count, }); index += count; }};如何导出不规则table呢???使用table2excel,js 网上有很多,自行下载,初始化方法 $("#bootstrap-table").table2excel({ exclude: ".noExl", name: d2+"_"+d1+"统计汇总", // columns: 10,//指定不导出列 实例:columns: "0,1,2,3",下标从0开始,代表不导出第一列--第四列 filename: d2+"_"+d1+"统计汇总", fileext: ".xls", exclude_img : true, exclude_links : true, exclude_inputs : true })
注意事项:上述两个合并单元格的方法本色纸是加上列宽,然后隐藏不需要显示的列,而导出方法会将display为none的元素导出,导致excel显示错误,
因此,通过获取到当前所有为display为none的元素,代码如下:
onLoadSuccess: function (data) {
var table = KaTeX parse error: Expected 'EOF', got '#' at position 3: ('#̲bootstrap-table…(“td:hidden”);
$.each(tdList,function(i,object){
$(object).addClass(‘noExl’);
})
},
解释下代码:这个函数是table数据全部加载完毕后触发的函数,最下面就是获取隐藏元素,然后给他加上noExl,为什么加这个呢?table2excel.js默认会将加上此类的元素排除掉,也就不会导出来,这样完毕后,导出逇表格也正常了,如果想要导出的表格样式好看,可以修改源码,如果觉得这篇文章对你有用的话,点个赞把,可以留言告诉我你不懂的地方,我会一一解答。