【Spring Boot(Thymeleaf)】th:fieldが機能せずBeanValidationが実装できない

##環境

Mac OS Big Sur
Spring Boot 2.4.2
Apache Maven
IDE STS

##エラー内容

http://localhost:8080/customer/にアクセスするとlist.htmlに。
しかし開くと以下のエラーが発生しました。

list-htmlの14行目がおかしいと表示されています。

An error happened during template parsing (template: "class path resource [templates/customers/list.html]")
org.thymeleaf.exceptions.TemplateInputException: An error happened during template parsing (template: "class path resource [templates/customers/list.html]")
(中略)
Caused by: org.attoparser.ParseException: Error during execution of processor 'org.thymeleaf.spring5.processor.SpringInputGeneralFieldTagProcessor' (template: "customers/list" - line 14, col 58)
	at org.attoparser.MarkupParser.parseDocument(MarkupParser.java:393)
	at org.attoparser.MarkupParser.parse(MarkupParser.java:257)
	at org.thymeleaf.templateparser.markup.AbstractMarkupTemplateParser.parse(AbstractMarkupTemplateParser.java:230)
	... 48 more
(中略)

##ソースコード

CustomerContollerでリクエストを受け取り画面遷移を行います。

CustomerContoroller
1package com.example.thymeleaf_test.web;
2
3import java.util.List;
4
5import org.springframework.beans.BeanUtils;
6import org.springframework.beans.factory.annotation.Autowired;
7import org.springframework.stereotype.Controller;
8import org.springframework.ui.Model;
9import org.springframework.validation.BindingResult;
10import org.springframework.validation.annotation.Validated;
11import org.springframework.web.bind.annotation.GetMapping;
12import org.springframework.web.bind.annotation.PostMapping;
13import org.springframework.web.bind.annotation.RequestMapping;
14
15import com.example.thymeleaf_test.domain.Customer;
16import com.example.thymeleaf_test.service.CustomerService;
17
18@Controller
19@RequestMapping("customers")
20public class CustomerController {
21	@Autowired
22	CustomerService customerService;
23	
24	@GetMapping
25	String list(Model model) {
26		List<Customer> customers  = customerService.findAll();
27		model.addAttribute("customers", customers);
28		return "customers/list";
29	}
30
31	@PostMapping(path = "create")
32	String create(@Validated CustomerForm form, BindingResult result, Model model) {
33		if (result.hasErrors()) {
34			return list(model);
35		}
36		Customer customer = new Customer();
37		BeanUtils.copyProperties(form, customer);
38		customerService.create(customer);
39		return "redirect:/customers";
40	}
41	
42}

customerFormはこうなっています。

CustomerForm
1package com.example.thymeleaf_test.web;
2
3import lombok.Data;
4import javax.validation.constraints.Size;
5import javax.validation.constraints.NotNull;
6
7@Data
8public class CustomerForm {
9  @NotNull
10  @Size(min = 1, max = 127)
11  private String firstName;
12  @NotNull
13  @Size(min = 1, max = 127)
14  private String lastName;
15
16}

viewのlist.htmlです。

list.html
1
2<!DOCTYPE html>
3<html  xmlns:th="http://www.thymeleaf.org/">
4<head>
5  <meta charset="UTF-8">
6  <meta http-equiv="X-UA-Compatible" content="IE=edge">
7  <meta name="viewport" content="width=device-width, initial-scale=1.0">
8  <title>顧客一覧</title>
9</head>
10<body>
11  <form th:action="@{/customers/create}" th:object="${customerForm}" method="POST">
12    <dl>
13      <dt><label for="lastName">姓</label></dt>
14      <dd>
15        <input type="text" id="lastName" name="lastName" th:field="*{lastName}" th:errorclass="error-input" value="山田"/>
16        <span th:if="${#fields.hasErrors('lastName')}" th:errors="*{lastName}" class="error-message">error!</span>
17      </dd>
18    </dl>
19    <dl>
20      <dt><label for="firstName">名</label></dt>
21      <dd>
22        <input type="text" id="firstName" name="firstName" th:field="*{firstName}" th:errorclass="error-input" value="太郎"/>
23        <span th:if="${#fields.hasErrors('firstName')}" th:errors="*{firstName}" class="error-message">error!</span>
24      </dd>
25    </dl>
26    <input type="submit" value="作成">
27  </form>
28  <table>
29    <tr th:each="customer : ${customers}">
30      <td th:text="${customer.id}">100</td>
31      <td th:text="${customer.lastName}">山田</td>
32      <td th:text="${customer.firstName}">太郎</td>
33      <td>
34        <form th:action="@{/customer/edit}" method="GET">
35          <input type="submit" name="form" value="編集">
36          <input type="hidden" name="id" th:value="${customer.id}"/>
37        </form>
38      </td>
39      <td>
40        <form th:action="@{/customer/delete}" method="POST">
41          <input type="submit" value="削除">
42          <input type="hidden" name="id" th:value="${customer.id}"/>
43        </form>
44      </td>
45    </tr>
46  </table>
47</body>
48</html>
49

14行目を中心に確認しましたが見当がつかなかったので質問させていただきました。
アドバイスいただきたいです。よろしくお願いします。

行動規範の内容に同意します

回答1件

ベストアンサー

thymeleafで th:object="${customerForm}" と呼んでいますが、
modelには設定されていない為、lastNameを呼んだタイミングで
そんなものはないとエラーになっているようです。

とりあえず動かしたいだけならmodelにcustomerFormを設定すれば良いでしょう。

@GetMapping
String list(Model model) {
  List<Customer> customers  = customerService.findAll();
  model.addAttribute("customers", customers);
  model.addObject("customerForm", new CustomerForm());
  return "customers/list";
}

投稿2021/02/17 00:08