티스토리 뷰

카테고리 없음

[jQuery] 유동적인 테이블 셀병합 - rowspan

공부하는 나부랭이, 무중력고기 2018. 9. 11. 12:30


   위와 같이 소속에 같은 데이터가 있을 경우 하나의 셀로 병합해주는 코드다.


$(document).ready(function(e){
	genRowspan("td 클래스명");
});

function genRowspan(className){
	$("." + className).each(function() {
		var rows = $("." + className + ":contains('" + $(this).text() + "')");
		if (rows.length > 1) {
			rows.eq(0).attr("rowspan", rows.length);
			rows.not(":eq(0)").remove();
		}
	});
}


rowspan.html


댓글
  • ㅎㅎㅎ 와 감사합니다. 이것저것 찾아봤는데 이게 제일 잘 먹히고 간단하네요. 잘쓰겠습니다 2019.04.11 14:16
  • kim ㅠㅠ 테이블이 박살납니다 2019.11.01 10:31
  • BlogIcon QL 안녕하세요? 오래된 댓글이지만 혹시나 다른 분들도 같은 현상 겪으실 수 있으니 제 해결법을 답글로 남깁니다.

    제 경우는, 코드에 :contains 선택자가 쓰이는 바람에 특정 셀이 다른 셀의 텍스트를 포함하는 경우(예: '12번째'와 '2번째')에 수가 같이 세어지면서 문제가 됐더라고요.

    시행착오 끝에, 7번째 줄을 다음과 같이 고쳐서 해결했습니다.
    var curr = $(this).text();
    var rows = $("." + className).filter(function() {
    return $(this).text() == curr;
    });
    2021.06.08 18:57
  • BlogIcon 910F 안녕하세요 좋은 팁 감사합니다.

    기록용으로 자료 출처 표기 후 담아가도 될까요?
    불허시 말씀해주시면 즉시 삭제처리하겠습니다.

    좋은 하루 보내세요 감사합니다~
    2021.07.22 10:23 신고
댓글쓰기 폼
Total
1,776,722
Today
34
Yesterday
517
«   2021/08   »
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31        
글 보관함