728x90
반응형
이번에는 작성한 작성한 게시글의 상세보기 페이지를 만들어 볼것이다.
/freeboard에서 게시글 목록이 나오면 그 중 하나의 제목을 클릭하면 /freeboard/detail/{boardId}로 이동하고 그 글의 제목, 내용, 작성자 작성일 등 여러가지 상세 정보를 readonly로 보여주려고 한다.
1. freeboard.html
freeboard.html을 다시 한번 보는 이유는 상세보기를 누를 때 해당 게시글의 boardId가 필요하기 때문이다. 게시글의 목록에서 제목에 하이퍼링크로 /freeboard/detail/{boardId}를 보낸다. URL에 boardId를 보내서 boardId로 해당 글에 대한 정보를 찾을 수 있도록 했다.
<tbody>
<!--5번-->
<!--list에 testboard가 담겨있는것을 하나씩 빼준다-->
<tr th:each="post : ${list}">
<td th:text="${post.boardId}"></td>
<td th:text="${post.author}"></td>
<td>
<a th:href="@{/freeboard/detail/{boardId}(boardId=${post.boardId})}" th:text="${post.title}"></a>
</td>
<td th:text="${#temporals.format(post.createdDate, 'yyyy-MM-dd')}"></td>
</tr>
</tbody>2. PostController.java
@PathVariable로 URL에 들어온 boardId를 받아서 해당 boardId에 대한 데이터를 가져온 후 model에 넣어서 보내준다.
//상세보기
@GetMapping("/detail/{boardId}")
public String PostDetail(@PathVariable("boardId") Long boardId, Model model) {
Post post = postService.findPostDetail(boardId);
model.addAttribute("post", post);
return "/board/postdetail";
}3. postdetail.html
post라는 변수에 담겨온 post객체값을 차례대로 출력해준다.
<body>
<tbody>
<div class="container">
<div class="py-5 text-center">
<h2>게시글 상세조회</h2>
</div>
<button class="btn btn-dark pull-right" th:onclick="|location.href='@{/freeboard}'|" type="button">목록으로
</button>
<div>
<label for="postId">게시판번호</label>
<input type="text" id="postId" name="postId" class="form-control" th:value="${post.boardId}" readonly>
</div>
<div>
<label for="postTitle">제목</label>
<input type="text" id="postTitle" name="postTitle" class="form-control" th:value="${post.title}" readonly>
</div>
<div>
<label for="postContent">내용</label>
<textarea class="form-control" rows="5" id="postContent" name="postContent" th:text="${post.content}" readonly></textarea>
</div>
<div>
<label for="writer">작성자</label>
<input type="text" id="writer" name="writer" class="form-control" th:value="${post.author}" readonly>
</div>
<div>
<label for="registerDate">작성일</label>
<input type="text" id="registerDate" name="registerDate" class="form-control" th:value="${#temporals.format(post.createdDate, 'yyyy-MM-dd HH:mm')}" readonly>
</div>
<hr class="my-4">
<button class="btn btn-primary" th:onclick="|location.href='@{/freeboard/update/{boardId}(boardId=${post.boardId})}'|" type="button">수정</button>
<form th:action="@{/freeboard/delete/{boardId}(boardId=${post.boardId})}" method="post">
<button class="btn btn-danger" type="submit">삭제</button>
</form>
</div> <!-- /container -->
</tbody>
</body>
4. PostService.java
여기서는 controller에서 URL로 받은 boardId를 파라미터로 받아 즉 PK값으로 해당 Id를 repository에 보내서 Id에 대응되는 Post객체를 받아와서 반환한다.
@Service
@RequiredArgsConstructor
public class PostService {
private final MemberService memberService;
private final PostRepository postRepository;
public Post findPostDetail(Long boardId) {
return postRepository.findByBoardId(boardId);
}
}5. PostRepository.java
findByBoardId 메서드는 BoardId로 해당되는 Post객체를 반환해주는 함수이다.
public interface PostRepository extends JpaRepository<Post, Long>{
List<Post> findAllByOrderByCreatedDateDesc();
Post findByBoardId(Long boardId);
}
여기 까지 잘 따라왔으면 /freeboard의 글 목록에서 제목을 누르게 되면 실제로 잘 받아오고 readonly로 값을 못 바꾼다!
성공~!
만들고 싶은 서비스를 스스로 공부하고 만들어 보면서 기록하는 개인 공부 블로그입니다.
내용 중 최적화가 가능한 부분 혹은 궁금한 점은 언제든지 댓글로 남겨주세요🧐
728x90
반응형
'Projects > 식단 짜주는 웹' 카테고리의 다른 글
| [Spring/식단 추천 API] 게시판 글 삭제 기능 구현 - 7 (0) | 2023.11.20 |
|---|---|
| [Spring/식단 추천 API] 게시판 글 수정 기능 구현 - 6 (0) | 2023.11.18 |
| [Spring/식단 추천 API] 게시판 글 작성 기능 구현 - 4 (1) | 2023.11.16 |
| [Spring/식단 추천 API] 게시판 글 목록 페이지 구현 - 3 (0) | 2023.11.16 |
| [Spring/식단 추천 API] 로그인 기능 구현 - 2 (1) | 2023.11.11 |
