easyUI datagarid单元格动态合并
第二列根据第一列合并,第三列根据第二列合并。层级关系。
/* * tableID表格的id * colList要合并的字段例如:"overcount,totalcount" */ //加载成功后合并单元格 function mergeCellByField(tableID, colList){ var tTable = $("#" + tableID);//表的id var ColArray = colList.split(",");//合并的列数组 var TableRowCnts = tTable.datagrid("getRows").length;//得到总行数 var tempTxt = tTable.datagrid("getRows")[0][ColArray[0]],//第一次的临时变量为第一行的值 curTxt='';//存放table表循环出来的对应的字段值 var cellNumArr = [];//存放每次合并开始的下标 var numTotal = 1;//相同的字段数 for (var i = 1; i <= TableRowCnts; i++) { if(i==TableRowCnts){ curTxt='';//最后一个的情况 }else{ curTxt = tTable.datagrid("getRows")[i][ColArray[0]]; } if(curTxt == tempTxt){ numTotal+=1; }else{ //第一个字段的合并 tTable.datagrid("mergeCells", { index:i-numTotal,//合并开始的索引 field: ColArray[0],//合并的字段 rowspan: numTotal,//合并的行数 colspan: null//合并的列数 }); cellNumArr.push(i-numTotal);//每次合并的行下标的开始索引 tempTxt = curTxt;//将每次循环的值赋值给临时变量,与上一次对比 numTotal = 1; //每次不同时,第一个不算入,从第二个开始对比 } } mergeCellByFieldSecond(tTable,ColArray,cellNumArr) } //第二个字段的合并 function mergeCellByFieldSecond(tTable, ColArray,cellNumArr){ var befCellArr = cellNumArr; var tTable = tTable; var ColArray = ColArray; var thirdIndexArr = []; var tempTxt = ''; for(var j = 0; j <= befCellArr.length-1;j++){ var num =befCellArr[j]+1; var nextNum = befCellArr[j+1]; var index = befCellArr[j]; tempTxt = tTable.datagrid("getRows")[index][ColArray[1]],curTxt=''; var tempArr = cellRow(tTable,ColArray,num,nextNum,tempTxt,1); thirdIndexArr = thirdIndexArr.concat(tempArr) } mergeCellByFieldThird(tTable,ColArray,thirdIndexArr); } //第三个字段合并 function mergeCellByFieldThird(tTable,ColArray,thirdIndexArr){ var befCellArr = thirdIndexArr; var tTable = tTable; var ColArray = ColArray; for(var k = 0; k <= befCellArr.length-1;k++){ var num =befCellArr[k]+1; var nextNum = befCellArr[k+1]; var index = befCellArr[k]; tempTxt = tTable.datagrid("getRows")[index][ColArray[2]]; var tempArr = cellRow(tTable,ColArray,num,nextNum,tempTxt,2); } } //根据前一列合并 function cellRow(tTable,ColArray,num,nextNum,tempTxt,colum){ var TableRowCnts = tTable.datagrid("getRows").length;//得到总行数 var curTxt=''; var cellNumArr = [];//存放每次合并开始的下标 var numTotal = 1;//相同的字段数 if(nextNum == null){ nextNum =TableRowCnts; } for (var i = num; i <= nextNum; i++) { if(i == nextNum){ curTxt='';//最后一个的情况 }else{ curTxt = tTable.datagrid("getRows")[i][ColArray[colum]]; } if(curTxt == tempTxt){ numTotal+=1; }else{ //第一个字段的合并 tTable.datagrid("mergeCells", { index:i-numTotal,//合并开始的索引 field: ColArray[colum],//合并的字段 rowspan: numTotal,//合并的行数 colspan: null//合并的列数 }); cellNumArr.push(i-numTotal);//每次合并的行下标的开始索引 tempTxt = curTxt;//将每次循环的值赋值给临时变量,与上一次对比 numTotal = 1; //每次不同时,第一个不算入,从第二个开始对比 } } return cellNumArr; }
效果图: