Extjs 3.4 同值合并

时间:2023-03-08 15:54:55
摘自:http://www.cnblogs.com/kunpengit/archive/2012/11/13/2768239.html
/**
* grid gridPanel 需要合并的表格
* rowOrCol 合并行还是列 需要合并的列(dateIndex)
*borderStyle 样式
**/
function gridSpan(grid, rowOrCol,colName, borderStyle) {
var array1 = new Array();
var count1 = 0;
var count2 = 0;
var index1 = 0;
var index2 = 0;
var aRow = undefined;
var preValue = undefined;
var firstSameCell = 0;
var allRecs = grid.getStore().getRange();
if (rowOrCol == "row") {
count1 = grid.getColumnModel().getColumnCount();
count2 = grid.getStore().getCount();
} else {
count1 = grid.getStore().getCount();
count2 = grid.getColumnModel().getColumnCount();
}
count1 = 2; // 对第二列合并
for (i = 1; i < count1; i++) {
preValue = undefined;
firstSameCell = 0;
array1[i] = new Array();
for (j = 0; j < count2; j++) {
if (rowOrCol == "row") {
index1 = j;
index2 = i;
} else {
index1 = i;
index2 = j;
}
if (allRecs[index1].get(colName) == preValue) {
allRecs[index1].set(colName, " ");
array1[i].push(j);
//alert(i + "\r\n"+j);
if (j == count2 - 1) {
var index = firstSameCell + Math.round((j + 1 - firstSameCell) / 2 - 1);
if (rowOrCol == "row") {
allRecs[index].set(colName, preValue);
} else {
allRecs[index1].set(grid.getColumnModel().getColumnId(index), preValue);
}
}
} else {
if (j != 0) {
var index = firstSameCell + Math.round((j + 1 - firstSameCell) / 2 - 1);
if (rowOrCol == "row") {
allRecs[index].set(colName, preValue);
} else {
allRecs[index1].set(grid.getColumnModel().getColumnId(index), preValue);
}
}
firstSameCell = j;
preValue = allRecs[index1].get(colName);
allRecs[index1].set(colName, " ");
if (j == count2 - 1) {
allRecs[index1].set(colName, preValue);
}
}
}
}
grid.getStore().commitChanges();//添加所有分隔线
for (i = 0; i < grid.getStore().getCount(); i++) {
for (j = 0; j < grid.getColumnModel().getColumnCount(); j++) {
aRow = grid.getView().getCell(i, j);
aRow.style.borderTop = borderStyle;
aRow.style.borderLeft = borderStyle;
}
}//去除合并的单元格的分隔线
for (i = 1; i < array1.length; i++) {
for (j = 0; j < array1[i].length; j++) { if (rowOrCol == "row") {
aRow = grid.getView().getCell(array1[i][j], i);
aRow.style.borderTop = 'none';
} else {
aRow = grid.getView().getCell(i, array1[i][j]);
aRow.style.borderLeft = "none";
}
}
}
}; //在执行load的时候加载
ds_Custom.on('load',function(){
gridSpan(gpCustom, 'row',"cname", '1px solid #DDDDDD');
});

/*与表头对齐*/
.x-grid3-row td,.x-grid3-summary-row td {
padding-right: 0px;
padding-left: 0px;
padding-top: 0px;
padding-bottom: 0px;
}

注:如果合并的行不想显示网格的话,请在网页的css里面加上 下面的样式参数

  

/*去掉行间空白*/
.x-grid3-row {
border-right-width: 1px;
border-left-width: 1px;
border-top-width: 1px;
border-bottom-width: 1px;
}