1. HTML 코드 중에서 데이터를 어디서 받는지 확인하기
여기서는 데이터를 받는 것이 input 태그랑 textarea 태그 2개가 있다.
2. form 태그로 감싸주기
input 태그랑 textarea 태그를 form 태그로 감싸줘야한다.
이동할 때는 줄 클릭한 후에 Ctrl + Shift + ↑ /↓ 누르면 쉽게 이동할 수 있다.
2. form에 action 만들기
action은 이 데이터들을 어디로 보내줄지 url 적어주기
우리는 localhost:8080/board/writdo에 보내줄 것이다.
3. method 설정
method = "post"
method는 post 방식을 선택할 것이다.
4. 이름적기, 타입선언
input / textarea 이름을 적어준다
name = "title"
name = "content"
버튼 타입을 지정해준다.
type = "submit"
submit은 전송할 때 사용해주는 것
5. 최종 설명
submit 버튼을 눌렀을 때,
form 안에 있는 input / textarea 2가지 데이터가
"/board/writedo"라는 주소로 넘어가게 된다.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>게시물 작성 폼</title>
</head>
<style>
.layout{
width : 500px;
margin : 0 auto;
margin-top : 40px;
}
.layout input, textarea {
width : 100%;
box-sizing : border-box
margin-top : 10px;
}
.layout > textarea {
width : 100%;
margin-top : 10px;
min-height : 300px;
}
</style>
<body>
<div class = "layout">
<!-- action은 이 데이터들을 어디로 보내줄거냐-->
<form action="/board/writepro" method="post">
<input name="title" type="text">
<textarea name="content"> </textarea>
<!-- 이 버튼의 역할은 데이터를 전송하는 역할을 한다-->
<button type="submit"> 작성 </button>
</form>
</div>
</body>
</html>