boardAjax 만들기 4 (수정, 리스트 페이징)

@ boardAjax 만들기 4 (수정, 리스트 페이징)

1. 수정
- Common_SQL.xml
<select id="selectOne" resultType="AccountDTO" parameterType="int">
select account_seq,profit_cost,big_group,middle_group,small_group,detail_group,
comments,transaction_money,TO_CHAR(transaction_date,'YYYY/MM/DD') transaction_date,writer
from ACCOUNT_TB
where account_seq = #{account_seq}
</select>

<select id="selectKor" resultType="String" parameterType="String">
select COM_KOR from CODE_MASTER where CODE = #{CODE, jdbcType=VARCHAR}
</select>

<update id="updateAccount" parameterType="AccountDTO">
update ACCOUNT_TB set profit_cost = #{profit_cost},big_group = #{big_group},middle_group = #{middle_group},
small_group = #{small_group, jdbcType=VARCHAR},detail_group = #{detail_group, jdbcType=VARCHAR},
comments = #{comments},transaction_money = #{transaction_money},transaction_date = #{transaction_date},writer=#{writer}
where account_seq = #{account_seq}
</update>

- AccountService.java
/**
 * ACCOUNT_TB 테이블에 실제 insert 작업
 * @param dto
 * @throws Exception
 */
public void insertAccount(AccountDTO dto) throws Exception;

/**
 * 수정페이지 데이터 띄우기
 * @param account_seq
 * @return
 */
public AccountDTO updateAccount(int account_seq);

/**
 * code에 해당하는 com_kor 가져오기
 * @param code
 * @return
 */
public String selectKor(String code);

/**
 * 실제 수정 작업
 * @param dto
 * @throws Exception
 */
public void updateAccountPro(AccountDTO dto) throws Exception;

- AccountDAO.java
/**
 * ACCOUNT_TB 테이블에 실제 insert 작업
 * @param dto
 * @throws Exception
 */
public void insertAccount(AccountDTO dto) throws Exception {

sqlSession.insert("Common.insertAccount", dto);

}

/**
 * 수정페이지 데이터 띄우기
 * @param account_seq
 * @return
 */
public AccountDTO updateAccount(int account_seq) {

return sqlSession.selectOne("Common.selectOne", account_seq);

}

/**
 * code에 해당하는 com_kor 가져오기
 * @param code
 * @return
 */
public String selectKor(String code) {

return sqlSession.selectOne("Common.selectKor", code);

}

/**
 * 실제 수정 작업
 * @param dto
 * @throws Exception
 */
public void updateAccountPro(AccountDTO dto) throws Exception {

sqlSession.update("Common.updateAccount", dto);

}

- AccountServiceImpl.java
//ACCOUNT_TB 테이블에 실제 insert 작업
@Override
public void insertAccount(AccountDTO dto) throws Exception {

accountDAO.insertAccount(dto);

}

//수정페이지 데이터 띄우기
@Override
public AccountDTO updateAccount(int account_seq) {

return accountDAO.updateAccount(account_seq);

}

//code에 해당하는 com_kor 가져오기
@Override
public void updateAccountPro(AccountDTO dto) throws Exception {

accountDAO.updateAccountPro(dto);

}

//실제 수정 작업
@Override
public String selectKor(String code) {

return accountDAO.selectKor(code);

}

- AccountController.java
/**
 * ACCOUNT_TB 테이블에 실제 insert 작업
 * @param dto
 * @return /account/accountList.jsp
 * @throws Exception
 */
@RequestMapping(value="/account/accountInsertPro.do")
public ModelAndView accountInsertPro(AccountDTO dto) throws Exception {

accountService.insertAccount(dto);

ModelAndView mav = new ModelAndView();

mav.setViewName("redirect:/account/accountUpdate.do?account_seq=" + dto.getAccount_seq());

return mav;

}

/**
 * 수정페이지 이동
 * @param request
 * @return /account/accountUpdate.jsp
 * @throws Exception
 */
