본문 바로가기

WEB_Programming

페이징 관련 JSP 소스

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!-- 페이징 처리 수행 페이지 -->

<%--
 /*
 Input Parameter :
 이미지 파라미터
 1. firstPageImg : 처음으로 버튼 이미지
 2. prevPageImg : 이전 X 페이지로 이동 버튼 이미지
 3. nextPageImg : 다음 X 페이지로 이동 버튼 이미지
 4. lastpageImg : 마지막 페이지로 이동 버튼 이미지
 
 페이지 관련 이미지
 5. totalRowCount : 총 데이터 로우의 개수
 6. rowNumPerPage : 한페이지당 리스트할 로의 개수
 7. pageCount  : 한 화면에 보여질 페이지 개수 1 ~ 10, 11 ~ 20
 8. pageNo   : 페이지 번호
 9. target   : 페이징을 구분할 타겟 정보
 
 사용법
 a. 페이지 인클루드
 <jsp:include flush="true" page="./paging.jsp">
  <jsp:param name="firstPageImg" value="./images/firstImg.jpg"/>  
  <jsp:param name="prevPageImg" value="./images/prevImg.jpg"/>  
  <jsp:param name="nextPageImg" value="./images/nextImg.jpg"/>  
  <jsp:param name="lastPageImg" value="./images/lastImg.jpg"/>  
  <jsp:param name="totalRowCount" value="105"/>  
  <jsp:param name="rowNumPerPage" value="10"/>  
  <jsp:param name="pageCount" value="10"/>  
  <jsp:param name="pageNo" value="3"/>  
  <jsp:param name="target" value="TEST_PAGE"/>  
 </jsp:include>
 
 b. 자바 스크립트 작성
 <script type="text/javascript">
 <!--
  function searchByTarget(pageNo, target)
  {
   // TODO
  }
 //-->
 </script>
 */
--%>
<%
 int totalRowCount  = 1;  // 전체 로 개수
 int rowNumPerPage  = 5; //  페이지당 로의 개수
 int pageCount   = 10; // 한 화면에 보여질 페이지 번호 개수
 int pageNo    = 1; // 현재 선택된 페이지 번호
 
 String firstPageImg  = "/blog/images/bl_nv_start.gif";   // 처음 페이지 이동 이미지
 String prevPageImg  = "/blog/images/bl_nv_prev.gif";   // 이전 X 페이지 이동 이미지
 String nextPageImg  = "/blog/images/bl_nv_next.gif";   // 다음 X 페이지 이동 이미지   
 String lastPageImg  = "/blog/images/bl_nv_last.gif";   // 마지막 페이지 이동 이미지
 
 firstPageImg = request.getParameter("firstPageImg")== null ? firstPageImg : request.getParameter("firstPageImg");
 prevPageImg  = request.getParameter("prevPageImg") == null ? prevPageImg : request.getParameter("prevPageImg");
 nextPageImg  = request.getParameter("nextPageImg") == null ? nextPageImg : request.getParameter("nextPageImg");
 lastPageImg  = request.getParameter("lastPageImg") == null ? lastPageImg : request.getParameter("lastPageImg");
 
 
 String target   = request.getParameter("target");   // 페이징 구분 타겟 코드(한번에 페이징이 여러개인경우 구분해주는 기능)
 try {
  totalRowCount    = Integer.parseInt(request.getParameter("totalRowCount")); 
 } catch (NumberFormatException e) {
 }
 try {
  rowNumPerPage    = Integer.parseInt(request.getParameter("rowNumPerPage")); 
 } catch (NumberFormatException e) {
 }
 try {
  pageCount    = Integer.parseInt(request.getParameter("pageCount"));  
 } catch (NumberFormatException e) {
 }
 try {
  pageNo     = Integer.parseInt(request.getParameter("pageNo"));   
 } catch (NumberFormatException e) {
 }
 
 int lastPageNum   = (totalRowCount - 1) / rowNumPerPage + 1;   // 전체 페이지 개수
 int startPageNum   = ((pageNo - 1) / pageCount) * pageCount + 1;  // 화면에 보여질 시작 페이지 번호
 int endPageNum    = startPageNum + pageCount - 1;      // 화면에 보여질 종료 페이지 번호
 if(endPageNum > lastPageNum) endPageNum = lastPageNum;      // 종료 페이지 범위 처리
 
 int prevPageGroup = 1;
 int nextPageGroup = lastPageNum;
 
 if(startPageNum - pageCount < 1) {
  prevPageGroup = 1;
 }
 else {
  prevPageGroup = startPageNum - endPageNum; 
  if(prevPageGroup <= 0) {prevPageGroup = 1;}
 }
 
 if(endPageNum + 1 > lastPageNum) {
  nextPageGroup = lastPageNum;
 }
 else {
  nextPageGroup = endPageNum + 1;
 }
%>

<!-- 처음 페이지로 이동-->
<a href="javascript:searchByTarget('1', '<%=target %>');">
 <img src="<%=firstPageImg %>" border="0" alt="처음 페이지" align="absmiddle">
</a>

<!-- 이전 X 페이지 이동 -->
<a href="javascript:searchByTarget('<%=prevPageGroup %>', '<%=target %>');">
 <img src="<%=prevPageImg %>" border="0" alt="이전 <%=pageCount %>페이지" align="absmiddle">
</a>

<!-- 페이지 번호 표시 -->
<%
 for (int i = startPageNum; i <= endPageNum; i++) {
  if (i == pageNo) {
%>
  <font color="RED"><b><%=i %></b></font> |
<%
  }
  else {
%>
  <a href="javascript:searchByTarget('<%=i %>', '<%=target %>');">
   <font color="NAVY"><%=i %></font>
  </a>|
<%
  }  
 }
%>

<!-- 다음 X 페이지 이동 -->
<a href="javascript:searchByTarget('<%=nextPageGroup %>', '<%=target %>');">
 <img src="<%=nextPageImg %>" border="0" alt="다음 <%=pageCount %>페이지" align="absmiddle">
</a>

<!-- 마지막 페이지 이동 -->
<a href="javascript:searchByTarget('<%=lastPageNum %>', '<%=target %>');">
 <img src="<%=lastPageImg %>" border="0" alt="마지막  페이지" align="absmiddle">
</a>


첨부파일 내용 다운로드 :