- html
<div class="pagination-container">
<a th:href="@{/board/qnaBoardList}"><span><<</span></a>
<a th:href="@{/board/qnaBoardList(cp=${(currentPage - paginSize) < 1 ? 1 : currentPage - paginSize})}"><span><</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) > totalPage ? totalPage : currentPage + paginSize})}"><span>></span></a>
<a th:href="@{/board/qnaBoardList(cp=${totalPage})}"><span>>></span></a>
</div>
- 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;
}
- 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";
}