@RequestMapping(value="/account/accountUpdate.do")
public ModelAndView accountUpdate(HttpServletRequest request) throws Exception {

int account_seq = Integer.parseInt(request.getParameter("account_seq"));

AccountDTO dto = accountService.updateAccount(account_seq);

List<EgovMap> resultMap= commonService.selectCombo("A000000");

String profit_cost = accountService.selectKor(dto.getProfit_cost());
String big_group = accountService.selectKor(dto.getBig_group());
String middle_group = accountService.selectKor(dto.getMiddle_group());
String small_group = accountService.selectKor(dto.getSmall_group());
String detail_group = accountService.selectKor(dto.getDetail_group());

ModelAndView mav = new ModelAndView();

mav.setViewName("/account/accountUpdate");
mav.addObject("dto",dto);
mav.addObject("resultMap", resultMap);
mav.addObject("profit_cost", profit_cost);
mav.addObject("big_group", big_group);
mav.addObject("middle_group", middle_group);
mav.addObject("small_group", small_group);
mav.addObject("detail_group", detail_group);

return mav;

}

/**
 * 실제 수정작업
 * @param dto
 * @return redirect:/account/accountList.jsp
 * @throws Exception
 */
@RequestMapping(value="/account/accountUpdatePro.do")
public ModelAndView accountUpdatePro(AccountDTO dto) throws Exception {

accountService.updateAccountPro(dto);

ModelAndView mav = new ModelAndView();

mav.setViewName("redirect:/account/accountList.do");

return mav;

}

- accountUpdate.jsp
<form action="./accountUpdatePro.do" name="myForm" method="post">

<div class="container" style="margin-top: 50px">
<div class="col-sm-12"><label for="disabledInput" class="col-sm-12 control-label"></label></div>
<div class="col-sm-12"><label for="disabledInput" class="col-sm-12 control-label"></label></div>
<div class="col-sm-12"><label for="disabledInput" class="col-sm-12 control-label"></label></div>
<div class="col-sm-12"><label for="disabledInput" class="col-sm-12 control-label"></label></div>



<div class="col-sm-11" id="costDiv">
<div>
<div class="col-sm-11">
  <div class="col-sm-12">
      <div class="col-sm-3">
<select class="form-control" id="profit_cost" name="profit_cost" title="비용">
         <option value="${dto.profit_cost }">${profit_cost }</option>
         <c:forEach var="list" items="${resultMap}" varStatus="status">
         <option value="${list.code}">${list.comKor}</option>
         </c:forEach>
        </select>
      </div>

      <div class="col-sm-3">
<select class="form-control" id="big_group"  name="big_group" title="관" >
 
         <option value="${dto.big_group }">${big_group }</option>
         <%--  
         <c:forEach var="list" items="${inOutMap}" varStatus="cnt">
         <option value="${list.code}">${list.comKor}</option>
         </c:forEach>
          --%>
        </select>
      </div>

      <div class="col-sm-3">
<select class="form-control " id="middle_group"  name="middle_group"  title="항">
         <option value="${dto.middle_group }">${middle_group }</option>
        </select>
      </div>

      <div class="col-sm-3">
<select class="form-control " id="small_group" name="small_group" title="목">
         <option value="${dto.small_group }">${small_group }</option>
        </select>
      </div>
  </div>

  <div class="col-sm-12">  <label class="col-sm-12 control-label"> </label></div>
 
  <div class="col-sm-12">
    <div class="col-sm-3">
<select class="form-control " id="detail_group" name="detail_group" title="과">
         <option value="${dto.detail_group }">${detail_group }</option>
        </select>
      </div>
      <div class="col-sm-9">
       <input class="form-control " name="comments" type="text" value="${dto.comments }" placeholder="비용 상세 입력" title="비용 상세">
      </div>
  </div>

