본문 바로가기
JavaScript, jQuery, Java

체크박스 상위 노드 찾기(2) - 중복체크 방지, 전체 선택, 전체 해제

by 보리하늘 2017. 12. 20.
728x90
반응형

체크박스 상위 노드 찾기(1)에서 만든 아래의 체크박스 트리에서

A, B, C 그룹 하나만 체크하고, 각 그룹마다 하나만 체크되게 해야할때







1
2
3
4
5
6
7
8
9
10
11
$(".TreePd input[name='chk_tree']").click(function(){
    var chkid = $(this).parents(".Tree_sTx").attr('value');
 
    if($(this).is(":checked"== true){      
          
        $("input[type=checkbox]").prop("checked",false);
        $(this).prop("checked",true);
        $("[value = '"+chkid+"']").prop('checked'true);
 
    }else $("input[type=checkbox]").prop("checked",false);
});
cs






체크된 개수를 가져와서 하나만 체크되게 할까도 생각했지만...

야매로... 무언가가 체크되면 함수로 들어와 상위 노드 그룹(A, B, C)만의 value 값을 받는다.

체크되었을때는 모두 풀고 해당 체크박스와 상위 체크박스를 체크


다시 눌러 체크 해제했을 경우 상위 노드 그룹의 체크를 해제해도 되고,

편하게 그냥 다 해제시킨다



야매말고 효율적이고 잘짠 코딩을 하고싶다... 





***전체 체크


$(' 체크박스 선택자 ').prop('checked', true);



***전체 해제


$(' 체크박스 선택자 ').prop('checked', false);





+ 추가 2017. 12. 20

each 함수를 사용하여 체크박스만 가져와 기존의 for 문과 같이 사용할 수 있다.

728x90
반응형

댓글