절대 하지 말아야할 frm.submit()

하나의 form은 하나의 submit 버튼을 가진다. 당연히 가져야 한다.

form을 사용했다는것 자체가 어떠한 폼값을 전송하겠다는 것이기 때문이다.


물론 2개 이상 억지로 넣겠다면 넣을수 있겠지만

일반적으로 하나의 폼에는 하나의 submit 버튼이다.


회원가입폼에는 회원가입버튼

글쓰기 폼에는 글쓰기 버튼


이때 그 버튼의 사용에 있어서

<input type="image"

혹은

<input type="submit"

을 써야함이 당연하다.

이미지로 만든 버튼일 경우에는 <input type="image" 를 쓰면되고

그렇지 않은 일반적인 버튼을 사용할경우에는 <input type="submit"을 쓰면 된다.


이러한 버튼을 사용할때의 가장큰 장점은

자바스크립트로 submit() 메소드를 실행하지 않더라도

버튼을 클릭하거나 입력폼에서 엔터키를 누르면

자동적으로 submit()이 실행된다.

한마디로 추가적인 코딩이 필요없다 이거다.


그런데 이걸 꼭 그냥

<a href="javascript:submitForm()"><img src="send.gif" alt="전송"></a>

function submitForm(){
    document.frm.submit();
}

function enterForm(){
   if(event.keyCode == 13){
       document.frm.submit()
   }
}

이렇게 만드는 사람이 있다.


위의 코드는 틀린데가 한두군데가 아니다. 뭐 다틀렸다.

일단 자바스크립트가 없으면 submit을 할수가 없으며
또한 enter키를 누르면 submit되게 하기 위해 추가적인 스크립트가 필요하다.
또한 위의 enterForm() 함수를 사용하면 IE에서만 정상적으로 작동한다.
FF는 event 객체를 이벤트 발생시 인자로 받아서 써야 한다.
또한 name에 의한 접근은 사용하면 안되고 이왕이면 document.getElementById를 사용하자.
그리고 a 태그의 href 속성값에 javascript:함수명 이런식으로 사용하지 말고
굳이 이렇게 사용해야하는 경우에는 href값에 이걸 넣지 말고
onclick 이벤트에 함수명만 심플하게 넣도록 하자.



참 이렇게 하기도 어려울텐데 라는 생각이 든다. 이런 발상자체를 해낸것 조차 대단하다.

개발자들이 이런 코드를 산출해 내는 가장 큰 이유는

일단은 웹표준을 잘 모른다는게 그 첫번째 이유고

두번재는 웹퍼블리셔가 submit버튼을 그냥 이미지에 링크건채로 HTML 산출물을 준다는데도 이유가 있다.

웹퍼블리셔는 반드시 공부해서 훌륭한 산출물을 전해주도록 노력하고

잘 모르는 개발자를 설득할수 있도록 하자.




한가지 아쉬운점은 티스토리에서도 검색폼에

onkeypress="if (event.keyCode == 13) { try{window.location.href='/search/' + document.getElementsByName('search')[0].value.replaceAll('%', '%25'); return false;}catch(e){} }"

onkeypress 이벤트가 이렇게 되어있다.

자바스크립트가 꺼진 상태에서는 검색을 못하는 상황.

어서 고쳐졌으면 하는 바이다.