<div class="col-sm-12">  <label class="col-sm-12 control-label"> </label></div>
  <div class="col-sm-12">
    <label class="col-sm-1 control-label"><font size="1px">금액</font></label>
      <div class="col-sm-3">
         <input class="form-control"  name="transaction_money" type="number" value="${dto.transaction_money }" title="금액">
      </div>
    <label class="col-sm-1 control-label"><font size="1px">거래일자</font></label>
      <div class="col-sm-3">
         <input class="datepicker" name="transaction_date" type="text" value="${dto.transaction_date }" style="width: 80%" title="거래일자">
      </div>
  </div>
 
  <input type="hidden" name="account_seq" value="${dto.account_seq }">
  <input type="hidden" name="writer" value="${sessionScope.userSession.user_id}">

<div class="col-sm-12" align="center">
<button type="submit" class="btn btn-primary">수정</button>
<button type="button" class="btn btn-danger">취소</button>
</div>

<label class="col-sm-12 control-label"></label>

 </div>
</div>
</div>
</div>

</form>

<script>

$(document).ready(function(){
 
$("#profit_cost").change(function(){

    var profit_cost = $(this).val();
    
    console.log();
    start1(profit_cost);
    
    
    
    f = document.myForm;
    f.profit_cost.value = profit_cost;
    
}); 
    
});


function start1(profit_cost) {
$("#big_group").children('option').remove();
$.ajax({
       url:'./selectCombo.do',
       type:'POST',
       data:{profit_cost : profit_cost},
       success:function(result){
        console.log(result);
       //$('#bigGroup').html(result);
        /* 
        $('#bigGroup').each(function(result) {
       
         $('#bigGroup').append('<option value="' + result.com + '">' + result.comKor + '</option>');
       
        });
         */
        
        for(var i=0; i<result.length;i++){
        $('#big_group').append('<option value=' + result[i].code + '>' +  result[i].comKor + '</option>');
        }
  
   $("#big_group").change(function(){
  
   var big_group = $(this).val();
   console.log(big_group);
   start2(big_group);
  
   f = document.myForm;
    f.big_group.value = big_group;
       
   });
         
       }
       
    });

}


function start2(big_group) {
$("#middle_group").children('option').remove();
$.ajax({
       url:'./selectCombo2.do',
       type:'POST',
       data:{big_group : big_group},
       success:function(result){
         console.log(result);
         
       for(var i=0; i<result.length;i++){
        $('#middle_group').append('<option value=' + result[i].code + '>' +  result[i].comKor + '</option>');
        }
         
       $("#middle_group").change(function(){
  
       var middle_group = $(this).val();
        
       start3(middle_group);
       
      f = document.myForm;
    f.middle_group.value = middle_group;
       
   });
         
       }
    });

}

function start3(middle_group) {
$("#small_group").children('option').remove();
$.ajax({
       url:'./selectCombo3.do',
       type:'POST',
       data:{middle_group : middle_group},
       success:function(result){
         console.log(result);
         
       for(var i=0; i<result.length;i++){
        $('#small_group').append('<option value=' + result[i].code + '>' +  result[i].comKor + '</option>');
        }
         
       $("#small_group").change(function(){
  
       var small_group = $(this).val();
        
       start4(small_group);
       
      f = document.myForm;
    f.small_group.value = small_group;
       
   }); 
         
       }
    });

}
 
function start4(small_group) {
$("#detail_group").children('option').remove();
$.ajax({
       url:'./selectCombo4.do',
       type:'POST',
       data:{small_group : small_group},
       success:function(result){
         console.log(result);
         
       for(var i=0; i<result.length;i++){
        $('#detail_group').append('<option value=' + result[i].code + '>' +  result[i].comKor + '</option>');
        }
         
       $("#detail_group").change(function(){
  
       var detail_group = $(this).val();
        
       //start4(detail_group);
      f = document.myForm;
    f.detail_group.value = detail_group;
       
   }); 
         
       }
    });

}

</script>

2. 리스트 페이징
https://onecutwook.tistory.com/19 - 참고
https://www.egovframe.go.kr/wiki/doku.php?id=egovframework:rte:ptl:view:paginationtag - 참고(egovframework:rte:ptl:view:paginationtag)

- Common_SQL.xml
<!-- 데이터 개수 -->
<select id="selectDataCount" resultType="int">
select count(*) from ACCOUNT_TB
</select>

