09009

[Spring Boot] 게시판 연습 (5) - 게시글 수정 및 삭제 본문

Back-End/Spring
[Spring Boot] 게시판 연습 (5) - 게시글 수정 및 삭제
09009

게시글 수정

 

- 상세 화면에서 수정 버튼 클릭

- 서버에서 해당 게시글의 정보를 가지고 수정 화면을 출력

- 제목, 내용 수정

 

detail.html 확인

 

BoardController

    @GetMapping("/update/{id}")
    public String updateForm(@PathVariable Long id, Model model) {
        // 해당 게시글 정보 가져오기
        BoardDTO boardDTO = boardService.findById(id);
        model.addAttribute("boardUpdate", boardDTO);
        return "update";
    }

 

update.html

<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>update</title>
</head>
<body>
    <form action="/board/update" method="post" name="updateForm">
        <input type="hidden" name="id" th:value="${boardUpdate.id}">
        writer: <input type="text" name="boardWriter" th:value="${boardUpdate.boardWriter}" readonly> <br>
        pass: <input type="text" name="boardPass" id="boardPass"> <br>
        title: <input type="text" name="boardTitle" th:value="${boardUpdate.boardTitle}"> <br>
        contents: <textarea name="boardContents" cols="30" rows="10" th:text="${boardUpdate.boardContents}"></textarea> <br>
        <input type="hidden" name="boardHits" th:value="${boardUpdate.boardHits}">
        <input type="button" value="글수정" onclick="boardUpdate()">
    </form>

<script th:inline="javascript">
    const boardUpdate = () => {
      const pass = [[${boardUpdate.boardPass}]];
      const inputPass = document.getElementById("boardPass").value;
      if (pass == inputPass) {
        document.updateForm.submit();
      } else {
        alert("비밀번호가 일치하지 않습니다!");
      }
    }
</script>

</body>

 

코드 설명

const pass = [[${boardUpdate.boardPass}]]; → DB에서 가져온 비밀번호

const inputPass → 사용자가 입력한 비밀번호

document.updateForm.submit(); → 현재 문서의 updateForm이라는 name을 가진 form을 제출

여기에서 [수정] 클릭

 

일치하지 않은 비밀번호를 입력할 경우

 

BoardController

아직 service 클래스에 update 메서드 작성 안 함.

    @PostMapping("/update")
    public String update(@ModelAttribute BoardDTO boardDTO, Model model) {
        BoardDTO board =  boardService.update(boardDTO); // board: 수정이 반영된 후의 객체
        model.addAttribute("board", board);
        return "detail";
//        return "redirect:/board/" + boardDTO.getId(); 조회수를 올리는 코드를 작성했기 때문에 여기서는 redirect 시키지 않는다
    }

 

 

BoardService

** JPA에서 update를 따로 수행해주는 메서드는 없다.

Spring Data JPA는 save() 를 이용하여 update, insert도 수행한다.

해당 id값이 없을 경우 insert, 해당 id값이 존재할 때 entity 객체가 넘어올 경우 jpa는 update로 인식

    public BoardDTO update(BoardDTO boardDTO) {
         BoardEntity boardEntity = BoardEntity.toUpdateEntity(boardDTO);
         boardRepository.save(boardEntity);
         return findById(boardDTO.getId());
    }

 

BoardEntity

수정 시, 기존의 id값과 조회수를 가져와서 Entity로 변환해주어야 한다.

    public static BoardEntity toUpdateEntity(BoardDTO boardDTO) {
        BoardEntity boardEntity = new BoardEntity();
        boardEntity.setId(boardDTO.getId());
        boardEntity.setBoardWriter(boardDTO.getBoardWriter());
        boardEntity.setBoardPass(boardDTO.getBoardPass());
        boardEntity.setBoardTitle(boardDTO.getBoardTitle());
        boardEntity.setBoardContents(boardDTO.getBoardContents());
        boardEntity.setBoardHits(boardDTO.getBoardHits());
        return boardEntity;
    }

 

 

BoardService

    public BoardDTO update(BoardDTO boardDTO) {
         BoardEntity boardEntity = BoardEntity.toUpdateEntity(boardDTO);
         boardRepository.save(boardEntity);
         return findById(boardDTO.getId());
    }

 

 

[수정] 버튼 클릭

[글수정] 클릭

 


게시글 삭제

 

detail.html 코드 일부

 

BoardController

    @GetMapping("/delete/{id}")
    public String delete(@PathVariable Long id) {
        boardService.delete(id);
        return "redirect:/board/";
    }

 

BoardService

    public void delete(Long id) {
        boardRepository.deleteById(id);
    }