2017년 1월 31일 화요일

[자바학원/스프링교육/스프링부트교육추천_탑크리에듀]spring + ibatis + ajax 를 이용한 게시판 만들기 List페이지_1 (3)

list.jsp 


<%@ page language="java" contentType="text/html; charset=utf-8"%> 
<%@ include file="/WEB-INF/jsp/include.jsp" %> 
<% request.setCharacterEncoding("utf-8"); %> 
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"
<html> 
<head> 
<title>게시판</title> 
<link href="css/style.css" rel="stylesheet" type="text/css"> 
</head> 

<script type="text/javascript">        
        var xmlHttp; 
        var dataDiv; 
        var dataTable; 
        var dataTableBody; 
        var offsetEl; 

        function createXMLHttpRequest() { 
            if (window.ActiveXObject) { 
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP"); 
            } 
            else if (window.XMLHttpRequest) { 
                xmlHttp = new XMLHttpRequest();                
            } 
        } 

        function initVars() { 
            dataTableBody = document.getElementById("courseDataBody");            
            dataTable = document.getElementById("courseData"); 
            dataDiv = document.getElementById("popup"); 
        } 

        function getCourseData(element) { 
                      initVars();            
            createXMLHttpRequest(); 
            offsetEl = element; 
            var paramName = encodeURIComponent(element.id); 
            var url = "/springBoard/tooltip.do?key=" + escape(paramName); 
                      
            xmlHttp.open("GET", url, true); 
            
            xmlHttp.onreadystatechange = callback; 
            xmlHttp.send(null); 
        } 

        function callback() { 
        
            if (xmlHttp.readyState == 4) { 
                if (xmlHttp.status == 200) { 
                                        setData(xmlHttp.responseXML); 
                } 
            } 
        } 
        
        function setData(courseData) {            
            clearData(); 
            setOffsets(); 
          var content = courseData.getElementsByTagName("content")[0].firstChild.data; 
            
          
            var row; 
                      var contentData = content 
                        
            row = createRow(contentData);            
                      
            dataTableBody.appendChild(row); 
                } 

        function createRow(data) {            
            var row, cell, txtNode; 
            row = document.createElement("tr"); 
            cell = document.createElement("td"); 

            cell.setAttribute("bgcolor", "#FFFAFA"); 
            cell.setAttribute("border", "0");                          

            txtNode = document.createTextNode(data); 
            cell.appendChild(txtNode); 
            row.appendChild(cell); 
          
            return row;  
        } 
        
        
        function setOffsets() { 
                
                
            var end = offsetEl.offsetWidth; 
            var top = calculateOffsetTop(offsetEl); 
            
            dataDiv.style.border = "black 1px solid"; 
            dataDiv.style.left = end + -40 + "px"; 
            dataDiv.style.top = top + -40 + "px"; 
            
        } 
        
        function calculateOffsetTop(field) { 
          return calculateOffset(field, "offsetTop"); 
        } 

        function calculateOffset(field, attr) { 
          var offset = 0; 
          while(field) { 
            offset += field[attr]; 
            field = field.offsetParent; 
          } 
          return offset; 
        } 

        function clearData() {            
            var ind = dataTableBody.childNodes.length;            
            for (var i = ind - 1; i >= 0 ; i--) { 
                dataTableBody.removeChild(dataTableBody.childNodes[i]);      
            } 
            dataDiv.style.border = "none"; 
        }        
        
          </script> 
<body > 
<center><b>글목록(전체 글:${model.count})</b> 
<table width="700"> 
  <tr> 
    <td align="right"> 
      <a href="writeForm.do?command=insert">글쓰기</a> 
    </td> 
  </tr> 
</table> 

<c:if test="${model.count == 0}"> 
<table width="700" border="1" cellpadding="0" cellspacing="0"> 
  <tr> 
    <td align="center"> 
      게시판에 저장된 글이 없습니다. 
    </td> 
  </tr> 
</table> 
</c:if> 

