본문 바로가기

Spring 4/eGov Pagination

eGovFrame Pagination example

전자정부 프레임워크기반의 페이지 네비게이션(Pagination) 사용 예


개요

전자정부 프레임워크에서는 게시판 등의 리스트에서 필수적으로 요구되는 페이지 네비게이션 기능(Pagination)을 포함하고 있기 때문에 Pagination기능을 사용하기 위한 설정법과 실제 Pagination기능을 사용하는 코드를 알아보고자 한다

전자정부 프레임워크의 MyBatis 예제에 제시되어 있는 내용이지만 오라클 데이터베이스에서 바로 실행가능한 상태는 아니기 때문에 예제에 포함된 SQL문장을 약간 편집하여 오라클에 적용할 수 있도록 하였다.

전자정부 프레임워크 + MyBatis + Oracle 설정 및 테스트 >> Go


테스트 환경

Windows 7

JDK1.8

eGovFramework 개발자환경 3.5.1

Tomcat 8.0


사용된 예제


서블릿 설정파일에 추가

<!-- Pagination Tag -->

    <bean id="imageRenderer" class="egovframework.sample.cmmn.EgovImgPaginationRenderer" /> 


    <bean id="paginationManager" class="egovframework.rte.ptl.mvc.tags.ui.pagination.DefaultPaginationManager">

        <property name="rendererType">

            <map>

                <entry key="image" value-ref="imageRenderer"/> 

            </map>

        </property>

    </bean>

<!-- Pagination Tag -->


서블릿 설정파일에 Pagination 기능에 사용할 속성 선언

<bean name="propertiesService" class="egovframework.rte.fdl.property.impl.EgovPropertyServiceImpl" destroy-method="destroy">

<property name="properties">

       <map>

        <entry key="pageUnit" value="2"/> <!-- Record count per page -->

        <entry key="pageSize" value="5"/> <!-- 페이지 링크 수 -->

       </map>

</property>

</bean>


SQL 매퍼 파일(employee.xml)의 SQL 을 오라클에 맞춰 수정

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE mapper   PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" "http://mybatis.org/dtd/mybatis-3-mapper.dtd">


<mapper namespace="EmpMapper">


<!-- <select id="retrieveEmpList" parameterType="empVO" resultType="empVO">

   <![CDATA[

       SELECT

              EMP.EMPNO,

              EMP.EMPNM,

              EMP.BIRTHDATE,

              EMP.TELEPHONE,

              EMP.ADDRESS

         FROM EMPLOYEE EMP

         WHERE 1=1

   ]]>

   <if test="searchKeyword != null">

       <choose>

           <when test="searchCondition == 1">

               AND EMP.EMPNO LIKE '%'|| #{searchKeyword} ||'%'

           </when>

           <otherwise>

              AND EMP.EMPNM LIKE '%'|| #{searchKeyword} ||'%'

           </otherwise>

       </choose>

</if>

<![CDATA[

ORDER BY EMP.EMPNO DESC

LIMIT #{recordCountPerPage} OFFSET #{firstIndex}

]]>

</select> -->


