Board- 페이지 네이션

BoardDAO


final int BOARD_COUNT = 10; 상수처리 해주고
?가 두개이니 ? 두개 넣어줍니다.

BoardDTO


5 /20 => 10으로 변경

실행 해보면

이 DTO를 버튼으로 바꿔주면 됩니다.

boardlist.jsp
먼저 위에 부트스트랩 주소를 넣습니다.

document의 pagination 파트를 보고 1부터 10까지 나열합니다.
copy를 눌러 복사를 해주시고,

수정 해줍니다.

실행해보면

확인할수 있다.

반복문으로 바꿀꺼라서 하나 빼고 다지워줍니다.

(<c:forEach var="pageIndex" begin="시작번호"end="{시작번호}" end="

<li> class="page-item"><a class ="page-link" href="#">${pageIndex}</a></li>

</c:forEach>
실행 해보면

DTO에서 가져왔기 때문에 dto.startPage/ dto.endPage 이고,
pageIndex는 앞에서 명칭을 페이지인덱스로 했기 때문에(var = pageIndex) dto가 안붙는다.

부트스트랩 없이 만들때에는

실행

<c:forEach var="pageIndex" begin="dto.startPage"end="{dto.startPage}" end="

<li> class="page-item"><a class ="page-link" href="#">${pageIndex}</a></li>

</c:forEach>

.# 부분에 http://localhost:8181/MyFirstWeb/boardList.do?pageNum= 에다가
${pageIndex}> 를 붙이면
페이지가 클릭이 된다.

부트스트랩 없이 만들때에는

위에랑 똑같이 주솔르 붙여주면 됩니다.
실행 해보면

======이전페이지=======
이전페이지 같은 경우 1페이지는 전 페이지가 필요없습니다.
startPage이가 나머지인 경우만 필요
첫번째 방법
<c:if test = "${dto.startPage ne 1}"> (startPage가 1이 아니라면 disable안걸린거)

<li class="page-item"><a class="page-link" href="#">&laquo;</a></li>

</c:if>

두번째 방법
<c:if test ="${dto.startPage eq 1}"> (1이면 disable 걸린거)
li class="page-item disable">«
</c:if>
실행

1페이지에선 << 이게 안눌린다.

좀 더 깔끔하게 disable 해주면

  • «
  • 첫 페이지인 경우 << 비활성화 아니면 활성화 .#= http://localhost:8181/MyFirstWeb/boardList.do?pageNum=${dto.startPage - 1 }">« 넣어준다. ![](https://media.vlpt.us/images/one_2s/post/e51a5f30-87ec-464e-9888-c7b218f5024d/image.png)

    부트스트랩 없이 만들기

    ㄴ dto.startPage가 1 이 아니라면
    실행 해보면

    Prev를 누르면 10페이지씩 가지고 첫페이지에서는 안된다.

    =====다음페이지 처리=====

  • »
  • disabled 을 주어서 마지막 페이지에서 안넘어가게 만들어준다. (마지막 페이지가 전체페이지와 같다면 disabled 다르다면 '') ![](https://media.vlpt.us/images/one_2s/post/eeaa2ddc-91d6-4397-b816-b4cc40ccd4fe/image.png) 마지막 페이지에서는 >> 이걸 눌러도 안넘어 가진다.

    부트스트랩 없이 만들기

    전체 페이지와 마지막 페이지가 같지 않을때만 표시

    currentPage

    <c:if test="dto.currentPageeqpageIndex"><ahref="http://localhost:8181/MyFirstWeb/boardList.do?pageNum={dto.currentPage eq pageIndex }"> <a href="http://localhost:8181/MyFirstWeb/boardList.do?pageNum=

    BoardDTO
    ${dto.currentPage}와 같은 형태로 자료를 EL문법으로 얻어와 활용하기 위해 getter가 필요합니다.
    currentPage에 대한 getter를 생성해줍니다.

    실행해보면

    선택한 페이지의 파랑색이 잘 들어옵니다.

    부트스트랩 없이 만들기
    <for내부에 작성>
    <c:if test="dto.currentPagenepageIndex"><ahref="http://localhost:8181/MyFirstWeb/boardList.do?pageNum={dto.currentPage ne pageIndex }"> <a href="http://localhost:8181/MyFirstWeb/boardList.do?pageNum=


    (currentpage 가 pageIndex 같다면) 볼드 처리
    실행 해보면

    잘 확인이 된다.

    좋은 웹페이지 즐겨찾기