- 해당 작성자와 같은 아이디로 로그인 하면 댓글 좌측에 수정,삭제버튼이 보이게
- 수정버튼 클릭 시 display:none 으로 숨겨져있던 댓글수정 폼이 나오게 스크립트문 작성
- 위 수정버튼 클릭 시 페이지가 리로드되어 , 해당리로드를 막기위해 버튼에 event 추가
- 수정취소시 위 스크립트문의 반대로 실행이 취소되도록 스크립트문 추가
- 수정폼에 댓글 작성후 수정완료시 컨트롤러로 넘어가 답변이 set되도록 컨트롤러, 서비스 메서드 추가
컨트롤러
@PreAuthorize("isAuthenticated()")
@PostMapping("/modify/{id}")
public String marketAnswerModify(@Valid MarketAnswerForm marketAnswerForm, BindingResult bindingResult,
@PathVariable("id") Integer id, Principal principal) {
MarketAnswer marketAnswer = this.marketAnswerService.getMarketAnswer(id);
if (bindingResult.hasErrors()) {
return String.format("redirect:/market/detail/%s", marketAnswer.getMarket().getId());
}
if (!marketAnswer.getAuthor().getUsername().equals(principal.getName())) {
throw new ResponseStatusException(HttpStatus.BAD_REQUEST, "수정권한이 없습니다.");
}
this.marketAnswerService.modify(marketAnswer, marketAnswerForm.getContent());
return String.format("redirect:/market/detail/%s", marketAnswer.getMarket().getId());
}
서비스
public void modify(MarketAnswer marketAnswer, String content) {
marketAnswer.setContent(content);
marketAnswer.setModifyDate(LocalDateTime.now());
this.marketAnswerRepository.save(marketAnswer);
}
html 템플릿
<textarea name="content" id="content" rows="10"
placeholder= "수정할 내용을 작성해주세요"></textarea>
<button class="reply_summit" type="submit" value="답변수정">답변수정</button>
<button class="reply_summit_exit" type="button" value="취소" onclick="hideFormModifyBox(event, this)">수정취소</button>
</form>
</div>
<!--수정 끝-->
<!-- 댓글 하단바 -->
<div class="answerCreateBox">
<div class="answerCreateDate">
<span>작성일:</span>
<span th:text="${MarketAnswer.createDate}"></span>
<!-- 수정/삭제버튼 -->
</div>
<div class="answerModifyRemove">
<a href="#" sec:authorize="isAuthenticated()" class="modify btn btn-sm btn-outline-secondary"
th:if="${MarketAnswer.author != null and #authentication.getPrincipal().getUsername() == MarketAnswer.author.username}"
th:text="수정" onclick="showFormModifyBox(event, this)" >
<button type="button" class="answermodify_btn">수정</button>
</a>
<a href="javascript:void(0);" th:data-uri="@{|/marketAnswer/delete/${MarketAnswer.id}|}"
class="delete btn btn-sm btn-outline-secondary"
sec:authorize="isAuthenticated()"
th:if="${MarketAnswer.author != null and #authentication.getPrincipal().getUsername() == MarketAnswer.author.username}"
th:text="삭제">
<button type="button" class="answerremove_btn">삭제</button>
</a>
<!-- 수정/삭제버튼 끝 -->
</div>
</div>
<!-- 댓글 하단바 끝 -->
</div>
<!-- <div>-->
<!-- <ul>-->
<!-- <li th:each="answer : ${article.answerList}" th:text="${answer.content}"></li>-->
<!-- </ul>-->
<!-- </div>-->
<div class="formbox">
<form th:action="@{|/marketAnswer/create/${market.id}|}"
th:object="${marketAnswerForm}" method="post" class="formboxform">
<textarea name="content" id="content" rows="10"
placeholder="내용을 입력해 주세요"></textarea>
<input class="reply_summit" type="submit" value="답변등록">
</form>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- 원래글쓰기버튼자리 -->
<!-- 리뷰 박스 끝 -->
<!--footer-->
</div>
<footer>
<div class="footer-content">
<p>© 2023 Your Website. All rights reserved.</p>
<nav>
<a href="http://localhost:8080/mypage">Home</a>
<a href="#">About</a>
<a href="#">Contact</a>
</nav>
</div>
</footer>