12_spring_(ajax사용한 댓글)

12_spring_(ajax사용한 댓글)

·

1. 댓글 등록

Vo

package com.kh.spring.board.model.vo; import java.sql.Timestamp; public class Reply { private int replyNo; private String replyContent; private Timestamp replyModifyDate; private int boardNo; private int memberNo; // insert, update, delete, select용 private String memberId; // select용 public Reply() { } public Reply(int replyNo, String replyContent, Timestamp replyModifyDate, int boardNo, int memberNo, String memberId) { super(); this.replyNo = replyNo; this.replyContent = replyContent; this.replyModifyDate = replyModifyDate; this.boardNo = boardNo; this.memberNo = memberNo; this.memberId = memberId; } public int getReplyNo() { return replyNo; } public void setReplyNo(int replyNo) { this.replyNo = replyNo; } public String getReplyContent() { return replyContent; } public void setReplyContent(String replyContent) { this.replyContent = replyContent; } public Timestamp getReplyModifyDate() { return replyModifyDate; } public void setReplyModifyDate(Timestamp replyModifyDate) { this.replyModifyDate = replyModifyDate; } public int getBoardNo() { return boardNo; } public void setBoardNo(int boardNo) { this.boardNo = boardNo; } public int getMemberNo() { return memberNo; } public void setMemberNo(int memberNo) { this.memberNo = memberNo; } public String getMemberId() { return memberId; } public void setMemberId(String memberId) { this.memberId = memberId; } @Override public String toString() { return "Reply [replyNo=" + replyNo + ", replyContent=" + replyContent + ", replyModifyDate=" + replyModifyDate + ", boardNo=" + boardNo + ", memberNo=" + memberNo + ", memberId=" + memberId + "]"; } }

Jsp

$("#addReply#).on("click", function(){ var memberNo; // 회원 번호 var boardNo = "${board.boardNo}"; // 글번호 var replyContent = $("#replyContent").val(); // 댓글내용 // 로그인 여부 검사 if(${loginMember == null}) { alert("로그인 후 이용해 주세요."); } else { // Session에서 회원 번호를 얻어옴. // ""를 하지 않으면 변수명 처럼 인식됨 memberNo = "${loginMember.memberNo}"; // 자바 스크립트 객체 방식으로 작성 $.ajax({ url : "insertReply", type : "POST", data : {"replyContent" : replyContent, "boardNo" : boardNo, "memberNo" : memberNo}, success : function(result){ var msg; switch(result) { case 1 : //성공 msg = "댓글 등록 성공"; // 내용을 작성한 textarea를 다 지워줌 $("#replyContent").val(""); selectRlist(); // selectRlist()함수 호출 break; case 0 : //등록실패 msg = "댓글 등록 실패"; break; case -1 : msg = "댓글 등록 오류 발생"; break; } alert(msg); }, error : function(){ console.log("ajax 통신 실패"); } }); } }); // 댓글 목록 조회 함수 function selectRlist() { var boardNo = "${board.boardNo}"; $.ajax({ url : "selectReplyList", type : "POST" data : {"boardNo" : boardNo}, dataType : "json", // javascriptObjectNation success : function(rList){ // $붙으면 이 변수를 대상으로 jquery 메소드를 사용가능 // 없으면 그냥 변수임 var $rArea = $("#replyListArea"); // jQuery 변수 : 변수에 jQuery 메소드를 사용할 수 있음 // console.log(rList); // javascript는 isEmpty가 없음 // javascript 빈리스트 확인은 rList = [] // 하지만 json은 string이므로 ""(빈문자열)로 비교 if(rList == "") { // 조회할 댓글이 없는 경우 $rArea.html("

  • 등록된 댓글이 없습니다
    • "); } else { $rArea.html(""); // 기존 댓글 목록 삭제 $.each(rList : function(i){ var $li = $("
  • "); var $rWriter = $("").prop( "class","rWriter").html(rList[i].memberId); // admin var $rDate = $("").prop( "class","wDate").html(rList[i].memberModifyDate); var $rContent = $("

    ").prop("class","replyContent") .html(rList[i].replyContent) var $hr = $("

    "); // 메소드 체이닝 $li.append($rWriter).append($rDate).append("$rContent"); $rArea.append($li).append($hr); }); } }, error : function(){ console.log("댓글 목록 조회 ajax 통신 실패"); } }); } $(function(){ selectRlist(); // 10초마다 댓글 갱신 setInterval(function(){ selectRlist }, 10000); });

    Controller

    // 댓글 등록 // 그냥 result 하면 -1, 0, 1값이 전달되므로 페이지 이동이 아니라 // 불러온값을 response에 담기 위해 ResponseBody 어노테이션 작성 @ResponseBody @RequestMapping("insertReply") public int insertReply(Reply reply) { int result = 0; try { result = boardService.insertReply(reply); } catch (Exception e) { e.printStackTrace(); result = -1; } return result; } // 댓글 목록 조회 // JSON : 자바스크립트 객체 모양의 String // ajax에서는 filter에서 문자열을 잡아주지 못함 // produces : 조건에 지정한 미디어 타입과 관련된 응답을 생성하는데 사용한 실제 컨텐츠 타입을 보장한다 // --> 응답 데이터의 Content-Type 지정가능 // text/html; charset=utf-8 @ResponseBody @RequestMapping(value="selectReplyList", produces="application/json; charset=utf-8) public String selectReplyList(int boardNo){ // ajax에서 에러를 처리해줌으로 // try catch를 안해줘도됨(다른방법도 있음) List rList = boardService.selectReplyList(boardNo); // JSON으로 담아도 되지만 편한 방법인 GSON으로 사용 // yyyy-MM-dd hh:mm:ss Gson gson = new GsonBuilder().setDateFormat("yyyy-MM-dd hh:mm:ss").create(); return gson.toJson(rList); }

    ServiceImpl

    /** 게시글 댓글 등록용 Service * @param reply * @return result * @throws Exception */ @Transactional(rollbackFor = Exception.class) @Override public int insertReply(Reply reply) throws Exception { // 태그 안에 는 \r

    으로 인식되고 // form태그 안에 있찌않으면

    으로 인식됨 reply.setReplyContent(reply.getReplyContent().replace("

    ", "")); return boardDAO.insertReply(reply); } /** 게시글 댓글 목록 조회용 Service * @param boardNo * @return rList */ @Override public List selectReplyList(int boardNo) { return boardDAO.selectReplyList(boardNo); }

    DAO

    /** 게시글 댓글 등록용 DAO * @param reply * @return result * @throws Exception */ public int insertReply(Reply reply) throws Exception { return sqlSession.insert("boardMapper.insertReply", reply); } /** 게시글 댓글 목록 조회용 DAO * @param boardNo * @return rList */ public List selectReplyList(int boardNo) { return sqlSession.selectList("boardMapper.selectReplyList", boardNo); }

    Mapper

    INSERT INTO REPLY VALUES( SEQ_RNO.NEXTVAL, #{replyContent}, DEFAULT, DEFAULT, DEFAULT, #{boardNo}, #{memberNo} ) SELECT * FROM V_REPLY WHERE BOARD_NO = #{boardNo} ORDER BY REPLY_NO DESC

    from http://spike1574.tistory.com/112 by ccl(A) rewrite - 2020-03-16 12:54:26

    • 댓글

    댓글 쓰기

    이 블로그의 인기 게시물

    2020 LCK 롤챔스 Spring 경기 재개 및 일정

    2020 LCK 롤챔스 Spring 경기 재개 및 일정 2020 LCK 스프링이 3월 6일을 마지막으로 코로나19 확산 방지를 위해 중단되었었지만, 오늘 3월 25일을 시작으로 재개되었다. https://kr.leagueoflegends.com/ko-kr/news/esports/2020-lckga-dolaopnida/ (2020-lckga-dolaopnida ?) 스프링 정규 리그는 4월 16일에 종료 되며, 주 5일 2 match씩 진행하였던 기존 일정과 다르게 하루에 세 match씩 진행하게 된다. 첫 경기는 17시 시작에서 15시 시작으로 변경되었으며 앞선 경기가 끝나면 바로 뒷 경기가 이어진다. 1R 경기는 오프라인 무관중 경기로 진행했었으나 2R 경기는 온라인으로 진행된다. 또한 LCK 분석 데스크는 하지 않는 것으로 결정되었다. 오늘 경기를 보면, Pro View나 경기 후 MVP 인터뷰는 유지되는 것으로 보인다. from http://blog.lockcept.kr/103 by ccl(A) rewrite - 2020-03-25 20:54:27
    자세한 내용 보기

    데이터 바인딩 추상화 - propertyEditor

    데이터 바인딩 추상화 - propertyEditor 데이터 바인딩 org.springframework.validation.DataBinder java.beans.PropertyEditor https://docs.spring.io/spring/docs/current/javadoc-api/org/springframework/validation/DataBinder.html WEB MVC에만 특화된 것이 아니라 여러 곳에서 쓰이는 스프링 핵심 기술 기술적인 관점 프로퍼티 값을 타겟 객체에 설정하는 기능 사용자 관점 사용자 입력값을 애플리케이션 도메인 모델에 동적으로 변환해 넣어주는 기능. 입력값은 대부분 "문자열"인데, 그 값을 객체가 가지고 있는 int, long, Boolean, Date 등 심지어 Event, Book 같은 도메인 타입으로도 변환해서 넣어주는 기능. PropertyEditor public class EventEditor extends PropertyEditorSupport{ @Override public String getAsText() { Event event = (Event)getValue(); return event.getId().toString(); } @Override public void setAsText(String text) throws IllegalArgumentException { setValue(new Event(Integer.parseInt(text))); } } 스프링 3.0 이전까지 DataBinder 가 변환 작업 사용하던 인터페이스 getValue 는 PropertyEditorSupport 가 받은 객체를 가져올 수 있다. getValue와 setValue는 객체를 공유 하고 있으며 PropertyEditor가 가지고 있는 값 이다. 서로 다른 쓰레드에 공유 를 한다.( 쓰레드-세이프 하지 않음 ) Bean 으로 등록해서 쓰지 말아야 한다. Ob...
    자세한 내용 보기

    Spring Web Form

    Spring Web Form 1. Data Binding - request parameter들은 어떻게 해당 오브젝트로 옮겨질까 Naive solution - @RequestParam annotaion을 사용하여 메서드 매개 변수와 bind 해준다. ex) @RequestMapping("/deget") public String doGet( @RequestParam("name") String name){ ... } -> 이런 식으로 받은 매개변수를 객체를 만들어 set 해주는 방식 - @RequestParam annotaion을 사용하여 메서드 매개 변수와 bind 해준다. ex) @RequestMapping("/deget") public String doGet( @RequestParam("name") String name){ ... } -> 이런 식으로 받은 매개변수를 객체를 만들어 set 해주는 방식 Spring Data Binding - form에서 오는 매개변수를 자동으로 객체에 바인딩 시켜준다. ex) @RequestMapping(value="/docreate", method=RequestMethod.POST) public String doGet(Offer offer){ ... } -> Spring이 자동적으로 offer객체에 받은 requestParameter를 넣어준다. 바인딩 되는 과정 Dispatcher Servlet에서 요청을 받음 새로운 form bean이 인스턴스화된다. form bean은 requestParameter에서 채워진다. form bean이 모델에 추가된다. bean을 Controller로 전달 Controller에서 Dispatcher Serlvet에 Model 객체를 전달한다. Dispatcher Servelt에서 View로 Model 객체를 전달 후 View는 객체를 사용하여 r...
    자세한 내용 보기