jQuery 전체 체크박스 체크

전체 체크박스 클릭시 모든 체크박스에 체크되게 끔 해놓았는데 놓친 부분이 있었다!

체크박스 하나씩 모두 클릭해도 전체 체크박스에 체크되도록 하는거랑...

전체 체크된 상태에서 하나라도 체크 해제하면 전체 체크박스도 해제 시켜주는것!

 

그림으로 표현하자면..

전체 체크 후 하나 체크 해제해도 전체 체크박스는 그대로 체크상태 유지, 또는 하나씩 체크박스를 다 체크하면 전체체크박스는 해제된 상태.

전체 체크박스

<input type="checkbox" class="form-check-input secondary" id="contact-check-all"> 

 

각각의 체크박스 소스

<input type="checkbox" class="form-check" name="check_member[]" id="check_member_숫자 value="숫자">

 

//name이  check_member[]인 인풋요소를 클릭했을 때 이벤트 처리.

//체크된 체크박스랑 화면에 있는 모든 체크박스 갯수 비교했을 때 다르면 모두 체크가 안되어 있다는 거니까

//전체 체크박스 체크를 해제시킨다!

$('input[name="check_member[]"]').on('click',function(){

    if($('input[name="check_member[]"]:checked').length != $('input[name="check_member[]"]').length){
        $('#contact-check-all').prop('checked',false);
    }else{
        $('#contact-check-all').prop('checked',true);
    }
});