[javascript] 테이블 셀 병합 (jQuery)

[javascript] 테이블 셀 병합 (jQuery)

---

/* 
 * 
 * 같은 값이 있는 열을 병합함
 * 
 * 사용법 : $('#테이블 ID').rowspan(0);
 * 
 */     
$.fn.rowspan = function(colIdx, isStats) {       
    return this.each(function(){      
        var that;     
        $('tr', this).each(function(row) {      
            $('td:eq('+colIdx+')', this).filter(':visible').each(function(col) {
                
                if ($(this).html() == $(that).html()
                    && (!isStats 
                            || isStats && $(this).prev().html() == $(that).prev().html()
                            )
                    ) {            
                    rowspan = $(that).attr("rowspan") || 1;
                    rowspan = Number(rowspan)+1;
 
                    $(that).attr("rowspan",rowspan);
                    
                    // do your action for the colspan cell here            
                    $(this).hide();
                    
                    //$(this).remove(); 
                    // do your action for the old cell here
                    
                } else {            
                    that = this;         
                }          
                
                // set the that if not already set
                that = (that == null) ? this : that;      
            });     
        });    
    });  
}; 
 
 
/* 
 * 
 * 같은 값이 있는 행을 병합함
 * 
 * 사용법 : $('#테이블 ID').colspan (0);
 * 
 */   
$.fn.colspan = function(rowIdx) {
    return this.each(function(){
        
        var that;
        $('tr', this).filter(":eq("+rowIdx+")").each(function(row) {
            $(this).find('th').filter(':visible').each(function(col) {
                if ($(this).html() == $(that).html()) {
                    colspan = $(that).attr("colSpan") || 1;
                    colspan = Number(colspan)+1;
                    
                    $(that).attr("colSpan",colspan);
                    $(this).hide(); // .remove();
                } else {
                    that = this;
                }
                
                // set the that if not already set
                that = (that == null) ? this : that;
                
            });
        });
    });
}

 

출처

http://shuiky.tistory.com/entry/jQuery%EB%A5%BC-%EC%9D%B4%EC%9A%A9%ED%95%9C-%ED%85%8C%EC%9D%B4%EB%B8%94-%EC%85%80%EB%B3%91%ED%95%A9

jQuery를 이용한 테이블 셀병합 - 통계 등