<c:if test="${model.count > 0}"> 
<table border="1" width="700" cellpadding="0" cellspacing="0" align="center"> 
    <tr height="30" bgcolor="${value_c}"> 
      <td align="center"  width="50"  >번 호</td> 
      <td align="center"  width="250" >제  목</td> 
      <td align="center"  width="100" >작성자</td> 
      <td align="center"  width="150" >작성일</td> 
      <td align="center"  width="50" >조 회</td> 
      <td align="center"  width="100" >IP</td>    
    </tr> 
        
        <c:set var="number" value="${model.number}"/> 
  <c:forEach var="article" items="${model.boardlist}" > 
  <tr height="30"> 
    <td align="center"  width="50" > 
          <c:out value="${number}"/> 
          <c:set var="number" value="${number-1}" /> 
        </td> 
    <td  width="250" id="${article.num }" onmouseover="getCourseData(this);" onmouseout="clearData();" > 
          <c:if test="${article.re_level > 0}"> 
                  <img src="images/level.gif" width="${5 * article.re_level}" height="16"> 
            <img src="images/re.gif"> 
          </c:if> 
          <c:if test="${article.re_level == 0}"> 
            <img src="images/level.gif" width="${5 * article.re_level}" height="16"> 
          </c:if> 
          
      <a href="content.do?num=${article.num}&pageNum=${model.currentPage}"> 
          ${article.subject}</a> 
          <c:if test="${article.readcount >= 20}"> 
            <img src="images/hot.gif" border="0"  height="16"> 
                  </c:if> 
        </td> 
    <td align="center"  width="100"> 
      <a href="mailto:${article.email}">${article.writer}</a> 
        </td> 
    <td align="center"  width="150">${article.reg_date} 
        </td> 
    <td align="center"  width="50">${article.readcount}</td> 
    <td align="center" width="100" >${article.ip}</td> 
  </tr> 
  </c:forEach> 
</table> 
</c:if> 

<c:if test="${model.count > 0}"> 
  <c:set var="pageCount" value="${model.count / model.pageSize + ( model.count % model.pageSize == 0 ? 0 : 1)}"/> 
  <c:set var="pageBlock" value="${10}"/> 
  <fmt:parseNumber var="result" value="${model.currentPage / 10}" integerOnly="true" /> 
  <c:set var="startPage" value="${result * 10 + 1}" /> 
  <c:set var="endPage" value="${startPage + pageBlock-1}"/> 
  <c:if test="${endPage > pageCount}"> 
        <c:set var="endPage" value="${pageCount}"/> 
  </c:if> 
          
  <c:if test="${startPage > 10}"> 
        <a href="boardList.do?pageNum=${startPage - 10 }">[이전]</a> 
  </c:if> 

  <c:forEach var="i" begin="${startPage}" end="${endPage}"> 
      <font size="1"> <a href="boardList.do?pageNum=${i}">[${i}]</a> </font> 
  </c:forEach> 

  <c:if test="${endPage < pageCount}"> 
        <a href="boardList.do?pageNum=${startPage + 10}">[다음]</a> 
  </c:if> 
</c:if> 
        <div style="position:absolute;" id="popup"> 
        <table id="courseData" bgcolor="#FFFAFA" border="0" cellspacing="2" cellpadding="2"/> 
            <tbody id="courseDataBody"></tbody> 
        </table> 
    </div> 
</center> 
</body> 
</html> 

list페이지에서는 submit하면  SpringboardListController 요청을 받아 처리하게된다. 

SpringboardListController에서는 Dao객체를 이용하여 DB에 접근하여 리스트를 가져오는 작업을한다. 
필요한 DAO에 대한 개략적인 설명은 한번에 모아서 얘기하기로 하자. 

package web; 

import java.util.Collections; 
import java.util.HashMap; 
import java.util.List; 
import java.util.Map; 

import javax.servlet.http.HttpServletRequest; 
import javax.servlet.http.HttpServletResponse; 

import org.apache.commons.logging.Log; 
import org.apache.commons.logging.LogFactory; 
import org.springframework.web.servlet.ModelAndView; 
import org.springframework.web.servlet.mvc.Controller; 

import boardDao.BoardListDao; 

import dao.ProductManagerDao; 

public class SpringboardListController implements Controller { 

