bootstraptable行合并

Posted 2022-06-05 abo666

onLoadSuccess: function (data) 
            data = $(‘#categorySonTab‘).bootstrapTable(‘getData‘, true);
            //合并单元格
            mergeCells(data, "name", 1, $(‘#categorySonTab‘));
            mergeCells(data, "url", 1, $(‘#categorySonTab‘));
            mergeCells(data, "cateWord", 1, $(‘#categorySonTab‘));
            mergeCells(data, "id", 1, $(‘#categorySonTab‘));

        ,

 

合并方法（直接可用）

/**
 * 合并单元格
 * @param data  原始数据（在服务端完成排序）
 * @param fieldName 合并属性名称
 * @param colspan   合并列
 * @param target    目标表格对象
 */
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;
            
        
    
    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;
    

 

效果图：