위와 같이 여러줄의 다중 라디오 버튼 상황에서 한줄의 값만
다음 페이지로 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>
댓글