비동기로 조회해야 하는데 자꾸 submit이 된다

[이슈]

form 에서 조건을 들고 비동기 조회를 해야 하는 상황.

화면이 새로고침 되면 안됨.

 

검색 버튼을 클릭하면 submit 말고 비동기 조회 함수를 실행한다.

 

그런데 keyup에 클릭에서 쓰는 비동기 조회 함수를 넣었는데도

input에 값을 넣고 엔터를 치면 form이 submit을 해버려서 자꾸 화면이 새로고침 된다.

 

~

 

[원인]

HTML 2.0부터, form 태그 앞에 input 이 하나만 있는 경우, 사용자가 엔터 키를 누르면

해당 form이 자동으로 submit 되도록 설계됨.

 

~

 

[그래서?]

1. form 태그에 onsubmit="return false" 를 추가하거나

<form onsubmit="return false">

 

2. form 태그 안에 input 을 2개 이상 둔다. 1개만 필요하다면 나머지 1개는 보이지 않게.

<form>
  <input name="tada" />
  <input name="hide" style="display:none;" />
</form>