front-end/JQuery
모달창으로 데이터 넘기기
이안_ian
2019. 3. 16. 15:20
반응형
신고 내역을 받아와서 블랙 리스트처리를 하는 로직인데 비슷한게 많을지도 모른다는 생각에 신고자와 피신고자 그리고 신고내용을 조건으로 일치하는 값을 신고내역 테이블에서 삭제하고 블랙리스트 테이블에 추가.
이때 정지할 날짜를 받아서 현재 시간으로 부터 정지할 시간까지 더해 저장할 것이다.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 | <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%> <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%> <c:set var="path" value="${pageContext.request.contextPath}"/> <jsp:include page="/WEB-INF/views/common/header.jsp"> <jsp:param value="오다가다 타는 카풀" name="pageTitle"/> </jsp:include> <style> #container{ text-align: center; } </style> <section id="container"> <div id="title"> <h2>신고 내역</h2> </div> <table class="table table-hover"> <tr> <td>신고한 회원</td> <td>신고 당한 회원</td> <td>신고 내용</td> <td>신고 날짜</td> <td>처리</td> </tr> <c:forEach var="list" items="${notifyList }"> <tr> <td>${list.NOTIFYID }</td> <td>${list.NONNOTIFYID }</td> <td>${list.NCONTENT }</td> <td>${list.NDATE }</td> <td> <button class="btn btn-success" onclick="deleteNotify('${list.NOTIFYID}','${list.NONNOTIFYID}','${list.NCONTENT}');">경미</button> <button data-toggle="modal" data-target="#insertBlack" data-notifyid="${list.NOTIFYID }" data-nonnotifyid="${list.NONNOTIFYID }" data-ncontent="${list.NCONTENT }" class="btn btn-danger">블랙</button> </td> </tr> </c:forEach> </table> <!-- Modal --> <div class="modal fade" id="insertBlack" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title" id="myModalLabel">몇일 블랙 시킬지 날짜를 입력하세요. </h5> </div> <div class="modal-body"> <input type="text" id="blackCount" placeholder="1일 일경우 => 1"> </div> <div class="modal-footer"> <button type="button" class="btn btn-default" data-dismiss="modal">닫기</button> <button type="button" class="btn btn-primary" onclick="insertBlack();">확인</button> </div> </div> </div></div> ${pageBar } </section> <script> var NOTIFYID=""; var NONNOTIFYID=""; var NCONTENT=""; $(document).ready(function() { $('#insertBlack').on('show.bs.modal', function(event) { NOTIFYID = $(event.relatedTarget).data('notifyid'); NONNOTIFYID = $(event.relatedTarget).data('nonnotifyid'); NCONTENT = $(event.relatedTarget).data('ncontent'); }); }); function deleteNotify(notifyid,nonnotifyid,ncontent) { location.href='${path}/admin/deleteNotify.do?notifyId='+notifyid+'&nonNotifyId='+nonnotifyid+'&nContent='+ncontent; } function insertBlack() { var blackCount = $('#blackCount').val(); location.href='${path}/admin/insertBlack.do?notifyId='+NOTIFYID+'&nonNotifyId='+NONNOTIFYID+'&nContent='+NCONTENT+'&blackCount='+blackCount; } </script> <jsp:include page="/WEB-INF/views/common/footer.jsp"></jsp:include> | cs |
블랙리스트 로직의 69번째 줄부터 설명하자면
모달창이 show 되었을 때 해당 이벤트의 37번째 줄에 있는 data-notifyid에 매핑된 값을 .data('notifyid')로 가져올 수 있다. 그걸 전역변수에 넣어두고 아래 insertBlack에서 사용한다 매우 간단하게 데이터를 가져올 수 있었다.
해당 게시글이 도움이 되셨다면 광고 클릭한번 부탁드립니다 ㅎㅎ
반응형