/**
* 合併單元格
* @param {} grid 要合併單元格的grid對象
* @param {} cols 要合併哪幾列 [1,2,4]
*/
function mergeCells(grid, cols) {
var arrayTr = document.getElementById(grid.getId()+"-body").firstChild.firstChild.firstChild.getElementsByTagName('tr');
//var arrayTr = document.getElementById(grid.getId()+"-body").firstChild.nextSibling;
//var arrayTr = Ext.get(grid.getId()+"-body").first().first().first().select("tr");
var trCount = arrayTr.length;
var arrayTd;
var td;
var merge = function(rowspanObj, removeObjs) { //定義合併函數
if(rowspanObj.rowspan != 1) {
arrayTd = arrayTr[rowspanObj.tr].getElementsByTagName("td"); //合併行
td = arrayTd[rowspanObj.td - 1];
td.rowSpan = rowspanObj.rowspan;
td.vAlign = "middle";
Ext.each(removeObjs, function(obj) { //隱身被合併的單元格
arrayTd = arrayTr[obj.tr].getElementsByTagName("td");
arrayTd[obj.td - 1].style.display = 'none';
});
}
};
var rowspanObj = {}; //要進行跨列操作的td對象{tr:1,td:2,rowspan:5}
var removeObjs = []; //要進行刪除的td對象[{tr:2,td:2},{tr:3,td:2}]
var col;
Ext.each(cols, function(colIndex) { //逐列去操作tr
var rowspan = 1;
var divHtml = null; //單元格內的數值
for(var i=1; i<trCount; i++) { //i=0表示表頭等沒用的行
arrayTd = arrayTr[i].getElementsByTagName("td");
var cold = 0;
Ext.each(arrayTd, function(Td) { //獲取RowNumber列和check列
if(Td.getAttribute("class").indexOf("x-grid-cell-special") != -1)
cold++;
});
col = colIndex + cold; //跳過RowNumber列和check列
if(!divHtml) {
divHtml = arrayTd[col-1].innerHTML;
rowspanObj = {tr: i, td: col, rowspan: rowspan}
}else{
var cellText = arrayTd[col-1].innerHTML;
var addf = function() {
rowspanObj["rowspan"] = rowspanObj["rowspan"] + 1;
removeObjs.push({tr: i,td: col});
if(i == trCount-1) merge(rowspanObj, removeObjs);//執行合併函數
};
var mergef = function() {
merge(rowspanObj, removeObjs);//執行合併函數
divHtml = cellText;
rowspanObj = {tr: i, td: col, rowspan: rowspan}
removeObjs = [];
};
if(cellText == divHtml) {
if(colIndex != 1) {
var leftDisplay=arrayTd[col-2].style.display;//判斷左邊單元格值是否已display
if(leftDisplay == 'none') addf();
else mergef();
} else addf();
} else mergef();
}
}
});
};
ExtJs - grid 合併單元格 跨行跨列
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.