easyUI单元格合并自定义封装

1、指定列的行合并

* 效果图：

合并自定义封装（一）

 

* 程序：

1. function mergeGridColCells(grid,rowFildName)
2. {
3. var rows=grid.datagrid('getRows' );
4. //alert(rows.length);
5. //alert(rows[1][rowFildName]);
6. var startIndex=0;
7. var endIndex=0;
8. if(rows.length< 1)
9. {
10. return;
11. }
12. $.each(rows, function(i,row){
13. if(row[rowFildName]==rows[startIndex][rowFildName])
14. {
15. endIndex=i;
16. }
17. else
18. {
19. grid.datagrid( 'mergeCells',{
20. index: startIndex,
21. field: rowFildName,
22. rowspan: endIndex -startIndex+1
23. });
24. startIndex=i;
25. endIndex=i;
26. }
27. });
28. grid.datagrid( 'mergeCells',{
29. index: startIndex,
30. field: rowFildName,
31. rowspan: endIndex -startIndex+1
32. });
33. }

 

*参数说明

grid：        easyUI的datagrid对象

rowFildName： 和并列的field属性值

 

 

合并自定义封装（二）

 

1. 源代码如下：
   1. function mergeGridColCells(grid,refCols,rowFildNames)
   2. {
   3. var rows=grid.datagrid('getRows' );
   4. //alert(rows.length);
   5. //alert(rows[1][rowFildName]);
   6. var flag=false ;
   7. var startIndex=0;
   8. var endIndex=0;
   9. if(rows.length< 1)
   10. {
   11. return;
   12. }
   13. $.each(rows, function(i,row){
   14. $.each(refCols, function(j,refCol){
   15. if(row[refCol]!=rows[startIndex][refCol])
   16. {
   17. flag= false;
   18. return false ;
   19. }
   20. else
   21. {
   22. flag= true;
   23. }
   24. });
   25. //if(row[rowFildName]==rows[startIndex][rowFildName])
   26. if(flag)
   27. {
   28. endIndex=i;
   29. }
   30. else
   31. {
   32. $.each(rowFildNames, function(k,rowFildName){
   33. grid.datagrid( 'mergeCells',{
   34. index: startIndex,
   35. field: rowFildName,
   36. rowspan: endIndex -startIndex+1,
   37. colspan: null
   38. });
   39. });
   40. startIndex=i;
   41. endIndex=i;
   42. }
   43. });
   44. $.each(rowFildNames, function(k,rowFildName){
   45. grid.datagrid( 'mergeCells',{
   46. index: startIndex,
   47. field: rowFildName,
   48. rowspan: endIndex -startIndex+1,
   49. colspan: null
   50. });
   51. });
   52. }
2. 参数说明
   
   grid：        easyUI的datagrid对象

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