bootstrap-table合并单元格

合并行

 onLoadSuccess: function (data) { 
   model.utils.mergeCells(data.rows, "course_type","course_type", 1, $('#train-courseFile-table')); //行合并
 }

合并后对td设置属性 vertical-align: middle;

合并单元格方法

  /**
   * 合并单元格
   * @param data  原始数据(在服务端完成排序)
   * @param fieldName 合并属性名称
   * @param colspan   合并列
   * @param target    目标表格对象
   */
  mergeCells: function (data,exhibitionName,fieldName,colspan,target){
    //声明一个map计算相同属性值在data对象出现的次数和
    var sortMap = {};
    for(var i = 0 ; i < data.length ; i++){
        for(var prop in data[i]){
            if(prop == exhibitionName){
                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;
    }
  },

猜你喜欢

转载自blog.csdn.net/jbguo/article/details/84634959
今日推荐