<!-- 아래의 SQL문장에 사용된 파라미터(searchCondition, searchKeyword, firstIndex, lastIndex 등은 SearchVO의 속성이며, MyBstis 예제는 EmpVO가 SearchVO를 상속하는 구조로 되어 있다.

searchCondition:1(사번으로 검색), 2(이름으로 검색)

firstIndex: 한 화면에 보여줄 리스트의 시작 행번호(ROWNUM)

lastIndex: 한 화면에 보여줄 리스트의 마지막 행번호

-->


<select id="retrieveEmpList" parameterType="empVO" resultType="empVO">

SELECT * FROM 

(

SELECT ROWNUM RN, t1.* FROM 

(

SELECT * FROM EMPLOYEE EMP

WHERE 1=1 

<if test="searchKeyword != null">

<choose>

<when test="searchCondition==1">

AND EMP.EMPNO LIKE '%'||#{searchKeyword} ||'%'

</when>

<otherwise>

AND EMP.EMPNM LIKE '%'||#{searchKeyword} ||'%'

</otherwise>

</choose>

</if>

ORDER BY EMP.EMPNO DESC

)t1

)

WHERE RN BETWEEN #{firstIndex} AND #{lstIndex}

</select>

  .....

    .........

</mapper>


EmpController

@Controller

public class EmpController {


@Resource(name = "empService")

private EmpService empService;


@Resource(name = "propertiesService")

protected EgovPropertyService propertiesService;


/** 

*사원목록을 조회한다.

* @param empVO 검색조건

* @param model

* @return "emp/list"

* @throws Exception

*/

@RequestMapping(value = "/emp/retrieveEmployeeList.do")

public String retrieveEmpList(@ModelAttribute("emp") EmpVO empVO, ModelMap model) throws Exception {


// currentPageNo : 현재 페이지 번호

// recordCountPerPage : 한 페이지당 게시되는 게시물 건 수

// pageSize : 페이지 리스트에 게시되는 페이지 건수

// totalRecordCount : 전체 게시물 건 수


/* 아래의 코드에서, EmpVO는 DB 검색을 위한 파라미터로 사용됨, 

PaginationInfo는 화면의 페이지 네비게이션을 생성할 때 사용됨 */


empVO.setPageUnit(propertiesService.getInt("pageUnit")); // Record count per page

empVO.setPageSize(propertiesService.getInt("pageSize")); // 페이지네이션 링크 수

PaginationInfo paginationInfo = new PaginationInfo();


paginationInfo.setCurrentPageNo( empVO.getPageIndex());    // 페이지 번호

paginationInfo.setRecordCountPerPage( empVO.getPageUnit()); // 페이지 당 행수 설정

paginationInfo.setPageSize( empVO.getPageSize());    // 페이지 링크 수


empVO.setFirstIndex( paginationInfo.getFirstRecordIndex()+1); // SearchVO.firstIndex=0 이므로....

empVO.setLastIndex( paginationInfo.getLastRecordIndex());     // 한 화면에 보여 줄 리스트의 마지막 행수(ROWNUM)

empVO.setRecordCountPerPage( paginationInfo.getRecordCountPerPage());


int totCnt = empService.retrieveEmpListTotCnt(empVO);

paginationInfo.setTotalRecordCount ( totCnt );


model.addAttribute("paginationInfo", paginationInfo);


// 검색조건과 키워드로 사원목록조회

List<EmpVO> resultEmployeeList = empService.retrieveEmpList(empVO);

model.addAttribute("resultList", resultEmployeeList);

return "emp/list";

}

      ........

       .......

}


emp/list.jsp (Pagination 기능에 의해 화면에 페이지 링크 출력 )

<%@ page language="java" pageEncoding="utf-8" contentType="text/html; charset=utf-8"%>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>

<%@ taglib prefix="ui" uri="http://egovframework.gov/ctl/ui"%>

<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>

<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>


<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>MyBatis | 사원조회목록 </title>

<link type="text/css" rel="stylesheet" href="<c:url value='/css/egovframework/egov.css'/>">

<script type="text/javaScript" language="javascript">

function searchEmployee() {

document.empForm.pageIndex.value='1';

document.empForm.action = "<c:url value='/emp/retrieveEmployeeList.do'/>";

document.empForm.submit();

}

function detailEmployee(empNo) {

document.empForm.empNo.value = empNo;

document.empForm.action = "<c:url value='/emp/retrieveEmployee.do'/>";

document.empForm.submit();

}

function createEmployee() {

document.empForm.action = "<c:url value='/emp/retrieveEmployeeNewForm.do'/>";

document.empForm.empNo.value = "";

document.empForm.submit();

}

function linkToPage(pageNo) {

document.empForm.pageIndex.value = pageNo;

document.empForm.action = "<c:url value='/emp/retrieveEmployeeList.do'/>";

document.empForm.submit();

}

</script>

</head>


<body style="text-align: center; margin: 0 auto; display: inline; padding-top: 100px;">

<div id="content_pop">

<form:form name="empForm" commandName="emp" method="post" onsubmit="searchEmployee()">

<input type="hidden" name="empNo" />

<div id="home">

<span class="btn_blue_l" title="<spring:message code="button.home" />">

<a href="../index.jsp"><spring:message code="button.home" /></a>

<img src="<c:url value='/images/egovframework/rte/btn_bg_r.gif'/>" alt="<spring:message code="button.home" />" style="margin-left:6px;" />

</span>

</div>

<div id="title2">

<ul>

<li>

<img src="<c:url value='/images/egovframework/rte/title_dot.gif'/>" alt="" /> <spring:message code="emp.list" />

<span style="font-size: 13px; padding-left: 5px;">(<c:out value='${paginationInfo.totalRecordCount}' />건)</span>

</li>

</ul>

</div>

<div id="search">

<ul>

<li>

<form:select path="searchCondition" cssClass="use" title="search">

<form:option value="1" label="사원번호">사원번호</form:option>

<form:option value="2" label="사원이름">사원이름</form:option>

</form:select>

</li> 

<li><form:input path="searchKeyword" cssClass="txt" title="검색어"/></li>

<!-- 검색 버튼 -->

<li>

<span class="btn_blue_l" title="<spring:message code="button.search" />">

<a href="javascript:searchEmployee();"><spring:message code="button.search" /></a>

<img src="<c:url value='/images/egovframework/rte/btn_bg_r.gif'/>" style="margin-left: 6px;" alt="검색" />

</span>

</li>

</ul>

</div>

<div id="table">

<table width="100%" border="0" cellpadding="0" cellspacing="0" summary="사원 목록을 조회할 수 있다.">

<caption>사원목록조회</caption>

<colgroup>

<col width="20">

<col width="70">

<col width="50">

<col width="70">

<col width="70">

<col width="70">

</colgroup>

<thead>

<tr align="center">

<th><spring:message code="content.no" /></th>

<th><spring:message code="emp.empNo" /></th>

<th><spring:message code="emp.empNm" /></th>

<th><spring:message code="emp.birthdate" /></th>

<th><spring:message code="emp.telephone" /></th>

<th><spring:message code="emp.address" /></th>

</tr>

</thead>

<tbody align="center">

<c:if test="${fn:length(resultList) == 0}">

<tr>

<td class="listtd" colspan="6"><spring:message code="info.nodata.msg" /></td>

</tr>

    </c:if>

<c:forEach var="emp" items="${resultList}" varStatus="status">

<tr>

<td class="listtd"><c:out value="${(paginationInfo.currentPageNo - 1) * paginationInfo.recordCountPerPage + status.count}" /></td>

<td class="listtd"><a href="javascript:detailEmployee('${emp.empNo}');"><c:out value="${emp.empNo}" /></a></td>

<td class="listtd"><c:out value="${emp.empNm}" /></td>

<td class="listtd"><c:out value="${emp.birthdate}" /> </td>

<td class="listtd"><c:out value="${emp.telephone}" /></td>

<td class="listtd"><c:out value="${emp.address}" /></td>

</tr>

</c:forEach>

</tbody>

</table>

</div>

<div id="paging">

<ui:pagination paginationInfo="${paginationInfo}" type="image" jsFunction="linkToPage" />

<form:hidden path="pageIndex" />

</div>

</form:form>

<div id="sysbtn">

<ul>

<!-- 등록 버튼 -->

<li>

<span class="btn_blue_l" title="<spring:message code="button.add" />">

<a href="#link" onclick="javascript:createEmployee(); return false;"><spring:message code="button.add" /></a>

<img src="<c:url value='/images/egovframework/rte/btn_bg_r.gif'/>" style="margin-left: 8px;" alt="<spring:message code="button.add" />" />

</span>

</li>

</ul>

</div>

</div>

</body>

</html>