지금 까지 페이징 기능을 구현했는데요
페이징 처리(3)에서 페이지 유지기능 구현을 위해 uriComponents를 만들었는데
이제 페이지 유지기능을 만들어 보도록 하겠습니다.
페이지 유지기능이란 ?
보통의 게시판의 경우 상세보기에서 목록을 누르면 1페이지로 이동이 되는데
페이지 유지기능을 적용시키면 3페이지에서 상세보기를 한 후 목록 버튼을 누르면
1페이지로 가지 않고 3페이지 그대로 유지하는 기능입니다!
조회 후 현재 페이지 정보 유지
3페이지에 있는 글을 읽고 현재 페이지를 유지하도록 구현할건데요
정보가 유지 되려면 URI에 page와 perPageNum의 값이 계속 유지되어야 하는데요
유지하도록 하기 위해 BoardController의 read 메소드의 매개변수에 Criteria를 추가해줍니다!
<!-- BoardController.java -->
@RequestMapping(value = "/read", method = RequestMethod.GET)
public void read(@RequestParam("board_number") Integer board_number, @ModelAttribute("cri") Criteria cri, Model model) throws Exception{
// 페이지 목록 유지를 위해 사용되고 있는 page, perPageNum 값 가져오기
logger.info("read GET!!!");
BoardVO board = service.read(board_number);
model.addAttribute("BoardVO",board);
logger.info(board.toString());
System.out.println("vo 값 확인 :" + cri.getPage());
}
파라미터 값으로 @ModelAttribute("cri") Criteria cri 를 선언한 이유는
현재 페이지에 해당하는 page와 perPageNum을 데이터 전달 받기 위해서 입니다.
이렇게 사용하기 위해서는 VO에 변수를 선언하고, getter 와 setter를 생성해야 합니다!
파라미터에 선언 후 VO 데이터를 조회하려면
System.out.println("vo 값 확인 :" + cri.getPage());
이렇게 하게 되면 해당 VO인 Criteria의 값들을 가져 올 수 있습니다.
Controller를 수정해주었으니 이제 read.jsp도 수정 하도록 하겠습니다!
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>게시판</title>
<script>
var result = '${result}';
if(result === 'updateOK') {
alert("수정되었습니다.");
}
</script>
</head>
<body>
<div>글번호 : ${BoardVO.board_number}</div>
<div>
<button><a href="/board/listPage${cri.makeQuery()}" class="btn btn-primary">목록</a></button>
<button><a href="/board/update${cri.makeQuery()}&board_number=${BoardVO.board_number}" class="btn btn-warning">수정</a></button>
<button><a href="/board/delete?board_number=${BoardVO.board_number}">삭제</a></button>
</div>
<div>
<div>
<label for="title">제목</label>
<input type="text" id="title" name="title" value="${BoardVO.title}" readonly="readonly"/>
</div>
<div>
<label for="contents">내용</label>
<textarea name="contents" id="contents" rows="3" readonly="readonly">${BoardVO.contents}</textarea>
</div>
<div>
<label for="name">작성자</label>
<input type="text" name="name" id="name" value="${BoardVO.name}" readonly="readonly"/>
</div>
</div>
</body>
</html>
이렇게 Controller와 read.jsp를 수정해주면 3페이지에서 글을 읽고 목록버튼을 누르면 1페이지로 가지 않고
3페이지를 유지하는 것을 볼 수 있습니다!
수정 후 현재 페이지 정보 유지
이제 수정 후에도 현재 페이지 정보를 유지하도록 할건데요
BoardController의 update 메서드를 수정하도록 하겠습니다.
@RequestMapping(value = "/update", method = RequestMethod.GET)
public void updateGET(@RequestParam("board_number") Integer board_number, @ModelAttribute("cri") Criteria cri, Model model) throws Exception {
logger.info("updateGET!!!");
BoardVO board = service.read(board_number);
model.addAttribute("BoardVO",board);
}
@RequestMapping(value = "/update", method = RequestMethod.POST)
public String updatePOST(BoardVO board, Criteria cri, RedirectAttributes ra) throws Exception {
logger.info("updateGET!!!");
service.update(board);
ra.addFlashAttribute("result", "updateOK");
ra.addAttribute("page", cri.getPage());
ra.addAttribute("perPageNum", cri.getPerPageNum());
ra.addAttribute("board_number", board.getBoard_number());
return "redirect:/board/read";
}
Controller를 수정했으니 update.jsp도 수정하도록 하겠습니다.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>게시판</title>
</head>
<body>
<form method="post">
<div>글번호 : ${BoardVO.board_number}</div>
<input type="hidden" name="board_number" value="${BoardVO.board_number}"/>
<!-- page와 perPageNum 추가 -->
<input type="hidden" name="page" value="${cri.page}" />
<input type="hidden" name="perPageNum" value="${cri.perPageNum}" />
<div>
<div>
<label for="title">제목</label>
<input type="text" id="title" name="title" value="${BoardVO.title}"/>
</div>
<div>
<label for="contents">내용</label>
<textarea name="contents" id="contents" rows="3">${BoardVO.contents}</textarea>
</div>
<div>
<label for="name">작성자</label>
<input type="text" name="name" id="name" value="${BoardVO.name}" readonly="readonly"/>
</div>
</div>
<div>
<button type="submit">등록</button>
<button><a href="/board/read${cri.makeQuery()}&board_number=${BoardVO.board_number}" class="btn btn-danger">취소</a></button>
</div>
</form>
</body>
</html>
이렇게 코드를 수정 후
실제로 수정하거나 취소 후 목록 버튼을 누르게 되면
1페이지로 가지 않고 3페이지면 3페이지를 유지하도록 적용했습니다.
삭제 후 현재 페이지 정보 유지
삭제 후에도 현재 페이지로 유지하려면
BoardController의 delete 메서드를 수정 해야 합니다!
@RequestMapping(value = "/delete", method = RequestMethod.POST)
public String deletePOST(@RequestParam("board_number") Integer board_number, Criteria cri, RedirectAttributes ra) throws Exception {
logger.info("deletePOST");
service.delete(board_number);
ra.addFlashAttribute("result", "deleteOK");
ra.addAttribute("page", cri.getPage());
ra.addAttribute("perPageNum", cri.getPerPageNum());
logger.info("페이지 : " + cri.getPage());
return "redirect:/board/listPage";
}
바뀐 점은 deletePOST 메서드의 매개변수에 Criteria VO를 추가하고
addAttribute를 추가하여 listPage의 url에 붙도록 model 값을 보낸다!