[자바스크립트] 멀티 라디오 버튼 접근법
위와 같이 여러줄의 다중 라디오 버튼 상황에서 한줄의 값만
다음 페이지로 submit 하고 싶다면 넘길 방법이 마땅치 않다.
아래의 예제 코드를 보면 재밌는 전송이 가능하다.
라디오 버튼을 다루는 방법을 이해하게 될 것이다.
(위의 테이블에 대한 html 코드 이다.)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=EUC-KR">
<title>Insert title here</title>
<script src="./js/jquery-1.4.4.min.js"></script>
<script>
function multiRadio(rowNum,idx){
var frm = document.multiForm;
var radio = frm["r"+rowNum];
//이렇게 접근 하면 몇번째 줄의 라디오 버튼인지 쉽게 찾을 수 있다
if(radio[0].checked==true){
frm.r.value=radio[0].value;
//0번째가 첫번째 Y 인 라디오 버튼이므로
}
if(radio[1].checked==true){
frm.r.value=radio[1].value;
//1번째가 두번째 N 인 라이도 버튼이므로
}
frm.idx.value=idx;
}
</script>
</head>
<body>
<form name="multiForm">
<input type="text" name="idx"></input>
<input type="text" name="r"></input>
<table border="1">
<tr>
<td>
1111
</td>
<td>
Y
<input type="radio" name="r1" value="Y"></input>
N
<input type="radio" name="r1" value="N"></input>
<input type="button" value="전송" onclick="multiRadio('1','1111')"></input>
</td>
</tr>
<tr>
<td>
2222
</td>
<td>
Y
<input type="radio" name="r2" value="Y"></input>
N
<input type="radio" name="r2" value="N"></input>
<input type="button" value="전송" onclick="multiRadio('2','2222')"></input>
</td>
</tr>
<tr>
<td>
3333
</td>
<td>
Y
<input type="radio" name="r3" value="Y"></input>
N
<input type="radio" name="r3" value="N"></input>
<input type="button" value="전송" onclick="multiRadio('3','3333')"></input>
</td>
</tr>
</table>
</form>
</body>
</html>