HTML
31일차//[html] html 입력 후 jsp 로 출력 <form> 태그
aesup
2021. 2. 24. 19:06
728x90
<form> 태그
개요
<form> 태그는 웹 페이지에서의 입력 양식을 의미합니다.
로그인 창이나, 회원가입 폼 등이 이에 해당되죠.
텍스트 필드에 글자를 입력하거나, 체크박스나 라디오 버튼을 클릭하고 제출 버튼을 누르면 백엔드 서버에 양식이 전달되어 정보를 처리하게 됩니다.
웹을 처음 개발하시는 분들은 이후 백엔드 공부를 진행할 때, <form> 태그에 대해서 다시 한번 공부함을 추천드리며 지금은 간단히 어떤 태그들이 있는지 알아보시기 바랍니다.
실제로 백엔드 코드와 함께 <form>을 사용하기 위해서는 다음 속성들이 사용됩니다.
- name: 폼의 이름
- action: 폼 데이터가 전송되는 백엔드 url
- method: 폼 전송 방식 (GET / POST)
- …
input
<form> 태그는 전체 양식을 의미하며, 화면에 보이지 않는 추상적인 태그입니다.
실제로 사용자가 양식을 입력하기 위한 태그는 <input> 태그 등이 사용됩니다.
type 속성을 통해 종류를 나타내며, name을 통해 데이터의 이름, value를 통해 기본 값을 지정합니다.
type
- text: 일반 문자
- password: 비밀번호
- button: 버튼
- submit: 양식 제출용 버튼
- reset: 양식 초기화용 버튼
- radio: 한개만 선택할 수 있는 컴포넌트
- checkbox: 다수를 선택할 수 있는 컴포넌트
- file: 파일 업로드
- hidden: 사용자에게 보이지 않는 숨은 요소
등의 유형이 있으며, HTML5에는 더 다양한 종류의 <input> 종류가 생겼습니다.
index1.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<form action = "NewFile.jsp">
이름 : <input type="text" name = "name">
<input type="submit" value = "제출">
</form>
</body>
</html>
NewFile.jsp
<%@ 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>
<body>
<%
//자바 코드를 쓸 수 있따
//java 영역
String name = request.getParameter("name");
System.out.println("name : " + name);
//dao,dto
%>
</body>
</html>
728x90