게시판 글쓰기 만들기
지금까지 리스트로 나온 내용은 내가 게시판에 직접 글을 쓴 게 아니라, DB에 있는 내용을 가져온 것이었다.
이번에는 게시판의 글쓰기 버튼을 통해 글 제목, 내용들을 직접 써서 목록에 나타내는 내용이다.
순서
1. 글쓰기 버튼 만들기 : 우선 리스트 페이지에 '글쓰기'라는 버튼을 만든다.
2. 글을 쓸 수 있는 폼 만들기 : '글쓰기'버튼을 누르면 글을 쓸 수 있는 폼으로 이동한다(폼 페이지가 필요)
3. 글을 쓰면 그 글이 데이터베이스의 board 내용 / 게시판 리스트에 반영되어야 한다.
4. 글을 쓰면 목록으로 이동한다.
1. 글쓰기 버튼 및 폼 만들기
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 | <body> <table border="1"> <tr> <th>글번호</th> <th>작성자</th> <th>제목</th> <th>작성시간</th> </tr> <c:forEach items="${list}" var="data"> <tr> <td>${data.num}</td> <td>${data.writer}</td> <td><a href="/boardRead?num=${data.num}">${data.title}</a></td> <td><fmt:formatDate pattern="yyyy-MM-dd HH:mm" value="${data.regdate}"/></td> </tr> </c:forEach> </table> <button type="button" onclick="location.href='boardWriteForm'">글쓰기</button> <ul class="paging"> <c:if test="${paging.prev}"> <span><a href='<c:url value="/boardList?page=${paging.startPage-1}"/>'>이전</a></span> </c:if> <c:forEach begin="${paging.startPage}" end="${paging.endPage}" var="num"> <span><a href='<c:url value="/boardList?page=${num}"/>'>${num}</a></span> </c:forEach> <c:if test="${paging.next && paging.endPage>0}"> <span><a href='<c:url value="/boardList?page=${paging.endPage+1}"/>'>다음</a></span> </c:if> </ul> </body> | cs |
지금까지 넣은 내용은 게시판 테이블 틀 + 페이징 처리였고
table 소스 밑에 글쓰기 버튼을 만들어준다.
onclick="location.href"은 버튼에 링크를 거는 소스로 boardWriteForm으로 이동하게 되면
contoller가 /boardWriteForm을 인식해서 jsp로 건너가게 된다.
Boardcontroller
1 2 3 4 5 | // 게시판 글쓰기 폼 @RequestMapping("/boardWriteForm") public String boardWriteForm() throws Exception { return "boardWriteForm"; } | cs |
boardWriteForm.jsp
1 2 3 4 5 6 7 | <h2>[게시판 글쓰기]</h2> <form action='<c:url value='/boardWrite'/>' method="post"> <div>작성자<input type="text" name="writer"></div> <div>제목<input type="text" name="title"></div> <div>내용<textarea rows="5" cols="13" name="content"></textarea></div> <button type="submit">완료</button> <button type="button" onclick="location.href='boardList'">목록</button> </form> | cs |
이 부분이 중요한데,
form에서 post로 사용되었다는 것은 입력한 내용이 주소로 노출되지 않고 전송된다는 의미이고
(보통 로그인, 회원가입등에 많이 사용)
name이라는 요소에 들어간 writer, title, content은
폼의 각 내용을 고유하게 식별할 수 있는 요소로 사용된다.
이름은 마음대로 설정하는 것이 아니라 BoardVO클래스의 멤버변수 이름이 일치해야
알아서 바인딩 해준다.
즉, form name == DB board == BoardVO 모두 일치해야 한다.
submit는 완료 버튼을 누르면 해당 폼에서 작성된 내용이 전송된다는 의미이다.
action 속성은 폼의 데이터를 서버로 보낼 때 해당 데이터가 도착할 곳을 지정하는 것인데
/boardWrite 라고 썼으므로 controller가 @RequestMapping된 /boardWrite를 찾게 된다.
(참고 내용 : https://yulfsong.tistory.com/63)
2. boardWrite에 대한 코드 작성
BoardController
1 2 3 4 5 6 7 8 9 10 11 12 13 | // 게시판 글쓰기 폼 @RequestMapping("/boardWriteForm") public String boardWriteForm() throws Exception { return "boardWriteForm"; } // 게시판 글쓰기 @RequestMapping(value="/boardWrite") public String boardWrite(BoardVO boardVO) throws Exception { boardService.boardWrite(boardVO); return "redirect:boardList"; } | cs |
위에서 알아서 바인딩 해준다는 부분은 이 부분에서 이루어진다.
BoardService
1 2 3 4 | // 게시판 글쓰기 public void boardWrite(BoardVO boardVO) throws Exception { boardMapper.boardWrite(boardVO); } | cs |
BoardMapper
1 2 | // 게시판 글쓰기 public void boardWrite(BoardVO boardVO) throws Exception; | cs |
BoardMapper.xml
1 2 3 4 | <insert id="boardWrite"> INSERT INTO hello_board (title, content, writer) VALUES (#{title}, #{content}, #{writer}) </insert> | cs |
전체적인 완성작은 해당 소스를 참고
github.com/yulfsong/spring-boot-hello-project
github.com
'프로그래밍 > SpringBoot' 카테고리의 다른 글
| [스프링 부트 게시판] 게시글 수정 만들기 (0) | 2020.09.30 |
|---|---|
| [스프링 부트 게시판] 게시글 읽기 만들기 (0) | 2020.09.30 |
| [스프링 부트 게시판] 게시판 리스트 페이징 처리 (0) | 2020.09.30 |
| [스프링 부트 게시판] 게시판 리스트 만들기 (0) | 2020.09.30 |
| [스프링 부트 게시판] 로그 설정하기 (0) | 2020.09.25 |
