easyUI单元格合并自定义封装

1、指定列的行合并

* 效果图：

合并自定义封装（一）

 

* 程序：

function mergeGridColCells(grid,rowFildName)
{
       var rows=grid.datagrid('getRows' );
       //alert(rows.length);
       //alert(rows[1][rowFildName]);
       var startIndex=0;
       var endIndex=0;
       if(rows.length< 1)
      {
             return;
      }
      $.each(rows, function(i,row){
             if(row[rowFildName]==rows[startIndex][rowFildName])
            {
                  endIndex=i;
            }
             else
            {
                  grid.datagrid( 'mergeCells',{
                        index: startIndex,
                        field: rowFildName,
                        rowspan: endIndex -startIndex+1
                  });
                  startIndex=i;
                  endIndex=i;
            }

      });
 grid.datagrid( 'mergeCells',{
                  index: startIndex,
                  field: rowFildName,
                  rowspan: endIndex -startIndex+1
      });
}

*参数说明

grid：        easyUI的datagrid对象

rowFildName： 和并列的field属性值

 

 

合并自定义封装（二）

 

1. 源代码如下：
   
   

   function mergeGridColCells(grid,refCols,rowFildNames)
         {
                var rows=grid.datagrid('getRows' );
                //alert(rows.length);
                //alert(rows[1][rowFildName]);
                var flag=false ;
                var startIndex=0;
                var endIndex=0;
                if(rows.length< 1)
               {
                      return;
               }
               $.each(rows, function(i,row){
                 $.each(refCols, function(j,refCol){
                       if(row[refCol]!=rows[startIndex][refCol])
                       {
                             flag= false;
                             return false ;
                       }
                       else
                       {
                             flag= true;
                       }
                 });
                     //if(row[rowFildName]==rows[startIndex][rowFildName])
                     if(flag)
                     {
                           endIndex=i;
                     }
                      else
                     {
                            $.each(rowFildNames, function(k,rowFildName){
                                  grid.datagrid( 'mergeCells',{
                                       index: startIndex,
                                       field: rowFildName,
                                       rowspan: endIndex -startIndex+1,
                                       colspan: null
                                 });
                            });
   
                           startIndex=i;
                           endIndex=i;
                     }
               });
               $.each(rowFildNames, function(k,rowFildName){
                      grid.datagrid( 'mergeCells',{
                                 index: startIndex,
                                 field: rowFildName,
                                 rowspan: endIndex -startIndex+1,
                                 colspan: null
                           });
             });
         }

   
   
   
2. 参数说明
   
   grid：        easyUI的datagrid对象
   

   refCols        合并参考列数组，及这些列都相等则合并rowFildNames指定的列
   rowFildNames： 和并列的field属性值及要合并的列数组
   
   
3.  
   示例：mergeGridColCells($('#serviceTypeTable'),['serviceTypeId','areaId'],['areaName']);