HTML input의 고유 정규식을 이용하면서 submit은 회피하는 방법 (onsubmit)

HTML5에서는 Input 자체에 정규식 검토 기능을 가지고 있으며 이를 이용하기 위해서는 input 객체들을 form 객체 내부에 정의한다.

실제 정규식 검사는 form 내부의 submit 객체를 클릭할 때 발생하는데, 이렇게 되면 javascript 함수를 이용해서 input 객체의 데이터를 제어할 수 없게 된다. 

javascipt 함수로 객체의 데이터를 제어하기 위해서는 submit 객체가 아닌 버튼 객체에 onclick() 함수를 통해 javascript 함수를 호출해야 하는데 이경우에는 Input 자체의 정규식 검토 기능이 실행되 않는다.

결론적으로 Input 객체의 자체 정규식 검사도 수행하면서 바로 submit되지 않고 javascript 함수를 호출하기 위해서는 form 선언 단계에서 onsubmit을 이용하면 된다.

<form class="form-horizontal" onsubmit="return myfuntion()">    ... Input 객체들 선언 ...    <button type="submit">전송</button> </form>

위와 같이 form을 선언하면 submit 버튼을 클릭하면 바로 전송되지 않고 myfunction()이 호출된다. 그리고 그 결과값이 true이면 전송되고, false이면 전송이 되지 않는다.

만약 myfunction() 내부에서 별도의 form과 input을 선언하여 데이터를 전송할 경우 myfunction()함수에서 false를 return해서 중복으로 request가 발생하지 않도록 해야 한다.