Extjs 3.4 同值合并

Posted 2020-07-04 飘影

摘自：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;
}