[jsp] list 페이징처리

페이징 처리

• 한페이지에 출력되는 게시물의 수 결정하고 = 10페이지
• 남는 게시물의 수만큼 하단에 페이징 처리하고 (1page = 1~10 / 2page = 11-20 .. page = 1,2,3)
• 다음 버튼을 이용하여 다음페이징을 표시하기 (11~20으로 가면 이전버튼 생성)
• - 페이지네이션 : 콘텐츠를 여러 페이지로 나누어 다음 또는 이전 페이지로 이동하거나 특정 페이지로 이동할 수 있는 요소

 

1. domain패키지에 PagingVO 생성 (DB로 가는 데이터를 객체화한것) : 게시글부분

• PageNo : 페이지 당 시작 게시글의 번호
• qty : 한페이지에 보여질 게시물의 수
• 생성자  ->  this(  1 = pageNo,  10 = qty ) 설정해서 기본값 생성!
• getPageStart()  -> 페이지당 시작하는 게시글의 번지 수

selete * from 테이블명 limit 번지, 개수; (번지는 0부터시작)

- 1페이지 ) select * from board limit 0 , 10 (0~9)
- 2 페이지 ) select * from board limit 10 , 10 (10~19)
- 3페이지 ) select * from board limit 20 , 10 (20~29)

package domain;

public class PagingVO {
	private int pageNo; //화면에 출력되는 게시글 번호 
	private int qty; //보여질 게시글의 수
	
	//생성자
	public PagingVO(int pageNo, int qty) {
		this.pageNo = pageNo;
		this.qty = qty;
	}
	//기본으로 생성될때 화면에 출력되는 게시글의 수는 1페이지에 10개
	public PagingVO() {
		this(1,10);
	}
	
	public int getPageStart() { //출력될 게시글의 시작 번호
		return (this.pageNo-1)*10; 
	}
//	페이지 번지는 0부터 시작하는 인덱스를 가집니다. 
//	예를 들어, 첫 번째 페이지의 경우 pageNo는 1이므로 "(1-1)*10"은 0이 됩니다.
//	두 번째 페이지의 경우 pageNo가 2이므로 "(2-1)*10"은 10이 됩니다.
//	따라서, 첫 번째 페이지의 번지는 0이고, 두 번째 페이지의 번지는 10이 됩니다.
	
	//setter,getter
	public int getPageNo() {
		return pageNo;
	}
	public void setPageNo(int pageNo) {
		this.pageNo = pageNo;
	}
	public int getQty() {
		return qty;
	}
	public void setQty(int qty) {
		this.qty = qty;
	}
	
	
	
}

 

---

 

2. handle이라는 패키지 생성 + PagingHandler(class)생성 : 페이지 네이션 부분

• 계산식에서 괄호 중요!!

package handle;

import domain.PagingVO;

public class PagingHandler {
	
	private int startPage; //현재화면 시작 페이지네이션 번호
	private int endPage; //현재화면 끝 페이지네이션 번호
	private int nQty = 5; //화면에 보여질 네이션의 수 1,2,3,4,5.. (10개)
	private boolean prev, next;  //이전, 다음버튼의 존재여부 (첫페이지에는 이전없음/마지막페이지에는 다음없음)
	
	private int totalCount; //전체 게시물 수 
	
	private PagingVO pgvo; //PagingVO 가져오기 = 출력페이지에 보여지는 게시글 수
	
	//생성자
	public PagingHandler(PagingVO pgvo, int totalCount) {
		this.pgvo = pgvo;
		this.totalCount = totalCount;
		
		//멤버변수 startPage, endPage, prev, next는 계산 필요
		//== 계산 ==
        //예) 127개의 게시글 페이지네이션번호 = 1~13, 
		//	1페이지에 보이는 startPage = 1, endPage = 10
		//	11페이지에 보이는 startPage = 11, endPage = 13
		
		// (현재페이지 번호 / 한화면에 보여지는 게시글 수) * 한화면에 게시글 수
		//예) ( 1 / 10 ) * 10 = 0.1(1) * 10 = 10 : endPage = 10
		//	 ( 2 / 10 ) * 10 = 0.5(1) * 10 = 10 : endPage = 10
		//   ( 13 / 10 ) * 10 = 1.3(2) * 10 = 20 : endPage = 20 
		//   ( 23 / 10 ) * 10 = 2.3(3) * 10 = 30 : endPage = 30 ..
		//즉, 1~10페이지까지 endPage = 10 / 11~13페이지까지 endPage = 20		
		
		// ceil = 올림
		// 정수/정수 = 정수임으로 1.0을 곱해서 소수로 만들어주기! 
		
		//현재화면의 끝 네이션 번호
		this.endPage =(int)(Math.ceil(pgvo.getPageNo() / (this.nQty*1.0)) * this.nQty);
		
		//현재화면의 시작 네이션 번호
		this.startPage = this.endPage - (this.nQty -1);
		
		//전체에서의 마지막 페이지 (마지막 네이션 번호) 
		// = 마지막 게시글이 들어있는 장! 126게시물,10개씩 표시 = 13번
		int lastPage = (int)Math.ceil((totalCount*1.0) / pgvo.getQty());
		if(lastPage < this.endPage) { //혹시모를 오류 대비
			this.endPage = lastPage;
		}
		
		//다음버튼과 이전버튼
		this.prev = this.startPage > 1; //시작페이지가 존재하면 이전버튼 true반환
		this.next = this.endPage < lastPage; //전체 페이지보다 끝페이지가 작은경우 다음버튼 true반환
		
		
	}
	
