input checkbox 하나만 선택하도록 하기

input checkbox 하나만 선택하도록 하기

input의 type=checkbox인 체크박스를 다중선택이 아니라 단일선택만 가능하도록 하기

1. jsp에서 checkbox로 이용할 input태그에 onclick이벤트를 걸어줌

*onclick 이벤트의 이름을 clickOnlyOne이라고 지었고, (this)라는건 이 태그를 매개변수로 이용한다는 것

${student.student_name}

2. jsp의 스크립트 태그에서 자바스크립트코드를 사용해서 function만들어줌.

3. function이름을 input태그에서 onclick에 넣었던 것과 일치시키고 ( )괄호안에는 아무거나 적어도 됨.

4. 체크박스의 값을 true,false로 조절할 수 있도록 student_name이라는 이름을가진 객체를 checkboxes라고 이름지어만듦.

5. forEach를 이용해서 모든 체크박스에 checked상태인 것들을 모두 false 상태(=체크해제)시킴

6. 그리고나서 매개변수였던 itself (즉, this 또는 눌렸던 해당체크박스)만 checked상태 true로 만든다.

* 매개변수로 칭해졌던 itself는 위에 바디태그에서 input태그의 onclick() 의 괄호안에있던 this <-선택된 애를 말함

function clickOnlyOne(itself){ const checkboxes = document.getElementsByName("student_name"); checkboxes.forEach((checkbox) =>{ checkbox.checked =false; }) itself.checked = true; }

from http://moonday.tistory.com/239 by ccl(A) rewrite - 2021-09-19 21:27:21