Spring legacy 프로젝트 게시판 만들기(7) - 작성(INSERT)
Spring legacy 프로젝트 게시판 만들기(6) - 검색
Spring legacy 프로젝트 게시판 만들기(5) - 게시판 페이징 view Spring legacy 프로젝트 게시판 만들기(5) - 게시판 페이징 Spring legacy 프로젝트 게시판 만들기(4) - 수정하기 Spring legacy 프로젝트 게시판..
cronex.tistory.com
이어서 페이징 위에 글쓰기 버튼을 만들어서 작성을 할 수 있도록 하겠습니다. table과 페이징 div 사이에 버튼을 만들겠습니다.
-board.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!-- taglib 추가 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>페이징 게시판</title>
<style type="text/css">
.table>tbody tr:hover {
background: rgb(200, 200, 200);
cursor: pointer;
}
.table tr {
border-bottom: 1px solid #999;
}
.table {
padding: 30px;
margin: 0px auto;
font-size: 20px;
font-weight: normal;
}
.table thead {
border-top: 2px solid #666;
}
</style>
</head>
<body>
<jsp:include page="../common/sidebar.jsp" />
<div class="content">
<div style="padding-top : 100px;">
<table class="table"
style="border-collapse: collapse; width: 1200px; text-align: center;">
<colgroup>
<col width="15%">
<col width="20%">
<col width="40%">
<col width="15%">
</colgroup>
<thead>
<tr>
<th>번호</th>
<th>제목</th>
<th>작성자</th>
<th>작성일</th>
<tr>
</thead>
<tbody class="board-tbody">
<!-- forEach로 변경된 body부분 -->
<c:forEach items="${requestScope.list}" var="board">
<tr>
<td>${board.board_id}</td>
<td>${board.board_title}</td>
<td>${board.board_writer}</td>
<td>${board.board_date}</td>
</tr>
</c:forEach>
</tbody>
</table>
<!-- 글쓰기 버튼 -->
<div style="text-align:right; padding-right :10%; margin-top : 20px;">
<button id="write">글쓰기</button>
</div>
<!-- 페이징 -->
<div style="text-align: center; margin-top: 30px;">
<c:choose>
<c:when test="${empty requestScope.searchValue}"> <!-- 1 -->
<button id="startPage"><<</button> <!-- 2 -->
<c:if test="${requestScope.pageInfo.pageNo <= 1}"> <!-- 3 -->
<button disabled><</button>
</c:if>
<c:if test="${requestScope.pageInfo.pageNo > 1}"> <!-- 4 -->
<button id="prevPage"><</button>
</c:if>
<c:forEach var="p" begin="${requestScope.pageInfo.startPage}"
end="${requestScope.pageInfo.endPage}" step="1"> <!-- 5 -->
<c:if test="${requestScope.pageInfo.pageNo eq p}"> <!-- 6 -->
<button disabled>
<c:out value="${p}"></c:out>
</button>
</c:if>
<c:if test="${requestScope.pageInfo.pageNo ne p}"> <!-- 7 -->
<button class="paging-button">
<c:out value="${p}"></c:out>
</button>
</c:if>
</c:forEach>
<c:if
test="${requestScope.pageInfo.pageNo >= requestScope.pageInfo.maxPage}"> <!-- 8 -->
<button disabled>></button>
</c:if>
<c:if
test="${requestScope.pageInfo.pageNo < requestScope.pageInfo.maxPage}"> <!-- 9 -->
<button id="nextPage">></button>
</c:if>
<button id="maxPage">>></button> <!-- 10 -->
</c:when>
<c:otherwise>
</c:otherwise>
</c:choose>
</div>
</div>
</div>
<!-- detail 페이지 이동 js -->
<script type="text/javascript">
const PAGING_PATH = "${pageContext.servletContext.contextPath}/board";
$(function(){
/*list에서 게시물 클릭 시 해당 게시물 상세 페이지로 이동*/
$(".board-tbody > tr").on("click", function(){
let number = $(this).children().eq(0).text(); /*board number*/
location.href = "${pageContext.servletContext.contextPath}/board/" + number;
})
$("#startPage").on("click", function(){
location.href = PAGING_PATH + "?currentPage=1";
})
$("#prevPage").on("click", function(){
location.href = PAGING_PATH + "?currentPage=${reqeustScope.pageInfo.pageNo - 1}";
})
$("#nextPage").on("click", function(){
location.href = PAGING_PATH + "?currentPage=${requestScope.pageInfo.pageNo + 1}";
})
$("#maxPage").on("click", function(){
location.href = PAGING_PATH + "?currentPage=${requestScope.pageInfo.maxPage}";
})
$(".paging-button").on("click", function(){
let pageNumber = $(this).text();
location.href = PAGING_PATH +"?currentPage="+pageNumber;
})
})
</script>
</body>
</html>
브라우저에서 확인해 보면 아래와 같습니다.
이제 글쓰기 버튼을 누르면 작성 페이지로 요청을 보내고 페이지를 이동 하도록 하겠습니다. board.jsp 에 function을 추가 하도록 하겠습니다.
$("#write").on("click", function(){
location.href = "${pageContext.servletContext.contextPath}/write";
})
요청을 받을 controller를 작성 하겠습니다.
/*
* 작성 페이지 controller
* */
@RequestMapping(value="/write", method = RequestMethod.GET)
public String write() {
return "board/writeForm";
}
페이지만 보여주기 때문에 따로 service와 repository는 작성하지 않겠습니다.
- writeForm.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>수정페이지</title>
<style>
table.table2 {
border-collapse: separate;
border-spacing: 1px;
text-align: left;
line-height: 1.5;
border-top: 1px solid #ccc;
margin: 20px 10px;
}
table.table2 tr {
width: 50px;
padding: 10px;
font-weight: bold;
vertical-align: top;
border-bottom: 1px solid #ccc;
}
table.table2 td {
width: 100px;
padding: 10px;
vertical-align: top;
border-bottom: 1px solid #ccc;
}
.board-ul {
list-style : none;
padding-left : 0px;
}
.board-ul li {
text-align : center;
}
.board-ul li input {
width : 80%;
height : 27px;
}
.board-ul li input:focus {
outline : none;
}
.ul-span {
margin-right :10px;
font-size : 20px;
font-weight: bold;
line-height:40px;
}
.board-ul li textarea:focus {
outline : none;
}
.board-ul li textarea {
resize: none;
}
</style>
<body>
<jsp:include page="../common/sidebar.jsp" />
<div class="content">
<div
style="padding-top: 50px; text-align: center; width: 700px; border: 0px;margin-left : 350px;">
<div style="border-bottom : 3px solid #999;">
<span style="font-size :40px; font-weight: bold;">글쓰기</span>
</div>
<form method="POST" action="write">
<ul class="board-ul">
<li>
<span class="ul-span">제목 : </span>
<input type="text" placeholder="제목을 입력해 주세요" name="board_title"></li>
<li style="margin-top : 30px;">
<textarea rows="25" cols="88" name="board_text"></textarea>
</li>
<li>
<div style="text-align: right; padding-right:28px; margin-top : 10px;">
<button type="submit" style="width:70px;" id="submit">작성</button>
<button id="back">뒤로가기</button>
</div>
</li>
</ul>
</form>
</div>
</div>
</body>
</html>
브라우저에서 확인해 보면 아래와 같습니다. 간단하게 제목과 내용만 입력 할 수 있도록 만들었습니다.
제목과 내용을 작성 후 작성 버튼을 누르면 POST 요청을 받을 controller를 작성하도록 하겠습니다.
- BoardController.java
/*
* 작성 페이지 controller
*
* */
@RequestMapping(value = "/write", method = RequestMethod.POST)
public String write(@ModelAttribute BoardDTO board) {
int boardNumber = boardService.insertBoard(board);
return "redirect:/board/" + boardNumber;
}
-BoardService.java (interface)
package com.js.board.model.service;
import java.util.List;
import com.js.board.model.dto.BoardDTO;
import com.js.board.model.dto.PageInfoDTO;
public interface BoardService {
/*select board list*/
public List<BoardDTO> selectBoardList(PageInfoDTO pageInfo);
/*select board*/
public BoardDTO selectById(int number);
/*update board*/
public void updateById(BoardDTO board);
/*count board*/
public int totalCount();
/*insert board*/
public int insertBoard(BoardDTO board);
}
- BoardServiceImpl.java
/*
* board insert method
* @param board 입력한 게시물 정보
* return boardNumber
* */
@Override
public int insertBoard(BoardDTO board) {
int boardNumber = boardRepository.selectNextVal(sqlSession);
board.setBoard_id(boardNumber);
boardRepository.insertBoard(sqlSession, board);
return boardNumber;
}
-BoardRepository.java (interface)
package com.js.board.model.repository;
import java.util.List;
import org.mybatis.spring.SqlSessionTemplate;
import com.js.board.model.dto.BoardDTO;
import com.js.board.model.dto.PageInfoDTO;
public interface BoardRepository {
/*select Board List*/
public List<BoardDTO> selectBoardList(SqlSessionTemplate sqlSession, PageInfoDTO pageInfo);
/*select Board*/
public BoardDTO selectById(int number, SqlSessionTemplate sqlSession);
/*update Board*/
public int updateById(BoardDTO board, SqlSessionTemplate sqlSession);
/*count board*/
public int totalCount(SqlSessionTemplate sqlSession);
/*select board nextVal*/
public int selectNextVal(SqlSessionTemplate sqlSession);
/*insert board*/
public void insertBoard(SqlSessionTemplate sqlSession, BoardDTO board);
}
-BoardRepositoryImpl.java
/*
* board sequence nextval 조회
* param sqlSession 쿼리문 실행할 객체
* return 시퀀스 nextval 값
* */
@Override
public int selectNextVal(SqlSessionTemplate sqlSession) {
return sqlSession.selectOne("board.boardNextval");
}
/*
* board 정보 db에 입력(insert)
* param sqlSession 쿼리문 실행할 객체
* param board 입력한 board정보
* */
@Override
public void insertBoard(SqlSessionTemplate sqlSession, BoardDTO board) {
sqlSession.insert("board.insertBoard", board);
}
윗 코드는 각 클래스에 추가한 메소드들 입니다. 마지막으로 mapper 입니다.
-boara-mapper.xml
<select id="boardNextval" resultType="_int">
SELECT
SEQ_BOARD.NEXTVAL
FROM DUAL
</select>
<select id="insertBoard" parameterType="com.js.board.model.dto.BoardDTO">
INSERT INTO BOARD(BOARD_ID, BOARD_CATEGORY, BOARD_WRITER,
BOARD_TITLE, BOARD_TEXT)
VALUES(#{board_id}, '0', 'sj',
#{board_title}, #{board_text})
</select>
브라우저에서 실행해 보면 아래와 같습니다.
전체코드
-BoardController.java
package com.js.board.controller;
import java.util.List;
import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.ModelAttribute;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;
import org.springframework.web.bind.annotation.RequestParam;
import com.js.board.model.dto.BoardDTO;
import com.js.board.model.dto.PageInfoDTO;
import com.js.board.model.service.BoardService;
import com.js.board.paging.Pagenation;
@Controller
public class BoardController {
private static final Logger log = LoggerFactory.getLogger(BoardController.class);
private final BoardService boardService;
@Autowired
public BoardController(BoardService boardService) {
this.boardService = boardService;
}
/*
*board 리스트 페이지 접속 시 controller
*@param model Model 객체
*@param currentPage 페이징 번호
*@return viewResolver에 전달할 view path String
*/
@RequestMapping(value ="/board", method = RequestMethod.GET)
public String board(Model model, @RequestParam(value="currentPage", defaultValue = "1", required = false) String currentPage) {
//====================변경부분==================================
/*기본 페이징 값 1로 설정*/
int pageNo = 1;
int page;
try {
page = Integer.parseInt(currentPage);
}catch(NumberFormatException e){
page = 1;
}
/*넘어온 currentPage 값이 0이거나 0보다 작다면 기본적으로 1로 설정*/
if(page <= 0) {
pageNo = 1;
}else {
pageNo = page;
}
//============================================================
/*db에 저장되어 있는 게시판 갯수 조회*/
int totalCount = boardService.totalCount();
/*페이징 계산 후 pageInfo에 값을 담는다.*/
PageInfoDTO pageInfo = Pagenation.getPageInfo(pageNo, totalCount);
/*starRow, endRow에 해당하는 list 조회*/
List<BoardDTO> list = boardService.selectBoardList(pageInfo);
/*model에 담기*/
model.addAttribute("list", list);
model.addAttribute("pageInfo", pageInfo);
log.info("list : {}", list);
log.info("pageInfo : {}", pageInfo);
return "board/board";
}
/*상세 페이지 controller
*@param number 게시판 번호
*@return viewResolver에 전달할 view path String
*/
@RequestMapping(value = "/board/{number}", method = RequestMethod.GET)
public String detailBoard(@PathVariable int number, Model model) {
BoardDTO board = boardService.selectById(number);
model.addAttribute("board", board);
log.info("board : {}" , board);
return "board/detail";
}
/*
* 수정 페이지 조회 controller
* @param number 게시판 번호
* @return viewResolver에 전달할 view path String
* */
@RequestMapping(value = "/modify/{number}", method = RequestMethod.GET)
public String modifyBoard(@PathVariable int number, Model model) {
BoardDTO board = boardService.selectById(number);
model.addAttribute("board", board);
return "board/modify";
}
/*
*수정 페이지 수정 controller
* @param board 게시물 정보
* @return redirect 할 요청주소(url)
* */
@RequestMapping(value ="/modify", method = RequestMethod.POST)
public String modifyBoard(@ModelAttribute BoardDTO board) {
boardService.updateById(board);
log.info("board : {}", board);
return "redirect:/board/" + board.getBoard_id();
}
/*
* 작성 페이지 controller
* */
@RequestMapping(value="/write", method = RequestMethod.GET)
public String write() {
return "board/writeForm";
}
/*
* 작성 페이지 controller
*
* */
@RequestMapping(value = "/write", method = RequestMethod.POST)
public String write(@ModelAttribute BoardDTO board) {
int boardNumber = boardService.insertBoard(board);
return "redirect:/board/" + boardNumber;
}
}
-BoardServiceImpl.java
package com.js.board.model.service;
import java.util.List;
import org.mybatis.spring.SqlSessionTemplate;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
import com.js.board.model.dto.BoardDTO;
import com.js.board.model.dto.PageInfoDTO;
import com.js.board.model.repository.BoardRepository;
@Service("boardService")
public class BoardServiceImpl implements BoardService{
private final BoardRepository boardRepository;
private final SqlSessionTemplate sqlSession;
@Autowired
public BoardServiceImpl(BoardRepository boardRepository, SqlSessionTemplate sqlSession) {
this.boardRepository = boardRepository;
this.sqlSession = sqlSession;
}
/*board list를 조회할 때 사용하는 service method
* @param pageInfo 페이징 객체
* @return board List 정보
* */
@Override
public List<BoardDTO> selectBoardList(PageInfoDTO pageInfo) {
return boardRepository.selectBoardList(sqlSession, pageInfo);
}
/*
* board를 조회할 때 사용하는 service method
* @param number 게시판 번호
* @return board 정보
* */
@Override
public BoardDTO selectById(int number) {
return boardRepository.selectById(number, sqlSession);
}
/*
* board를 수정할 때 사용하는 service method
* @param board 게시물 수정정보가 담긴 객체
* @return
* */
@Override
public void updateById(BoardDTO board) {
boardRepository.updateById(board, sqlSession);
}
/*
*count board list method
*@return count board list
* */
@Override
public int totalCount() {
return boardRepository.totalCount(sqlSession);
}
/*
* board insert method
* @param board 입력한 게시물 정보
* return boardNumber
* */
@Override
public int insertBoard(BoardDTO board) {
int boardNumber = boardRepository.selectNextVal(sqlSession);
board.setBoard_id(boardNumber);
boardRepository.insertBoard(sqlSession, board);
return boardNumber;
}
}
-BoardRepositoryImpl.java
package com.js.board.model.repository;
import java.util.HashMap;
import java.util.List;
import java.util.Map;
import org.mybatis.spring.SqlSessionTemplate;
import org.springframework.stereotype.Repository;
import com.js.board.model.dto.BoardDTO;
import com.js.board.model.dto.PageInfoDTO;
@Repository("boardRepository")
public class BoardRepositoryImpl implements BoardRepository{
/*
* board List 조회 Repository method
* @param sqlSession service에서 전달받은 sqlSessionTemplate 쿼리문 실행할 객체
* @param pageInfo 페이징 객체
* @return db에서 조회한 board List정보
* */
@Override
public List<BoardDTO> selectBoardList(SqlSessionTemplate sqlSession, PageInfoDTO pageInfo) {
return sqlSession.selectList("board.selectList", pageInfo);
}
/*
* board 조회 Repository method
* @param number board 번호
* @param sqlSession service에서 전달받은 sqlSessionTemplate 쿼리문 실행할 객체
* @return db에서 조회한 board 정보
* */
@Override
public BoardDTO selectById(int number, SqlSessionTemplate sqlSession) {
return sqlSession.selectOne("board.selectById", number);
}
/*
* board update Repository method
* @param board 수정할 보드정보 객체
* @param sqlSession 쿼리문 실행할 객체
* */
@Override
public int updateById(BoardDTO board, SqlSessionTemplate sqlSession) {
return sqlSession.update("board.updateById", board);
}
/*count board list Repository
* @param sqlSession 쿼리문 실행할 객체
* @return 보드리스트 갯수
* */
@Override
public int totalCount(SqlSessionTemplate sqlSession) {
return sqlSession.selectOne("board.totalCount");
}
/*
* board sequence nextval 조회
* param sqlSession 쿼리문 실행할 객체
* return 시퀀스 nextval 값
* */
@Override
public int selectNextVal(SqlSessionTemplate sqlSession) {
return sqlSession.selectOne("board.boardNextval");
}
/*
* board 정보 db에 입력(insert)
* param sqlSession 쿼리문 실행할 객체
* param board 입력한 board정보
* */
@Override
public void insertBoard(SqlSessionTemplate sqlSession, BoardDTO board) {
sqlSession.insert("board.insertBoard", board);
}
}