	//시작 페이지네이션을 리턴해주는 메서드
	public int getStartPage() {
		return startPage;
	}
	
	
	//setter,getter
	public void setStartPage(int startPage) {
		this.startPage = startPage;
	}

	public int getEndPage() {
		return endPage;
	}

	public void setEndPage(int endPage) {
		this.endPage = endPage;
	}

	public int getNqty() {
		return nQty;
	}

	public void setNqty(int nQty) {
		this.nQty = nQty;
	}

	public boolean isPrev() {
		return prev;
	}

	public void setPrev(boolean prev) {
		this.prev = prev;
	}

	public boolean isNext() {
		return next;
	}

	public void setNext(boolean next) {
		this.next = next;
	}

	public int getTotalCount() {
		return totalCount;
	}

	public void setTotalCount(int totalCount) {
		this.totalCount = totalCount;
	}

	public PagingVO getPgvo() {
		return pgvo;
	}

	public void setPgvo(PagingVO pgvo) {
		this.pgvo = pgvo;
	}
}

 

3. board폴더 list.jsp에 페이지네이션 생성 : 게시글 부분

• 생성위치 : <body>태그 안, 테이블 아래

list.jsp

	<!-- 페이지네이션의 위치 -->
	<!-- 이전페이지 -->
	<c:if test="${pgh.prev }">
	<a href="/brd/page?pageNo=${pgh.startPage-1 }&qty=${pgh.pgvo.qty}">이전</a> 
	</c:if>
	
	<!-- controller에서 page의 정보를 싣고 와야 츨력~! -->
	<!-- 1~endpage까지 숫자 반복 -->
	<c:forEach begin="${pgh.startPage }" end="${pgh.endPage }" var="i">
		<a href="/brd/page?pageNo=${i }&qty=${pgh.pgvo.qty}">${i }</a>
	</c:forEach>
	
	<!-- 다음페이지 -->
	<c:if test="${pgh.next }">
	<a href="/brd/page?pageNo=${pgh.endPage+1 }&qty=${pgh.pgvo.qty}">다음</a> 
	</c:if>

 

---

4. orm에 typeAliases 추가

 

<typeAlias type="domain.PagingVO" alias="pgvo" />

---

 

5. controller패키지에 BoardController에 case "page"생성 

사용할 sql구문 (전체 개수)

사용할 sql구문 (페이지 리스트)

// 정보 넣기
insert into board (title, writer, content) values ('abc','1234','content--'); 

---

1) BoardController에 case "page" 추가

case "page":
			try {
				int pageNo = 1; //게시글 시작번호 (limit pagoNo,qty) VO
				int qty = 10; //게시글의 수
				
				if(request.getParameter("pageNo") != null) {
					pageNo = Integer.parseInt(request.getParameter("pageNo")); 
					qty = Integer.parseInt(request.getParameter("qty")); 
				}
				PagingVO pgvo = new PagingVO(pageNo, qty);
				
				//전체 페이지의 개수 = 전체 게시글의 수
				int totCount = bsv.getTotal();
				log.info("전체페이지의 수: "+totCount);
				
				//limit을 이용한 select List호출
				//startPage, qty
				List<BoardVO> list = bsv.getPageList(pgvo); //pageNo부터 qty개씩 가져오는 리스트
				log.info(">>> list.size: "+ list.size());
				
				PagingHandler ph = new PagingHandler(pgvo, totCount);
				log.info(">>>startPage: " + ph.getStartPage());
				log.info(">>>endPage: " + ph.getEndPage());
				request.setAttribute("pgh", ph);
				request.setAttribute("list", list);
				log.info("pageList 성공");
				
			} catch (Exception e) {
				e.printStackTrace();
			}
			
			destPage = "/board/list.jsp";
			break;

---

2) BoardController에  연결해서 생성 

1. getTotal() : 게시글의 총 개수
2. getPageList(pgvo) : pageNo부터 qty개씩 가져오는 리스트

BoardService

---

BoardServiceImpl

---

BoardDAO

---

 

BoardDAOImpl

@Override
	public int getTotal() {
		log.info(">>> getTotal DAO 진입");
		return sql.selectOne(NS+"cnt");
	}


@Override
	public List<BoardVO> getPageList(PagingVO pgvo) {
		log.info(">>> getPageList DAO 진입");
		return sql.selectList(NS+"pageList",pgvo);
	}

---

boardMapper

  	<select id="cnt" resultType="int">
  		select count(bno) from board where bno>0	
  	</select>
  	<select id="pageList" parameterType="pgvo" resultType="bvo">
  		select * from board order by bno desc limit #{pageStart}, #{qty}
  	</select>

 

---

 

6. 연결부분 변경 : list 작성부분-> page로 변경

 

- detail.jsp

 

- controller

 

 

---

 

== 출력화면 ==

 

기본으로 뜨는 화면 (desc로 최근 게시물부터 출력)

---

다음버튼 을 누르면 단위가 넘어가는 것을 확인가능!