[jQuery] jquery form submit()

jquery에서 form 전송에 대해 알아보겠습니다.

jquery form 전송은 간단하게 submit() 함수를 호출하여 전송이 가능합니다.

- html 

<form name="testForm" id="login">
    <input type="text" id="id"/>
    <input type="text" id="pw"/>
    <input type="submit"/>
</form>
<hr/>
<button id="btn">전송</button>

- javascript 

	
$(document).ready(function() {
    $("form").submit(function(event) {
  	var id = $('#id').val();
    var pw = $('#pw').val();
    
   	if (id != "" && pw != "") {
    	alert("id :: " + id + ", pw :: " + pw);
    }
    
    if (id == "") {
    	alert("id를 입력해주세요.");
    	event.preventDefault();
      return;
    }
    
    if (pw == "") {
    	alert("pw를 입력해주세요.");
    	event.preventDefault();
      return;
    }   
  });
  
  $('#btn').click(function () {
  	$("form").submit();
  });
});

<form></form> 내부의 type="submit" 의 input DOM을 두고 form 전송 이벤트를 구현할 수 있다.

별도의 전송 버튼을 이용하여 폼을 전송하고 싶을 때는 버튼을 만들고 $("form").submit() 을 바로 호출하면 버튼을 이용한 전송도 가능하다.

- 예제 : 이동