bootstrap dataTable 合并单元格(前端)

转载:http://blog.csdn.net/li905663280/article/details/71774297

index.html




    
    
    


    

table

ID Item Name Item Price
111
111
333
333
333


index.js

$(document).ready(function(){
    var columnName="name";
    mergeTable(columnName);

});
function mergeTable(field){
    $table=$("#table");
    var obj=getObjFromTable($table,field);

     for(var item in obj){  
        $("#table").bootstrapTable('mergeCells',{
        index:obj[item].index,
        field:field,
        colspan:1,
        rowspan:obj[item].row,
        });
      }


}

function getObjFromTable($table,field){
    var obj=[];
    var maxV=$table.find("th").length;

    var columnIndex=0;
    var filedVar;
    for(columnIndex=0;columnIndex tr");
    var $tr;
    var index=0;
    var content="";
    var row=1;
    for (var i = 0; i <$trs.length;i++)
    {   
        $tr=$trs.eq(i);
        var contentItem=$tr.find("td").eq(columnIndex).html();
        //exist
        if(contentItem.length>0 && content==contentItem ){
            row++;
        }else{
            //save
            if(row>1){
                obj.push({"index":index,"row":row});
            }
            index=i;
            content=contentItem;
            row=1;
        }
    }
    if(row>1)obj.push({"index":index,"row":row});
    return obj; 
}

bootstrap dataTable 合并单元格(前端)_第1张图片

你可能感兴趣的:(bootstrap dataTable 合并单元格(前端))