폼 재전송 방지

엔터나 submit 버튼 등을 연달아 눌렀을 때(실제로 자주 발생합니다)
form이 연속으로 재전송되는 경우가 간혹 있습니다.
자바스크립트에서 전역 변수를 플래그로 사용하여
재전송을 방지하는 팁이 있습니다만..
form 객체의 [submitted] property를 이용하면 훨씬 깔끔하게 해결이 되는군요.
아래 예제 코드를 보시면 쉽게 이해가 가실 겁니다.


<SCRIPT language="javascript">
function formCheck(FORM)
{
    if (FORM.submitted) return false;   <-- ①
    // 입력 값 체크 루틴
    FORM.action = 'operation.jsp';
    FORM.method = 'POST';
    FORM.submitted = true;    <-- ②
    return true;
}
</SCRIPT>   


<FORM name="SomeForm" onSubmit="return formCheck(this)">
<INPUT type="TEXT" name="input1"/>
<INPUT type="SUBMIT"/>
</FORM>

로컬에 저장한 상태에서 실행하면..
반응속도가 워낙 빨라서 테스트에 아무런 의미가 없습니다.
로컬에선 아무리 엔터를 빨리 눌러도 처음 누른 엔터에 대한 반응이 즉각적으로
처리되므로 폼 재전송의 문제가 거의 발생하지 않습니다.
(아주 저사양의 시스템이라면 결과가 다를지도 모르겠습니다.)

제가 언급한 폼 재전송의 문제는 네트워크 지연에 의해
서버측 폼처리 파일의 반응시간이 늦어지는 동안
사용자측의 실수나 부주의로 인해 또 다른 서브밋이 요청되는 상황을 가리킵니다.
로컬에선 거의 이런 문제가 발생하지 않습니다.

저도 뒤늦게 안 사실인데 FORM.submitted는 form 객체의 명세화된 프로퍼티가 아니라
사용자변수로서 작동하는 거더군요. MSIE의 경우 FORM.submit으로 바꾸어서
테스트해보아도 잘 동작하더군요. Netscape에선 form 객체의 submit() 메쏘드와
네이밍 충돌 문제가 발생했군요.

질문하신 분의 "undefined"가 메시지가 나오는 것은
제가 적은 샘플코드의 ②번 라인이 실행되지 않았기 때문이겠지요.
아래 코드를 파일명 상관없이 서버에 올려놓고 테스트해보세요.


<SCRIPT language="javascript">
function formCheck(FORM)
{
    if (FORM.submitted) {
      alert("FORM.submitted = " + FORM.submitted);
      return false;
    }
    // 입력 값 체크 루틴
    FORM.action = location.pathname;
    FORM.method = 'GET';
    FORM.submitted = true;
    return true;
}
if (location.search.match(/input1/)) {
  document.write("location => " + location.href + "<BR/>");
}
</SCRIPT>


<FORM name="SomeForm" onSubmit="return formCheck(this)">
<INPUT type="TEXT" name="input1"/>
<INPUT type="SUBMIT"/>
</FORM>