728x90
반응형
Spring Boot + H2 Database + JPA + Thymeleaf 을 활용해
간단한 게시판을 작성해보고자 합니다.
오늘 다룰 내용은 게시판 글 수정 기능입니다.
| * 개발환경 Spring Boot : 2.4.3 Java 11 Thymeleaf Maven War Lombok |
1. 상세보기 화면에 수정 버튼 추가
게시글 내용 밑에 수정버튼을 추가한다.
이때, 수정버튼은 수정할 수 있는 페이지로 이동하는 것이기 때문에 GET방식을 이용한다.
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<h2 th:text="${boardDto.title}"></h2>
<p th:text="${boardDto.content}"></p>
<!-- 수정 or 삭제 -->
<div>
<a th:href="@{'/board/edit/' + ${boardDto.id}}">
<button>수정</button>
</a>
</div>
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
</script>
</body>
</html>
2. 수정 기능 추가
상세보기 화면에서 수정버튼을 클릭하면, 수정화면으로 이동한다.
이때 수정화면의 내용은 상세보기 화면과 동일하므로, 상세보기에서 사용한 서비스를 사용한다.
@GetMapping("/board/edit/{no}")
public String edit(@PathVariable("no") Long id, Model model){
BoardDto boardDto = boardService.getPost(id);
model.addAttribute("boardDto", boardDto);
return "board/edit";
}
3. 수정 화면 만들기
(등록화면을 수정화면과 같이 사용하는 방법이 있었던 것 같지만, 기억이 나지않아 화면을 새로 생성하였다)
수정화면은 상세보기 화면과 내용은 동일하지만
해당 내용을 form으로 감싸고 있고, 해당 값을 수정할 수 있다는 차이가 있다.
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form th:action="@{'/board/edit'}" method="post" th:object="${boardDto}">
<input type="hidden" name="_method" value="put"/>
<input type="hidden" name="id" th:value="*{id}"/>
제목 : <input type="text" name="title" th:value="*{title}"/><br>
<!-- 작성자 : <input type="text" name="writer" th:value="*{writer}"/><br>-->
<textarea name="content" th:text="*{content}"></textarea>
<input type="submit" value="저장">
</form>
</body>
</html>
4. 수정 기능 추가
수정화면에서 값을 수정 후 저장버튼을 클릭하면 동작하는 기능이다.
이때 수정은 등록과 기능이 동일하므로, 동일한 서비스를 이용한다.
수정 후에는 상세보기 화면으로 이동하여 수정사항을 보여준다.
@PostMapping("/board/edit")
public String edit(BoardDto dto){
boardService.savePost(dto);
return "redirect:/board/"+dto.getId();
}
728x90
반응형
'Web 개발 > 게시판 만들기' 카테고리의 다른 글
| [Spring Boot/Thymeleaf] Thymeleaf layout 설정 (0) | 2022.08.16 |
|---|---|
| [Spring Boot/JPA] 게시판을 통해 MVC, CRUD 연습하기 5 - 삭제 (0) | 2021.06.28 |
| [Spring Boot/JPA] 게시판을 통해 MVC, CRUD 연습하기 3 - 상세보기 (0) | 2021.02.16 |
| [Spring Boot/JPA] 게시판을 통해 MVC, CRUD 연습하기 2 - 등록 (0) | 2021.02.09 |
| [Spring Boot/JPA] 게시판을 통해 MVC, CRUD 연습하기 1 - 목록 (0) | 2021.02.08 |
