-
JSP - 게시판 페이징 paging프로그래밍/JSP 2021. 10. 18.반응형
자바 파일
package com.util; public class Myutil { /** * 전체 페이지 수 구하기 * @param rows 한 화면에 출력할 목록 수 * @param dataCount 총 데이터 수 * @return 전체 페이지 수 */ public int pageCount(int rows, int dataCount) { if(dataCount <= 0) { return 0; } return dataCount / rows + (dataCount % rows > 0 ? 1 : 0); } /** * 페이징 처리 GET 방식 * @param current_page 현재 표시되는 페이지 번호 * @param total_page 전체 페이지 수 * @param list_url 링크를 설정할 주소 * @return 페이징 처리 결과 */ public String paging(int current_page, int total_page, String list_url) { StringBuilder sb = new StringBuilder(); int numPerBlock = 10; int currentPageSetup; int n, page; if(current_page < 1 || total_page < 1) { return ""; } if(list_url.indexOf("?") != -1) { list_url += "&"; } else { list_url += "?"; } // currentPageSetup : 표시할 첫 페이지 -1 currentPageSetup = (current_page / numPerBlock) * numPerBlock; if(current_page % numPerBlock == 0) { currentPageSetup = currentPageSetup - numPerBlock; } sb.append("<div class='paginate'>"); // 처음 페이지, 이전(10페이지 전) n = current_page - numPerBlock; if(total_page > numPerBlock && currentPageSetup > 0) { sb.append("<a href='"+list_url+"page=1'>처음</a>"); sb.append("<a href='"+list_url+"page="+n+"'>이전</a>"); } // 페이징 처리 page = currentPageSetup +1; while(page <= total_page && page <= (currentPageSetup+numPerBlock)) { if(page == current_page) { sb.append("<span>" + page + "</span>"); } else { sb.append("<a href='"+list_url+"page="+page+"'>" + page + "</a>"); } page++; } // 다음(10 페이지 후 ), 마지막 페이지 n = current_page + numPerBlock; if(n > total_page) n = total_page; if(total_page - currentPageSetup > numPerBlock) { sb.append("<a href='"+list_url+"page="+n+"'>다음</a>"); sb.append("<a href='"+list_url+"page="+total_page+"'>끝</a>"); } sb.append("</div>"); return sb.toString(); } }JSP 파일
<%@page import="com.util.Myutil"%> <%@ page contentType="text/html; charset=UTF-8"%> <%@ page trimDirectiveWhitespaces="true" %> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %> <% request.setCharacterEncoding("utf-8"); // 파라미터로 넘어온 페이지 번호(JSP에서 page는 예약어로 변수명으로 사용 불가) String pageNum = request.getParameter("page"); int current_page = 1; if(pageNum != null) { current_page = Integer.parseInt(pageNum); } Myutil util = new Myutil(); int dataCount = 965; int rows = 10; int total_page = util.pageCount(rows, dataCount); if(current_page > total_page) { current_page = total_page; } String listUrl = "list.jsp"; String paging = util.paging(current_page, total_page, listUrl); %> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Insert title here</title> <link rel="icon" href="data:;base64,iVBORw0KGgo="> <style type="text/css"> *{ margin: 0; padding: 0; box-sizing: border-box; } body{ font-size: 14px; font-family: 맑은 고딕, 나눔고딕, 돋움, sans-serif; } .paginate { text-align: center; font-size: 14px; } .paginate a { border: 1px solid #ccc; color: #000; font-weight: 600; text-decoration: none; padding: 3px 7px; margin-left: 3px; vertical-align: middle; } .paginate a:hover, .paginate a:active { color: #6771ff; } .paginate span { border: 1px solid #e28d8; color: #cb3536; font-weight: 600; text-decoration: none; padding: 3px 7px; margin-left: 3px; vertical-align: middle; } .paginate :first-child { margin-left: 0; } .container { width: 700px; margin: 30px auto; } </style> </head> <body> <div class="container"> <h3 style="text-align: center;">페이징 처리 테스트</h3> <div style="padding-top: 20px;"> <%= paging %> </div> </div> </body> </html>
페이징 처리를 위해서 자바 파일 하나를 만들어서 거기서 연산을 하고 결과를 JSP파일로 가져와서 출력한다.
* 조건
- 한 페이지에 목록은 10개씩
- 전체 데이터 개수는 965개
- 전체 페이지 수 구하는 법 : 전체 데이터 개수 / 10 + (전체 데이터 개수 % 10 == 0 ? 0 : 1)
(+를 하는 이유는 전체 페이지 수가 10으로 딱 나누어 떨어지지 않으면 남는 애들이 생기기 때문에 페이지를 하나 더 추가 해야 한다.)
- 페이징 페이지 들어가는 방식은 GET 방식으로 한다.
* 자바 코드 해석
전체 페이지 수를 구하는 메소드를 만든다. (인자는 한 화면에 출력할 목록의 개수와 총 데이터의 개수) 위의 공식을 활용
마지막 메소드는 페이징 처리를 하는 메소드를 만든다.
인자로 현재 표시되는 페이지 번호, 전체 페이지 수, 이 페이지를 설정할 주소를 받고
StringBuilder 객체를 통해서 문자열들을 합친다.
StringBuilder 는 긴 문자열들을 더할때 좋은 클래스이다.
numPerBlock 변수는 10으로 한 화면에 출력할 페이지의 갯수이다.
currentPageSetup = 표시할 첫 페이지 - 1
n = 처음 페이지, 마지막 페이지
page = 페이징 처리 while 반복문으로 페이지들 반복 시킴
현재 페이지 번호가 1보다 작거나 전체 페이지 수가 1보다 작으면 메소드를 종료 시킨다.
GET방식 접근이니까 혹시 주소 맨 끝에 ?가 없으면 붙여주고 있으면 &를 붙여준다.
currentPageSetup = (현재 페이지 번호) / 10 * 10
만약 현재 페이지 번호가 10으로 나누어 떨어진다면 (현재 페이지가 10, 20, 30 등등 10 페이지의 끝 일때)
페이지가 유지 되도록 currentPageSetup 를 따로 설정 해준다.
그리고 아까 만들어둔 스트링 빌더 객체를 통해서 HTML 코드를 열어준다
이제부터 페이징 처리가 시작 되니까 HTML 코드를 객체에 넣는다.
sb.append("<div class='paginate'>"); div 태그를 열었다.
처음 페이지 설정할때의 n은 현재 페이지 번호 - 10
만약 전체 페이지 수가 10보다 크고 표시할 첫 페이지 번호가 0보다 크면 처음과 이전 버튼을 sb객체에 추가하고
이전 버튼에는 n 변수를 달아서 현재 페이지에서 - 10을 통해 이전 10페이지의 목록으로 돌아가게 해주고
처음 버튼에는 그냥 주소를 1로 설정해서 완전 처음 페이지로 돌아가게 한다.
마지막 페이지 설정할때의 n은 현재 페이지 번호 + 10
혹시 전체 페이지 수 보다 n이 클 경우 그냥 전체 페이지 마지막으로 설정
만약 전체 페이지 수에서 현재 페이지 번호를 뺀 값이 10보다 크면 다음 페이지로 이동할 수 있게 설정한다.
남은건 반복문을 통해서 페이징 처리를 하는 것
page 변수는 현재 페이지 번호 + 1
page가 전체 페이지 수랑 같거나 크고 현재 페이지수+10 한 수와 같거나 클 때까지 반복문을 돌린다.
(전체 페이지수는 97이고 currentPageSetup은 위의 과정에서 구한 현재 첫 페이지 수에 10을 더한다.
10페이지씩 출력하기 위해서 필요함)
이 조건을 만족할때까지 반복
반복문 돌리는 중에 만약 page가 현재 페이지랑 같아지면 page에 앞뒤로 span 태그를 달아준다.
나중에 현재 페이지라는걸 알리기위해서 css 적용을 위해
그리고 만약 현재 페이지가 아니면 list_url 변수를 더해서 GET방식으로 처리할 수 있게 주소를 붙여준다.
그리고 page 값 에는 현재 page변수(몇번째 페이지 인지)를 넣어주고 태그 안에는 우리가 눈으로 보는 숫자를 표시하기 위해서 page 변수를 넣는다.
그리고 page++을 통해서 다음페이지 처리를 한다.
그리고 sb의 div를 닫아주고 sb를 string으로 바꿔서 반환 시킨다.
* JSP 파일 해석
자바에서 작성한 page 변수 가져오고 가져온 변수에 값이 있는지 확인해서 있으면 int형으로 변경
그리고 작성한 클래스 Myutil의 객체 생성하고, 객체에 인자로 넣을 변수들을 만든다.
인자중 마지막 인자인 url은 jsp 파일 자기 자신을 부르게 한다.
출력은 HTML에서 한다.
반응형'프로그래밍 > JSP' 카테고리의 다른 글
JSP - 커스텀 태그 만들기 (0) 2021.11.11 JSP - EL / JSTL (0) 2021.10.15 JSP - 달력 (0) 2021.10.14 JSP - Parameter 파라미터 전송하기 (0) 2021.10.12 JSP - 전송 방식의 차이 (GET / POST) (0) 2021.10.11
