Spring/Spring 공부

[spring] 댓글 2. 댓글 출력

congs 2023. 6. 12. 14:17

 

= boardComment.js ==

 

1-1. boardComment. js에 값을 가져와서 출력하는 구문 작성

async function spreadCommentFromServer(bno){
	console.log(bno);
	try {
		const resp = await fetch('/comment/'+bno);
		const result = await resp.json();
		return result
	} catch (error) {
		console.log(error);
	}
}

function getCommentList(bno){
	spreadCommentFromServer(bno).then(result => {
		console.log(result);
		const ul = document.getElementById("cmtListArea");
		if(result.length > 0){
			ul.innerHTML = ""; //기존의 값을 비우고
			for(let cvo of result){
				let li = `<li data-cno="${cvo.cno}"><div>`;
				li += `<div>${cvo.writer}</div>`;
				li += `<input type="text" id="cmtTextMod" value="${cvo.content}">`;
				li += `<span>${mod_date}</span></div>`;
				li += `<button type="button" class= "modBtn">%</button>`;
				li += `<button type="button" class= "delBtn">X</button></li>`;
				ul.innerHTML += li;
			}
		}else{ //없는 경우에는 없다는 안내
			let li = `<li>Comment List Empty</li>`;
			ul.innerHTML += li;
		}
	})
}

 

1-2. boardComment. js에 getCommentToServer() 실행코드 추가

 getCommentToServer(cmtData.bno);

상단에 추가!


 

 == detail.jsp ==

 

2. detail.jsp에 js실행부분 추가 작성

  • 위치: <body>태그 안 

<script type="text/javascript">
	getCommentList(bnoVal);
</script>

 


 

 == CommentController ==

 

3. CommentController에 list메서드 생성 : 해당 게시물 번호로 저장된 댓글리스트 출력

@GetMapping(value="/{bno}", produces = {MediaType.APPLICATION_JSON_VALUE})
	//consumes은 알아서 가져옴
	private ResponseEntity<List<CommentVO>> spread(@PathVariable("bno") int bno){
		log.info(">>>comment LIst bno = " + bno);
		//DB 요청
		List<CommentVO> list = csv.getList(bno);
		return new ResponseEntity<List<CommentVO>>(list, HttpStatus.OK);
}

4. CommentController에 연결해 생성

CommentService


CommentServiceImpl


CommentDAO


CommentMapper

  <select id="getList" resultType="com.myweb.www.domain.CommentVO">
  	select * from comment where bno = #{bno}
  </select>

 


 

== 실행 화면 ==