10주차 - jsp (14) <form>
2022. 9. 13. 17:24ㆍjsp/html
이번의 목표
01. <form> 태그의 action 속성을 알아보자
02. <form> 태그의 method 속성을 알아보자.
jsp (13) <input> 에서 type="submit" 을 할 때에는 데이터를 전송하는 기능을 수행한다 했습니다.
이때에 데이터를 전송받을 목적지가 없기 때문에 전송된 데이터는 저장되지 않고 사라집니다.
그렇기 때문에 유저에게 입력받은 데이터를 서버로 전달하기 위해서는 <form> 태그의 action 속성을 이용합니다.
그리고 이때에 method 속성을 이용하여 데이터 전송시에 전달될 정보가 url에 나올지도 구분을 할 수있습니다.
get 형식은 url에 전송될 정보가 포함되고 post 형식은 url로는 확인할 수 없습니다.
둘다 암호화 되어 전송되는 것은 아니기에 보안성이 좋은 것은 아니지만 굳이 고르자면 post형식이 더 안전하다 할 수 있습니다.
코드는 jsp(13)에서 사용한 코드와 동일하나, <form> 태그가 추가 되었습니다.
01. jsp 코드
02. 실행 화면
01. jsp 코드
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ex15</title>
</head>
<body>
<form action="ex16.jsp" method="post"><!-- 서버측에 데이터를 전달을 하기 위한 태그 -->
<input type="button" value="클릭만 하는 버튼"><br>
<input type="reset" value="입력한 데이터를 삭제하는 버튼"><br> <!-- 같은 form 태그 안에 있는 데이터를 지운다 -->
<input type="submit" value="데이터를 전송하는 버튼"><br><br>
<input type="checkbox" value="멍때리기">
<input type="checkbox" value="침대에서 오래버티기"><br>
<input type="radio" value="왼쪽" name="radioName">
<input type="radio" value="오른쪽" name="radioName"><br><br>
<!-- radio에서 name을 같게 설정해주면 같은 name 안의 radio 들은 중복 선택이 되지 않는다. -->
<input type="file"><br>
<input type="email" placeholder="이메일 입력"><br>
<!-- 입력한 데이터가 이메일 형식이 맞는지 자동으로 검증을 해준다 -->
<input type="password" placeholder="비밀번호 입력" name="pw"><br>
<input type="text" placeholder="일반 데이터 입력" name="id"><br>
</form>
</body>
</html>02. 실행 화면
'jsp > html' 카테고리의 다른 글
| 11주차 - jsp (16) <fieldset>, <textarea>, <select> (0) | 2022.09.13 |
|---|---|
| 10주차 - jsp(15) scriptlet(스크립트릿), request, response (0) | 2022.09.13 |
| 10주차 - jsp (13) <input> (0) | 2022.09.13 |
| 10주차 - jsp (12) <caption> (0) | 2022.09.08 |
| 10주차 - jsp (11) rowspan, colspan (0) | 2022.09.08 |