게시판 페이징

엄장영·2025년 2월 13일
  1. html
<div class="pagination-container">
  <a th:href="@{/board/qnaBoardList}"><span>&lt&lt</span></a>
  <a th:href="@{/board/qnaBoardList(cp=${(currentPage - paginSize) &lt 1 ? 1 : currentPage - paginSize})}"><span>&lt</span></a>
  <th:block th:each="num : ${#numbers.sequence(startPage, endPage)}">
    <th:block th:if="${num eq currentPage}">
      <span class="current-index" th:text="${num}"></span>
    </th:block>
    <th:block th:unless="${num eq currentPage}">
      <a th:href="@{/board/qnaBoardList(cp=${num})}"><span class="page-index" th:text="${num}"></span></a>
    </th:block>
  </th:block>
  <a th:href="@{/board/qnaBoardList(cp=${(currentPage + paginSize) &gt totalPage ? totalPage : currentPage + paginSize})}"><span>&gt</span></a>
  <a th:href="@{/board/qnaBoardList(cp=${totalPage})}"><span>&gt&gt</span></a>
</div>
  1. css
.pagination-container {
  text-align: center;
  font-size: 18px;
  margin: 10px;
}
.page-index {
  padding: 0px 5px 0px 5px;
}
.current-index {
  background-color: #455ba8;
  color: white;
  border-radius: 50%;
  padding: 0px 7px 0px 7px;
}
  1. back-end
@RequestMapping("qnaBoardList")
	public String qnaBoardList(@RequestParam(value="cp", required = false, defaultValue = "1") int cp,
	                           Model model) {
	    int paginSize = 10;  // 페이징 블록 크기
	    int pageSize = 10;  // 한 페이지당 게시글 개수
	    int offset = (cp - 1) * pageSize;

	    int totalCount = service.qnaListCount();
	    int totalPage = (totalCount + pageSize - 1) / pageSize; // 전체 페이지 계산
        if (totalPage == 0) totalPage = 1;  // 최소 1페이지 보장

	    // 현재 페이지가 범위를 벗어나지 않도록 보정
	    if (cp < 1) cp = 1;
	    if (cp > totalPage) cp = totalPage;

	    // 페이징 블록 계산
	    int startPage = ((cp - 1) / paginSize) * paginSize + 1;
	    int endPage = startPage + paginSize - 1;

	    if (endPage > totalPage) endPage = totalPage;

	    List<Board> qnaList = service.selectQnaList(offset, pageSize); 

	    model.addAttribute("qnaList", qnaList);
	    model.addAttribute("startPage", startPage);
	    model.addAttribute("endPage", endPage);
	    model.addAttribute("totalPage", totalPage);
	    model.addAttribute("currentPage", cp);
	    model.addAttribute("paginSize", paginSize);

	    return "board/qnaBoardList";
	}

0개의 댓글