폼 바인딩과 유효성 검사는 사용자 입력을 효과적으로 처리하고 관리해준다.
(타임리프에서는 th:object 을 사용해서 처리한다)
폼 바인딩 >>
폼을 통해 전달된 데이터를 특정 객체에 직접 바인딩한다.
th:object 속성을 사용해서 폼 데이터를 객체에 매핑한다.
예시:
<form action="#" th:action="@{/register}" th:object="${userForm}" method="post">
<input type="text" th:field="*{username}" />
<input type="password" th:field="*{password}" />
<button type="submit">Register</button>
</form>
위 코드에서 th:object="${userForm}" 은 userForm 객체에 폼 데이터를 바인딩한다.
th:field 는 userForm 객체의 각 속성과 연결되어, 사용자가 입력한 데이터를 해당 속성에 자동으로 할당한다.
폼 유효성 검사 >>
서버 측에서 스프링의 @Valid 어노테이션을 사용해서 객체를 검증한다.
@PostMapping("/register")
public String register(@Valid @ModelAttribute("userForm") UserForm userForm, BindingResult result) {
if (result.hasErrors()) {
return "form";
}
// 사용자 등록 로직
return "redirect:/success";
}
위 코드에서 @Valid 는 userForm 객체의 유효성을 검사하고, BindingResult 는 검사 결과를 담는다.
에러가 있을 시, 폼을 다시 표시한다.
<form action="#" th:action="@{/register}" th:object="${userForm}" method="post">
<input type="text" th:field="*{username}" />
<p th:if="${#fields.hasErrors('username')}" th:errors="*{username}">Username Error</p>
<input type="password" th:field="*{password}" />
<p th:if="${#fields.hasErrors('password')}" th:errors="*{password}">Password Error</p>
<button type="submit">Register</button>
</form>
위 코드는 사용자가 폼을 제출했을 때 발생한 에러를 사용자에게 피드백한다.
th:errors 를 사용해서 에러 메시지를 표시한다.
(위에서는 username 과 password 필드에 대한 에러를 각각 표시한다.)
---
24년 1월 23일 작성된 글입니다
'JAVA > SpringBoot' 카테고리의 다른 글
타임리프의 인라인 표현식과 국제화:동적 웹 개발과 다국어 지원 (0) | 2024.03.26 |
---|---|
타임리프를 활용한 웹 페이지 레이아웃과 디자인 (0) | 2024.03.26 |
타임리프의 표현식과 예제 (0) | 2024.03.26 |
타임리프(Thymeleaf)로 동적 웹 페이지 생성: 기본 설정 (0) | 2024.03.26 |
Spring Boot에서 spring.jpa.hibernate.ddl-auto 설정 이해하기 (0) | 2024.03.25 |