关于JSP页面的数据进行合并

要把数据进行合并达到下图的效果

jsp页面的代码如下:

<script type="text/javascript">

$(top.hangge());
        $(document).ready(function(){
        $("#table_report").rowspan(0);
        $("#table_report").rowspan(1);
        $("#table_report").rowspan1(8,1);
        $("#table_report").rowspan1(9,1);
        $("#table_report").rowspan1(10,1);
        });
            //jquery合并表格相同项
        jQuery.fn.rowspan=function(colIdx){
           return this.each(function(){
                 var that;
                 $('tr',this).each(function(row){
                      $('td:eq('+colIdx+')',this).filter(':visible').each(function(col){
                                 if(that!=null && $(this).html()==$(that).html()){
                                 rowspan=$(that).attr("rowSpan");
                                 if(rowspan==undefined){
                                    $(that).attr("rowSpan",1);
                                    rowspan=$(that).attr("rowSpan");
                                 }
                                 rowspan=Number(rowspan)+1;
                                 $(that).attr("rowspan",rowspan);
                                 $(this).hide();
                                 }else{
                                 that=this;
                                 }
                      });
                 });  
           });
        }
        
        //完善table表格合并功能,要求某一列前后行必须一致的情况下才去合并另一列(比如必须在前后行船名一致的情况下才考虑合并)
        jQuery.fn.rowspan1 = function(colIdx,dataIdx) {//colIdx:要合并的列号,dataIdx:校验列号(值必须一致的列) 
              return this.each(function(){ 
                 var that; 
                 var lastData;
                $('tr', this).each(function(row) {//遍历行 
                var data_d = $(this).find('td').eq(dataIdx).html();//获取当前行校验列的值
                if (lastData!=null && data_d == lastData) {//前后两条校验列的数据一致
                $('td:eq('+colIdx+')', this).filter(':visible').each(function(col) {//处理要合并的列 
                    if (that!=null && $(this).html() == $(that).html()) {//前后两条合并列的数据一致 
                        rowspan = $(that).attr("rowSpan"); 
                        if (rowspan == undefined) { 
                            $(that).attr("rowSpan",1); 
                            rowspan = $(that).attr("rowSpan"); 
                        } 
                        rowspan = Number(rowspan)+1; 
                        $(that).attr("rowSpan",rowspan); 
                        $(this).hide(); 
                    } else { 
                        that = this; 
                    } 
                }); 
            } else {//如果前后两条校验列的数据不一致,则更新上一条的数据为本条数据 
                lastData = data_d; 
                $('td:eq('+colIdx+')', this).filter(':visible').each(function(col) { 
                    that = this; 
                });
            }    
        }); 
    }); 
}

<script type="text/javascript">

有两种方法,前面的表格根据自己的情况来设置,后面的是比较完善的

xml里面的列,为了看的更加清楚:

<!--单船分析表  -->
         <select id="datalistPageShipAls" parameterType="page" resultType="pd">
        SELECT 
                  A.R_SHIPS_NAME AS VAR1,   
                  A.R_CARGO_NAME AS VAR2, 
                  (SUBSTR(A.R_DATE,0,10))||'('||A.R_CLASSES||')' AS VAR3,
                  A.D_NAME AS VAR4, 
                  A.MJ_NAME AS VAR5, 
                  SUM(A.R_NET_WEIGHT) AS VAR6,
                  ROUND(SUM(A.R_TIME_USE/3600),2) AS VAR7, 
                  ROUND(MAX(B.all_times/3600),2) AS VAR8,
                  MAX(B.all_weight) AS VAR9,
                  ROUND (MAX(B.all_weight)/MAX(B.all_times/3600),2) AS VAR10,
                  ROUND(SUM(A.R_NET_WEIGHT)/SUM(A.R_TIME_USE/3600),2) AS VAR11  
        FROM    VW_DATA_DETAILS A,
                (select S_ID,sum(r_time_use) as all_times,sum(r_net_weight) as all_weight from VW_DATA_DETAILS
                    where 
                        1=1
                        <if test="pd.QUERY_BEGIN_DATE != null and pd.QUERY_BEGIN_DATE != '' and pd.QUERY_END_DATE != null and pd.QUERY_END_DATE != ''">
                            AND (R_DATE BETWEEN #{pd.QUERY_BEGIN_DATE} AND #{pd.QUERY_END_DATE})       
                        </if> 
                    group by S_ID 
                ) B    
           WHERE 
                A.S_ID = B.S_ID         
             <if test="pd.QUERY_BEGIN_DATE != null and pd.QUERY_BEGIN_DATE != '' and pd.QUERY_END_DATE != null and pd.QUERY_END_DATE != ''">
                AND (R_DATE BETWEEN #{pd.QUERY_BEGIN_DATE} AND #{pd.QUERY_END_DATE})       
            </if>  
               <if test="pd.R_SHIPS_NAME != null and pd.R_SHIPS_NAME != ''">
                AND A.R_SHIPS_NAME LIKE CONCAT(CONCAT('%', #{pd.R_SHIPS_NAME}),'%')          
            </if>  
          GROUP BY R_SHIPS_NAME,R_CARGO_NAME,D_NAME,MJ_NAME,SUBSTR(R_DATE,0,10),R_CLASSES 
          ORDER BY R_SHIPS_NAME,(SUBSTR(R_DATE,0,10))||'('||R_CLASSES||')',D_NAME,MJ_NAME         
    </select>

起重获取数据用的是一个视图,因为这个项目涉及的的表格太多了。联合查询比较麻烦,希望遇到同样问题的朋友们,看到这个会对你们有点帮助,虽然我是一个菜鸟。。。

扫描二维码关注公众号,回复: 3025901 查看本文章

猜你喜欢

转载自blog.csdn.net/lp18871701190/article/details/82188771