<!-- 데이터 목록 -->
<select id="selectList" resultType="map" parameterType="map" >
<![CDATA[
select * from (
select rownum rnum, data.* from (
select account_seq,profit_cost,big_group,middle_group,small_group,detail_group,
comments,transaction_money,TO_CHAR(transaction_date,'YYYY/MM/DD') transaction_date,writer
from ACCOUNT_TB
order by account_seq DESC) data)
where rnum >= #{pageNo} and rnum <= #{lastPage}
]]>
</select>

- AccountService.java
 /**
 * 데이터 개수
   * @param commandMap
 * @return
 */
public int selectDataCount(Map<String,Object> commandMap);

/**
 * 데이터 목록
 * @param commandMap
 * @return
 */
public List<Map<String,Object>> selectList(Map<String,Object> commandMap);

- AccountDAO.java
/**
 * 데이터 개수
 * @param commandMap
 * @return
 */
public int selectDataCount(Map<String, Object> commandMap) {

return sqlSession.selectOne("Common.selectDataCount");

}

/**
 * 데이터 목록
 * @param commandMap
 * @return
 */
public List<Map<String,Object>> selectList(Map<String,Object> commandMap) {

return sqlSession.selectList("Common.selectList", commandMap);

}

- AccountServiceImpl.java
//데이터 개수
@Override
public int selectDataCount(Map<String, Object> commandMap) {

return accountDAO.selectDataCount(commandMap);

}

//데이터 목록
@Override
public List<Map<String, Object>> selectList(Map<String, Object> commandMap) {

return accountDAO.selectList(commandMap);

}

- accountList.jsp
<form name="sendForm" id="sendForm" method="post" onsubmit="return false;">

<input type="hidden" id="situSeq" name="situSeq" value="">
<input type="hidden" id="mode" name="mode" value="Cre">

<div id="wrap"  class="col-md-offset-1 col-sm-10" >
<div align="center"><h2>회계정보리스트</h2></div>
<div class="form_box2 col-md-offset-7" align="right" >
<div class="right" >
<button class="btn btn-primary" onclick="location.href='./accountInsert.do'" >등록</button>
<button class="btn btn-primary" >엑셀 다운</button>
</div>
</div>
    <br/>
<table class="table table-hover">
    <thead>
      <tr align="center">
        <th style="text-align: center;" >수익/비용</th>
        <th style="text-align: center;" >관</th>
        <th style="text-align: center;" >항</th>
        <th style="text-align: center;" >목</th>
        <th style="text-align: center;" >과</th>
        <th style="text-align: center;" >금액</th>
        <th style="text-align: center;" >등록일</th>
        <th style="text-align: center;" >작성자</th>
      </tr>
    </thead>
    <c:forEach var="lists" items="${boardList }">
     <input type="hidden" id="account_seq" name="account_seq" value="${lists.account_seq }">
     <input type="hidden" id="comments" name="account_seq" value="${lists.comments }">
     <tbody style="text-align: center;">
    
<tr>

<td>${lists.profit_cost }</td>

<td>${lists.big_group }</td>

<td>${lists.middle_group }</td>

<td>${lists.small_group }</td>

<td>${lists.detail_group }</td>

<td>${lists.transaction_money }</td>

<td>${lists.transaction_date }</td>

<td>${lists.writer }</td>

</tr>
 
     </tbody>
    </c:forEach>
</table>
<div class="paging">
<ui:pagination paginationInfo = "${paginationInfo}" type="image" jsFunction="linkPage"/>
</div>

</div>
</form>

<script type="text/javascript">

//페이징과 글 목록 조회
//var currentPageNo = ${pageNo};
 
function linkPage(pageNo){
    location.href = "./accountList.do?pageNo=" + pageNo;
}

</script>

- sqlMapConfig.xml
https://oingdaddy.tistory.com/379 - 참고(MyBatis select시 null 허용하기)

<setting name="callSettersOnNulls" value="true"/>
<setting name="returnInstanceForEmptyRow" value="true"/>