jspblog : write reply (ajax)

2021-01-22 17:52:28 +09:00
parent c9110a6c78
commit 4a1301898e
6 changed files with 138 additions and 58 deletions
--- a/jspblog/src/main/java/com/example/jspblog/domain/reply/ReplyDao.java
+++ b/jspblog/src/main/java/com/example/jspblog/domain/reply/ReplyDao.java
@@ -1,25 +1,34 @@
 package com.example.jspblog.domain.reply;

 import com.example.jspblog.config.DB;
+import com.example.jspblog.domain.board.dto.DetailResDto;
 import com.example.jspblog.domain.reply.dto.SaveReqDto;

 import java.sql.Connection;
 import java.sql.PreparedStatement;
+import java.sql.ResultSet;
+import java.sql.Statement;

 public class ReplyDao {
    public int save(SaveReqDto dto) {
+        System.out.println(dto);
        String sql = "insert into reply(userId, boardId, content, createDate) values(?, ?, ?, now())";
        Connection conn = DB.getConnection();
        PreparedStatement pstmt = null;
-
+        ResultSet rs = null;
+        int generatedKey;
        if (conn != null) {
            try {
-                pstmt = conn.prepareStatement(sql);
+                pstmt = conn.prepareStatement(sql, Statement.RETURN_GENERATED_KEYS);
                pstmt.setInt(1, dto.getUserId());
                pstmt.setInt(2, dto.getBoardId());
                pstmt.setString(3, dto.getContent());
                int result = pstmt.executeUpdate();
-                return result;
+                rs = pstmt.getGeneratedKeys();
+                if(rs.next()) {
+                    generatedKey = rs.getInt(1);
+                    if (result == 1 ) return generatedKey;
+                }
            } catch (Exception e) {
                e.printStackTrace();
            } finally {
@@ -28,4 +37,33 @@ public class ReplyDao {
        }
        return -1;
    }
+
+    public Reply findById(int id) {
+        String sql = "select * from reply where id = ?";
+        Connection conn = DB.getConnection();
+        PreparedStatement pstmt = null;
+        ResultSet rs = null;
+
+        if (conn != null) {
+            try {
+                pstmt = conn.prepareStatement(sql);
+                pstmt.setInt(1, id);
+                rs = pstmt.executeQuery();
+                if (rs.next()) {
+                    Reply reply = Reply.builder()
+                            .id(rs.getInt("id"))
+                            .userId(rs.getInt("userId"))
+                            .boardId(rs.getInt("boardId"))
+                            .content(rs.getString("content"))
+                            .build();
+                    return reply;
+                }
+            } catch (Exception e) {
+                e.printStackTrace();
+            } finally {
+                DB.close(conn, pstmt, rs);
+            }
+        }
+        return null;
+    }
 }
--- a/jspblog/src/main/java/com/example/jspblog/service/ReplyService.java
+++ b/jspblog/src/main/java/com/example/jspblog/service/ReplyService.java
@@ -1,5 +1,6 @@
 package com.example.jspblog.service;

+import com.example.jspblog.domain.reply.Reply;
 import com.example.jspblog.domain.reply.ReplyDao;
 import com.example.jspblog.domain.reply.dto.SaveReqDto;

@@ -14,4 +15,8 @@ public class ReplyService {
    public int 댓글쓰기(SaveReqDto dto) {
        return replyDao.save(dto);
    }
+
+    public Reply 댓글찾기(int id) {
+        return replyDao.findById(id);
+    }
 }
--- a/jspblog/src/main/java/com/example/jspblog/util/Script.java
+++ b/jspblog/src/main/java/com/example/jspblog/util/Script.java
@@ -1,10 +1,22 @@
 package com.example.jspblog.util;

+import com.example.jspblog.domain.board.dto.CommonRespDto;
+
 import javax.servlet.http.HttpServletResponse;
 import java.io.IOException;
 import java.io.PrintWriter;

 public class Script {
+    public static void responseData(HttpServletResponse response, String jsonData) {
+        PrintWriter out;
+        try {
+            out = response.getWriter();
+            out.print(jsonData);
+            out.flush();
+        } catch (IOException e) {
+            e.printStackTrace();
+        }
+    }

    public static void back(HttpServletResponse response, String msg) {
        PrintWriter out;
--- a/jspblog/src/main/java/com/example/jspblog/web/ReplyController.java
+++ b/jspblog/src/main/java/com/example/jspblog/web/ReplyController.java
@@ -1,9 +1,12 @@
 package com.example.jspblog.web;

+import com.example.jspblog.domain.board.dto.CommonRespDto;
+import com.example.jspblog.domain.reply.Reply;
 import com.example.jspblog.domain.reply.dto.SaveReqDto;
 import com.example.jspblog.service.BoardService;
 import com.example.jspblog.service.ReplyService;
 import com.example.jspblog.util.Script;
+import com.google.gson.Gson;

 import javax.servlet.ServletException;
 import javax.servlet.annotation.WebServlet;
@@ -11,7 +14,9 @@ import javax.servlet.http.HttpServlet;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
 import javax.servlet.http.HttpSession;
+import java.io.BufferedReader;
 import java.io.IOException;
+import java.io.PrintWriter;

@WebServlet("/reply")
 public class ReplyController extends HttpServlet {
@@ -30,22 +35,25 @@ public class ReplyController extends HttpServlet {

        switch (cmd) {
            case "save": {
-                int userId = Integer.parseInt(request.getParameter("userId"));
-                int boardId = Integer.parseInt(request.getParameter("boardId"));
-                String content = request.getParameter("content");
-
-                SaveReqDto dto = SaveReqDto.builder()
-                        .userId(userId)
-                        .boardId(boardId)
-                        .content(content)
-                        .build();
+                BufferedReader br = request.getReader();
+                String reqData = br.readLine();
+                Gson gson = new Gson();
+                SaveReqDto dto = gson.fromJson(reqData, SaveReqDto.class);
+                System.out.println(dto);

+                CommonRespDto<Reply> commonRespDto = new CommonRespDto<>();
+                Reply reply = null;
                int result = replyService.댓글쓰기(dto);
-                if (result == 1) {
-                    response.sendRedirect("/jspblog/board?cmd=detail&id=" + boardId);
+                if (result != -1) {
+                    reply = replyService.댓글찾기(result);
+                    commonRespDto.setStatusCode(1);
+                    commonRespDto.setData(reply);
                } else {
-                    Script.back(response, "댓글쓰기 실패");
+                    commonRespDto.setStatusCode(-1);
                }
+
+                String responseData = gson.toJson(commonRespDto);
+                Script.responseData(response, responseData);
                break;
            }
        }
--- a/jspblog/src/main/webapp/board/detail.jsp
+++ b/jspblog/src/main/webapp/board/detail.jsp
@@ -31,35 +31,15 @@
                <div class="panel panel-info">
                    <div class="panel-heading m-2"><b>Comment</b></div>
                    <div class="panel-body">
-                        <form action="${pageContext.request.contextPath}/reply?cmd=save" method="post">
-                            <input type="hidden" name="userId" value="${sessionScope.principal.id}">
-                            <input type="hidden" name="boardId" value="${detail.id}">
-                            <textarea id="reply__write__form" name="content" class="form-control" placeholder="write a comment..." rows="2"></textarea>
+                        <textarea id="reply__write__form" class="form-control" placeholder="write a comment..." rows="2"></textarea>
                        <br>
-                            <button class="btn btn-primary pull-right">댓글쓰기</button>
-                        </form>
+                        <button onclick="replySave(${sessionScope.principal.id}, ${detail.id})" class="btn btn-primary pull-right">댓글쓰기</button>
                        <div class="clearfix"></div>
                        <hr />

                        <!-- 댓글 리스트 시작-->
                        <ul id="reply__list" class="media-list">
-
                            <!-- 댓글 아이템 -->
-                            <li id="reply-1" class="media">
-                                <img src="${pageContext.request.contextPath}/images/profile.jpg" class="img-circle" style="width: 50px; height: 50px;" alt="profile-image"/>
-                                <div class="media-body">
-                                    <strong class="text-primary">홍길동</strong>
-                                    <p>
-                                        댓글입니다.
-                                    </p>
-                                </div>
-                                <div class="m-2">
-
-                                    <i onclick="" class="material-icons">delete</i>
-
-                                </div>
-                            </li>
-
                        </ul>
                        <!-- 댓글 리스트 끝-->
                    </div>
@@ -76,26 +56,7 @@
        $('#content').append(content[0].data)
    })
 </script>
-<script>
-    function deleteById(boardId) {
-        const data = {
-            boardId : boardId
-        }
+<script src="${pageContext.request.contextPath}/js/boardDetail.js"></script>

-        $.ajax({
-            type: "post",
-            url: "/jspblog/board?cmd=delete",
-            data: JSON.stringify(data),
-            contentType: "application/json; charset=utf-8",
-            dataType: "json"
-        }).done(function(result){
-            if (result.statusCode === 1) {
-                location.href = "index.jsp";
-            } else {
-                alert("삭제 실패");
-            }
-        });
-    }
-</script>
 </body>
 </html>
--- a/jspblog/src/main/webapp/js/boardDetail.js
+++ b/jspblog/src/main/webapp/js/boardDetail.js
@@ -0,0 +1,56 @@
+function addReply(data) {
+    let replyItem = `<li id="reply-${data.id}" class="media">
+        <img src="/jspblog/images/profile.jpg" class="img-circle"
+        style="width: 50px; height: 50px;" alt="profile-image"/>
+        <div class="media-body">
+        <strong class="text-primary">${data.userId}</strong>
+        <p>${data.content}</p></div>
+        <div class="m-2">
+        <i onClick="deleteReply(${data.id})" class="material-icons">delete</i></div></li>`
+    $('#reply__list').prepend(replyItem);
+}
+
+function deleteReply(id) {
+    console.log(id);
+}
+
+function replySave(userId, boardId) {
+    console.log(userId)
+    let data = {
+        userId: userId,
+        boardId: boardId,
+        content: $("#reply__write__form").val(),
+    }
+
+    $.ajax({
+        type: "post",
+        url: "/jspblog/reply?cmd=save",
+        data: JSON.stringify(data),
+        contentType: "application/json; charset=utf-8",
+        dataType: "json",
+    }).done(function (result){
+        if (result.statusCode === 1){
+            addReply(result.data);
+        }
+    })
+}
+
+function deleteById(boardId) {
+    let data = {
+        boardId : boardId
+    }
+
+    $.ajax({
+        type: "post",
+        url: "/jspblog/board?cmd=delete",
+        data: JSON.stringify(data),
+        contentType: "application/json; charset=utf-8",
+        dataType: "json"
+    }).done(function(result){
+        if (result.statusCode === 1) {
+            location.href = "index.jsp";
+        } else {
+            alert("삭제 실패");
+        }
+    });
+}