[LifeSoft] spring 22강 게시판만들기3 (상세화면, 댓글쓰기/댓글목록/댓글갯수)

board/view.jsp 글일기페이지를 구현한다.

 

글읽기에서 ckeditor를 추가하고 이미지를 업로드 해본다.

 

댓글 기능을 구현한다.

 

 

-- 댓글 테이블
drop table reply cascade constraints;
create table reply (
rno number not null primary key, -- 댓글번호
bno number default 0,            -- 원글번호
replytext varchar2(1000) not null, -- 댓글내용
replyer varchar2(50) not null,   -- 댓글 작성자 아이디
regdate date default sysdate,    -- 댓글 작성 날짜
updatedate date default sysdate  -- 댓글 수정 날짜
);
-- foreign key 제약조건 추가
alter table reply add constraint fk_board
foreign key(bno) references board(bno);
 
 
-- 시퀀스 생성 (댓글 번호 관리를 위한)
drop sequence reply_seq;
create sequence reply_seq
start with 1
increment by 1;

 

 

board/view.jsp 에 댓글 작성을 위한 코드를 추가한다.

<form>안에 넣지 않고 ajax 기술을 이용해서 서버에 올린다.

 

<!-- 댓글작성 -->
<div style="width: 700px; text-align: center;">
<c:if test="${sessionScope.userid != null}">
    <textarea id="replytext" rows="5" cols="80" placeholder="댓글을 작성해주세요"></textarea>
    <br>
     <button type="button" id="btnReply">댓글쓰기</button>
</c:if>
</div>
<!-- 댓긂 목록을 출력할 영역 -->
<div id="listReply"></div>

 

 

4) model.board.dto.ReplyDTO.java

 

public class ReplyDTO {
    private Integer rno;
    private Integer bno;
    private String replytext;
    private String replyer;
    private String name;
    private Date regdate;
    private Date updatedate;
    private String secret_reply;
    private String writer;
      // getter(), setter(), toString()
}

 

 

board/view.jsp에서 댓글전송을 위한 html코드와 자바스크립트를 추가한다.

 

     <!-- 댓글작성 -->
     <div style="width: 700px; text-align: center;">
     <c:if test="${sessionScope.userid != null}">
      <textarea id="replytext" rows="5" cols="80" placeholder="댓글을 작성해주세요"></textarea>
      <br>
      <button type="button" id="btnReply">댓글쓰기</button>
     </c:if>
     </div>
     <!-- 댓긂 목록을 출력할 영역 -->
     <div id="listReply"></div>

 

 

$(function(){
 $("#btnReply").click(function(){
  reply();
 });
});
function reply() {
 var $replytext = ${"#replytext"}.val();
 var bno="${dto.bno}";
 var param={"replytext":$replytext, "bno":bnol};
 $.ajax({
  type: "post",
  url: "${path}/reply/insert.do",
  data: param,
  success: function() {
   alert("댓글이 등록되었습니다.")
  }
 }); 
}