본문 바로가기

JAVA개발

[JAVA 개발] 체크박스 전체선택/해제 및 체크여부확인

먼저 기본 샘플 페이지 작성을 위해 Controller에 소스 입력을 해줍니다.

@RequestMapping("/checktest")
	public String checktest(){
		
		return "checktest";
	}

checktest라는 페이지를 생성하였습니다.

checktest.jsp페이지 에서 jquery를 사용하기 위해title 밑에

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/jquery/1.9.0/jquery.js"></script>

소스를 기재해줍니다.

전제체크를 위한 스크립트를 작성합니다.


body부분 샘플 소스를 작성합니다.

전체체크 :
체크4
체크3
체크2
체크1

전체 체크에 대한 소스는 모두 작성하였습니다.

테스트 시에는 정상적으로 작동이 되는것을 확인할수 있습니다. 

이제 체크버튼 체크 유무를 확인해 보는 소스를 작성하도록 하겠습니다.

body부분에 전체 체크 버튼 옆에 버튼을 하나 추가하도록 하겠습니다.

전체체크 : <input type="checkbox" id="chkall" /><input type="button" name="chkok" id="chkok" value="처리" />

스크립트 부분은 chkok부분소스를 추가해 줍니다.


모든 소스가 작성되었습니다. 테스트시 정상적으로 작동되는지 확인해 보겠습니다.

체크를 하지 않고 처리버튼을 클릭했을때 

 체크선택을 1개이상 체크후 처리 버튼을 클릭했을때

 전체체크후 처리 버튼을 클릭했을때

정상적으로 처리가 이루어집니다~

감사합니다^^