        protected final Log logger = LogFactory.getLog(getClass()); 

        private BoardListDao boardListDao; 
        
        public BoardListDao getBoardListDao() { 
                return boardListDao; 
        } 

        public void setBoardListDao(BoardListDao boardListDao) { 
                this.boardListDao = boardListDao; 
        } 
        
        public ModelAndView handleRequest(HttpServletRequest request, 
                        HttpServletResponse response) throws Exception { 
                
                //원하는 ListAction에 대한 로직을 처리한다. 
                
                String pageNum = request.getParameter("pageNum");//페이지 번호 

        if (pageNum == null) { 
            pageNum = "1"; 
        } 
        int pageSize = 10;//한 페이지의 글의 개수 
        int currentPage = Integer.parseInt(pageNum); 
        int startRow = (currentPage - 1) * pageSize + 1;//한 페이지의 시작글 번호 
        int endRow = currentPage * pageSize;//한 페이지의 마지막 글번호 
        int count = 0; 
        int number=0; 

        List articleList = null; 
        
        count =  boardListDao.getBoardCount(); 
        
        logger.info("ListController..." ); 
        
        Map myModel = new HashMap(); 
        if (count > 0) { 
                HashMap  map = new HashMap(); 
                map.put("r1", startRow); 
                map.put("r2", endRow); 
            articleList = boardListDao.getBoardManagerList(map); 
            logger.info("RecordCount > 0" ); 
  
        } else { 
                
            articleList = Collections.EMPTY_LIST; 
        } 

                number=count-(currentPage-1)*pageSize;//글목록에 표시할 글번호 
                logger.info("Number "+number); 
                
                myModel.put("boardlist", articleList); 
                myModel.put("currentPage", new Integer(currentPage)); 
                myModel.put("startRow", new Integer(startRow)); 
                myModel.put("endRow", new Integer(endRow)); 
                myModel.put("count", new Integer(count)); 
                myModel.put("pageSize", new Integer(pageSize)); 
                myModel.put("number", new Integer(number)); 
                        
        //해당 뷰에서 사용할 속성 
                
                return new ModelAndView("list", "model", myModel); 
        } 




sqlmap-springibatis-list.xml 

게시판에 리스트에 관한 쿼리문의 정의 되어 있다. 

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE sqlMap  PUBLIC "-//ibatis.apache.org//DTD SQL Map 2.0//EN"          
                                "http://ibatis.apache.org/dtd/sql-map-2.dtd"
<sqlMap namespace="BoardList"> 

        <typeAlias alias="board" type="board.Board" /> 
        
        <resultMap id="boardResultMap" class="board"> 
                <result property="num" column="NUM" /> 
                <result property="writer" column="WRITER" /> 
                <result property="email" column="EMAIL" /> 
                <result property="subject" column="SUBJECT" /> 
                <result property="passwd" column="PASSWD" /> 
                <result property="reg_date" column="REG_DATE"/> 
                <result property="readcount" column="READCOUNT"/> 
                <result property="ref" column="REF" /> 
                <result property="re_step" column="RE_STEP" /> 
                <result property="re_level" column="RE_LEVEL" /> 
                <result property="content"  column="CONTENT" /> 
                <result property="ip" column="IP" /> 
                
                  </resultMap> 


    
    <resultMap id="TotalCount" class="java.lang.Integer"> 
      <result property="total" column="TOTAL"/> 
    </resultMap> 
        
        <select id="boardList" resultMap="boardResultMap" 
                parameterClass="map"> 
                <![CDATA[ 
                select num,writer,email, subject, passwd, reg_date, readcount,ref,re_step,re_level,content, ip 
                          from (select  /*+ INDEX(A idx_board_ref) */ num,writer,email, subject, passwd, reg_date, readcount,ref,re_step,re_level,content, ip, rownum r  from board A 
                  where ref > =0 ) where r>= #r1# and r<= #r2# ]]> 
                
                
        </select> 
        
    <select id="totalCount" resultMap="TotalCount"> 
      SELECT COUNT(*) as TOTAL FROM BOARD 
    </select> 
    
    
        

</sqlMap> 

댓글 없음:

댓글 쓰기