** form 에서 선언된 배열을 자바스크립트에서 검증하는 법에 대한 내용입니다.. " 그걸 이제 알았냐 ~! 다 아는 예기다 " 라고 하실분들은 읽지 않으셔도 됩니다. *****
** 정답만 보시려면 맨 아래쪽 소스만 보시면 되요 *****
** 공부를 하실분은 모두 읽으셔야 하구요 *****
◆ 바뻐서 다 읽기 힘든분을 위한 핵심 요약 ◆
form에서 name=abc[] 식으로 배열로 선언했어도 JavaScript에서 접근은 "abc[]" 문자열로 접근할 것..,
요약끝...
많은 분들이 form 객체에서 선언한 배열을 JavaScript와 PHP에서 함께 사용하기를 원합니다.
form에서는 같은 이름을 여러번 선언하면 배열로 선언되지만 이상하게 Submit으로 넘기면 PHP에서는 배열이 사라집니다.
<input type=text name=abc>
<input type=text name=abc>
<input type=text name=abc>
위처럼 form에서 선언하면 JavaScript 내에서 document.form.abc[2].value 식의 배열로 이상없이 접근이 되는데, php에서는 $abc 라는 단일변수로만 넘어오게됩니다.
그래서 또다시 아래와같이 선언해 봅니다.
<input type=text name=abc[]>
<input type=text name=abc[]>
<input type=text name=abc[]>
위처럼 선언하면 PHP 쪽에서는 $abc[2] 식으로 배열접근이 가능하게 됩니다.
그러나 이번에는 자바스크립트에서 접근이 안되게 됩니다.
document.form.abc[2].value <- 실패
document.form.abc.value <- 실패
document.form.abc[][2].value <- 실패
이유가 뭘까요?
원인은 form 문에서는 애시당초 배열선언이 없기때문입니다.
그냥 같은 이름을 여러번 선언한 것이 배열이 될 뿐입니다.
<input type=text name=abc[]>
<input type=text name=abc[]>
<input type=text name=abc[]>
위 선언은 마치 배열을 선언한듯 하지만 사실을 배열이 아닙니다.
단순히 name="abc[]" 라는 문자열로 인식될 뿐입니다.
<input type=text name=abc[0][]>
<input type=text name=abc[][][][][]>
<input type=text name=abc[2][3]>
어떻게 선언하더라도 배열이 생성되지 않음을 유의하십시요..
그렇다면 이렇게 선언한것과 abc[] 로 선언한 것이 똑 같나요?
<input type=text name=abcde>
<input type=text name=abcde>
<input type=text name=abcde>
그렇습니다. 그 어떤 선언을 하더라도 form객체 자체는 배열로 선언되지 않습니다, 단순 문자열로만 선언될 뿐입니다..
다만 JavaScript 쪽에서 같은 이름이 중복되면 그 때 배열로 접근이 됩니다. 그리고 문자열에 [] 가 포함되면 접근할때 차이가 있습니다.
document.form.객체이름[2].value 식으로 접근을 해야 하는데 "abc[]" 로 선언한 것과 "abcde"로 선언한 것을 똑같이 표현하면 아래와같이 될 것입니다.
document.form.abc[][2].value
document.form.abcde[2].value
그러나 abc[][2] 는 자바스크립트에서 잘못 해석하여 2차원배열로 간주하게 됩니다.
바로 그것 때문에 서로 호환이 안되는 것입니다.
그것을 극복하려면 자바스크립트쪽에 문자열임을 알 수 있도록 조치를 해주어야 합니다.
document.form["abcde"][2].value
이렇게 해 주듯이 abc[] 역시 아래처럼 해 줍니다.
document.form["abc[]"][2].value
아래는 지금 설명을 검증하는 소스입니다.
-------- test.php ---------------------
<?
echo "JavaScript로 조립된 문자열 = $fulltel <br>";
echo "PHP로 새로 조립된 문자열 = ($tel[0]) $tel[1] - $tel[2] <br>";
?>
<html>
<script language=JavaScript>
function check_submit() {
// "tel[]" 은 배열이 아님을 유의하세요.....
for( var i = 0; i < 3; i ++ ) {
if( ! document.test["tel[]"][i].value ) {
alert(!"뭐가 빠져짜나~!");
document.test["tel[]"][i].focus();
return false;
}
}
x = document.test["tel[]"];
document.test.fulltel.value = x[0].value + "-" + x[1].value + "-" + x[2].value;
return true;
}
</script>
<body>
<form name=test action=<?=$PHP_SELF?> onsubmit="return check_submit();">
<input type=hidden name=fulltel>
<input type=text name=tel[]>-<input type=text name=tel[]>-<input type=text name=tel[]><input type=submit value="눌러">
</form>
</body>
</html>
출처 : http://www.phpschool.com/bbs2/inc_view.html?id=4552&code=tnt2&start=30&mode=search&s_que=form&field=title&operator=and&period=all
댓글 없음:
댓글 쓰기