ThymeleafでBindingResultのエラーメッセージを表示させる方法

ThymeleafでBindingResultのエラーメッセージを表示させる方法

ThymeleafでBindingResultのエラーメッセージを表示させるためには、以下の手順に従って実装します。

1. コントローラーの実装

まず、Spring MVCのコントローラーでフォームのバリデーションを設定します。
BindingResultは、フォームのバリデーションエラーを保持します。

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.validation.BindingResult;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.ModelAttribute;
import javax.validation.Valid;

@Controller
public class MyController {

  @GetMapping("/form")
  public String showForm(Model model) {
    model.addAttribute("formData", new FormData());
    return "form";
  }

  @PostMapping("/submit")
  public String submitForm(@ModelAttribute @Valid FormData formData, BindingResult result, Model model) {
    if (result.hasErrors()) {
      return "form";
    }
    // フォームデータの処理
    return "result";
  }
}

2. フォームのモデルクラス

フォームデータを保持するモデルクラスも必要です。
バリデーションアノテーションを使って、検証ルールを定義します。

import javax.validation.constraints.NotEmpty;

public class FormData {

  @NotEmpty(message = "このフィールドは必須です")
  private String textField;

  // ゲッターとセッター
}

3. Thymeleafテンプレートの実装

Thymeleafテンプレートでエラーメッセージを表示します。
th:errorsを使って、BindingResultからエラーメッセージを表示します。

<body>
  <form action="#" th:action="@{/submit}" th:object="${formData}" method="post">
    <div>
      <label for="textField">テキストフィールド:</label>
      <input type="text" id="textField" th:field="*{textField}" />
      <div th:if="${#fields.hasErrors('textField')}" th:errors="*{textField}"></div>
    </div>
    
    <button type="submit">送信</button>
  </form>
</body>

説明

  • th:object属性でフォームデータオブジェクトを指定します。
  • th:field属性でフォームフィールドを指定し、BindingResultでエラーがある場合はth:errorsを使用してエラーメッセージを表示します。
  • #fields.hasErrors('fieldName')で特定のフィールドにエラーがあるかどうかをチェックできます。

これで、フォームにエラーがある場合にエラーメッセージが表示されるようになります。