:: 답변 등록
- 답변 입력 텍스트 창, 등록버튼, 버튼 누르면 저장되도록 구현
등록버튼 HTML
th:action="@{/XXX/XXX}"어떤 url로 보낼지 명시
<form th:action="@{|/answer/create/${question.id}|}" method="post">
<textarea name="content" id="content" rows="15"></textarea>
<input type="submit" value="답변등록">
</form>Controller
- 템플릿 답변 내용에 해당하는
textarea의 name 속성값 (content)과 답변을 입력한 내용 얻기 위해 추가된@RequestParam String content의 변수명은 같아야 한다.
@PostMapping("/create/{id}")
public String createAnswer(Model model, @PathVariable("id") Integer id, @RequestParam String content) {
Question question = this.questionService.getQuestion(id);
// TODO: 답변을 저장한다.
return String.format("redirect:/question/detail/%s", id);
}Service
- 답변 저장하기
- 입력받은 question과 content를 사용해 Answer 객체 생성 후 저장
public void create(Question question, String content) {
Answer answer = new Answer();
answer.setContent(content);
answer.setCreateDate(LocalDateTime.now());
answer.setQuestion(question);
this.answerRepository.save(answer);
}Controller 저장하기 추가
this.answerService.create(question, content);저장된 답변 표시하기 HTML
- 답변 등록 form 위에 위치
lists.size(이터러블객체)객체 길이 반환
<h5 th:text="|${#lists.size(question.answerList)}개의 답변이 있습니다.|"></h5>
<div>
<ul>
<li th:each="answer : ${question.answerList}" th:text="${answer.content}"></li>
</ul>
</div>stylesheet 적용
<link rel="stylesheet" type="text/css" th:href="@{/style.css}">:: 부트스트랩
- 다운로드 후
bootstrap.min.css파일 static 폴더 안에 저장하기 - 부트스트랩 적용하기 -> 부트스트랩 컴포넌트
부트스트랩 클래스 설명 card,card-body,card-text부트스트랩 Card 컴포넌트 badge부트스트랩 Badge 컴포넌트 form-control부트스트랩 Form 컴포넌트 border-bottom아래방향 테두리 선 my-3상하 마진값 3 py-2상하 패딩값 2 p-2상하좌우 패딩값 2 d-flex justify-content-end컴포넌트의 우측 정렬 bg-light연회색 배경 text-dark검은색 글씨 text-start좌측 정렬 btn btn-primary부트스트랩 버튼 컴포넌트
:: 템플릿 상속
- 모든 템플릿이 상속해야할 layout.html 템플릿 작성
- 중복 안녕~
<!doctype html>
<html lang="ko">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<!-- Bootstrap CSS -->
<link rel="stylesheet" type="text/css" th:href="@{/bootstrap.min.css}">
<!-- sbb CSS -->
<link rel="stylesheet" type="text/css" th:href="@{/style.css}">
<title>Hello, sbb!</title>
</head>
<body>
<!-- 기본 템플릿 안에 삽입될 내용 Start -->
<th:block layout:fragment="content"></th:block> <!--상속할 템플릿들이 구현-->
<!-- 기본 템플릿 안에 삽입될 내용 End -->
</body>
</html>- layout.html을 상속한 템플릿 작성
<html layout:decorate="~{layout}">
<div layout:fragment="content"> <!--가장 최상단 태그 맨 앞에 넣기-->
<html>