본문 바로가기
Stack Overflow/스프링

[스프링] 체크박스 한번에 모든 것을 disabled 구분하면서 선택, 해제하기

by Lich King 2022. 1. 29.

하기는 체크박스를 한번에 선택하고 해제할 수 있는 예제 소스 코드 입니다.
소스 내용을 간단히 설명하자면 다음과 같다.

 

1. HTML

<input type="checkbox" name="checkboxAll" id="checkboxAll">
<input type="checkbox" name="checkboxUnit" id="checkboxUnit">

name = "checkboxAll" : 모든 체크박스 선택, 해제하는 체크박스
name = "checkboxUnit" : 각각의 체크박스

 

2. JAVASCRIPT

$(document).ready(function() {
	$("input[name=checkboxAll]").click(function(){
		var chk = $(this).is(":checked");
		if(chk){
			$("input[name='checkboxUnit']").each(function() { 
		    	var checkBoxOpt = $(this).prop("disabled");  
		        if(!checkBoxOpt){ 
		        	$(this).attr("checked", true);
		        }
			});
		}else{
			$("input[name='checkboxUnit']").attr("checked", false);
		}
	});
});

상기와 같이 구현하면 끝난다. 간단하다.

댓글