[82일차] ajax를 활용한 댓글게시판 만들기

댓글-> (ajax + jQuery)

 

---

 

여기서 시작

 

1.테이블 만들기

[ 기본 테이블 ]

​

create table student(
 sno varchar2(3) ,
 sname nvarchar2(10),
 year varchar2(10),
 dept nvarchar2(10) ,
 constraint   student_sno_pk   primary  key(sno));
[ 댓글에 필요한 테이블 ]

Create  table  student_reply(
 idx  number(3)  not  null  primary  key,  -- 테이블에  P.K 만들기 
 sno  varchar2(3)  not  null,   -- Student 테이블과 외래키로 연결할 컬럼 만들기 
 reply nvarchar2(500)  not  null,  -- 댓글 내용 저장 ( 상담내용 )
 replayer  nvarchar2(10) not  null,  -- 댓글 작성자 
 replyDate  date  default sysdate,  -- 댓글 작성일
) ;

create  sequence  seq_replay;  

--  student 테이블의  sno 와 외래키로 연결하기 
alter  table   student_reply  add  constraint  fk_student_reply
foreign  key(sno)  references  student(sno);

[ 샘플 레코드 추가  ] 

insert  into  student_reply ( idx, sno, reply, replayer ) 
values (seq_replay.nextval, '100', '첫번째 성적 상담 입니다.','담임선생님' );

insert  into  student_reply ( idx, sno, reply, replayer ) 
values (seq_replay.nextval, '100', '두번째 친구 상담','상담선생님' );

insert  into  student_reply ( idx, sno, reply, replayer ) 
values (seq_replay.nextval, '200', '진로 상담.','담임선생님' );

insert  into  student_reply ( idx, sno, reply, replayer ) 
values (seq_replay.nextval, '300', '취업 상담 입니다.','담임선생님' );

select  *  from  student_reply;

* 커밋해주기 

2. 학생등록하기 테이블 아래 select 테이블 만들기 

패키지랑 클래스 만들기

인터페이스에 메소드 List<ReplyVo> selectAll(ReplyVo vo) ;

 

package com.springbook.biz.reply;

import java.util.Date;

import lombok.Data;

@Data
public class ReplyVo {
	private int idx;
	private String sno;
	private String reply;
	private String replayer;
	private Date replyDate;
	private String replyDateStr;
}

ReplyVo 내용 써주기 

sql-map-config.xml 에 reply 내용 추가해주기

 

mappings에 reply-mapping.xml 만들기

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE mapper 
PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN" 
"http://mybatis.org/dtd/mybatis-3-mapper.dtd">

<mapper namespace="REPLY">

<select id="getBoardList"  parameterType="reply"   resultType="reply"  >
  select idx, sno, reply, replayer, replyDate
  from  student_reply where sno=#{sno} order by idx desc
</select>

</mapper>

 

package com.springbook.view;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

import com.springbook.biz.examtbl.ExamtblVo;
import com.springbook.biz.reply.ReplyService;
import com.springbook.biz.reply.ReplyVo;
import com.springbook.biz.university.CourseGroupVo;
import com.springbook.biz.university.CourseVo;
import com.springbook.biz.university.EnrolVo;
import com.springbook.biz.university.SECJoinVo;
import com.springbook.biz.university.SEJoinVo;
import com.springbook.biz.university.StudentVo;
import com.springbook.biz.university.UniversityService;

@Controller
public class UniversityController {

	@Autowired
	private UniversityService  service;
	@Autowired
	private ReplyService  replyservice;
    
    	@RequestMapping(value="studentEdit.do")
	public String studentEdit( Model  model, StudentVo vo, ReplyVo rvo  ) {
		model.addAttribute("m", service.studentEdit(vo));
		model.addAttribute("li", replyservice.selectAll(rvo) );
		return "university/studentEdit.jsp";		
	}
    
    }

UniversityController에 ReplyService 추가해주고 selectAll 내용 넣기

 

university/studentEdit.jsp 파일에 값 불러와서 테이블 만들기 

<div align=center>
<table border=1 width=700>
<tr>
<th>순번</th><th>학번</th><th>글쓴이</th><th>상담내용</th><th>상담날짜</th><th>삭제</th>
</tr>
<c:forEach items="${li}" var="m" >

<tr align="center"> 
 <td> ${m.idx} </td>
 <td> ${m.sno} </td>
 <td> ${m.replayer}</td>
 <td> ${m.reply} </td>
 <td><fmt:formatDate pattern="yyyy-MM-dd" value="${m.replyDate}"/> 
  </td>
  <td><button onClick=delK(${m.idx},${m.sno})>삭제</button></td>
 </tr>
</c:forEach>

</table>

</div>

 

 

 

---

3. 위에 두 테이블 사이에 insert 테이블 만들기 

 

 

4. delete 삭제버튼 만들기