티스토리 뷰

 

 

 

button과 submit의 차이

 

 

submit은 button + submit의 기능을 한다. 그렇기 때문에 입력 받은 값을 제출하는 기능을 기본으로 가지고 있다.

반면에 button은 단지 버튼의 역할을 한다. 입력 받은 값을 제출하지 못하므로 따로 기능을 작성하여 설정해 주어야한다.

button은 html에서 js로 이동하여 if문을 실행하고 submit 기능을 따로 작성하기 때문에 submit 또한 js에서 함께 실행된다.

하지만 submit은 js 실행 후 submit을 실행하여 action을 실행한다.

 

 

 

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<script type="text/javascript">
	function checkLogin(){
		var form=document.loginForm;
		if(form.id.value == ""){
			alert("아이디를 입력해주세요.");
			form.id.focus();
			return false;
		}
		else if (form.passwd.value ==""){
			alert("비밀번호를 입력해주세요");
			form.passwd.focus();
			return false;
		}
		form.submit();
	}
</script>	
<body>
	<form name="loginForm" action="validation02_process.jsp" method="post" >
		<p> 아이디 : <input type="text" name="id">
		<p> 비밀번호 : <input type="password" name="passwd">
		<p> <input type="submit" value="전송" onclick="checkLogin()">
	</form>
</body>
</html>

 

type이 button일 경우 아이디를 입력하지 않으면 return false;이므로 남은 모든 코드를 취소시킨다.

이때 submit은 js 안에 있기 때문에 취소되어  submit되지않는다.

하지만 type을 submit으로 설정하는 경우를 살펴보면 return false가 되지않고 submit된 것을 볼 수 있다.

 

 

submit하여 return false를 실행했는데 불구하고 submit되어 value를 전달하는 것을 볼 수 있었다.

 

 

 

'코딩 > 오류 노트' 카테고리의 다른 글

[spring] properties 작성  (0) 2024.01.29
spring 한글 깨짐  (0) 2024.01.18
td 오류  (1) 2023.12.07
선언문 위치에 따른 차이점  (1) 2023.11.29
label 안의 img 파일 오류  (1) 2023.11.29
공지사항
최근에 올라온 글
최근에 달린 댓글
Total
Today
Yesterday