= 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에 연결해 생성
<select id="getList" resultType="com.myweb.www.domain.CommentVO">
select * from comment where bno = #{bno}
</select>
== 실행 화면 ==
'Spring > Spring-eclipse' 카테고리의 다른 글
[spring] security 0. DB생성, pom.xml작성 (0) | 2023.06.22 |
---|---|
[spring] 파일 입출력 (0) | 2023.06.13 |
[spring] 댓글 1. 댓글 작성 (0) | 2023.06.09 |
[spring] 댓글 0. 테이블 생성, STS 기본 생성 (0) | 2023.06.09 |
[spring] 2. 회원 가입 (0) | 2023.06.05 |