您的位置:首页 > Web前端 > JavaScript

Extjs 合并单元格

2015-08-03 22:09 676 查看

1.调用

store: new Ext.data.JsonStore({
       fields: ["confType","confName","optionName","isdefault"],
       proxy: {
                    type: 'ajax',
                    url:/*'groupGrid.json'*/rootPath+'servlet/midearest/gplm/wo/abroadOrderConf',
                    reader: {
                        type: 'json' , //返回数据类型为json格式
                      root: 'rows',  //数据(json格式)
                        totalProperty: 'total' //数据总条数
                    }
                },
      listeners:{
       load:function(store ,records ,options ){
        var grid = Ext.getCmp('boutineThreeGrid');
        com.midea.cto.comm.utils.mergeCells(grid,[2]);
       }
      }
     }),

 

2.公用方法

com.midea.cto.comm.utils.mergeCells = function(grid,cols){ 
    var arrayTr=document.getElementById(grid.getId()+"-body").firstChild.firstChild.firstChild.getElementsByTagName('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; 
            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!=cols[0]){  
                        var leftDisplay=arrayTd[col-2].style.display;//判断左边单元格值是否已display 
                        if(leftDisplay=='none') 
                            addf();  
                       else 
                            mergef();                            
                    }else 
                        addf();                                          
                }else 
                    mergef();            
            } 
        } 
    });  
};

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: