2.4.2.1. バリデーションエラーのメッセージを画面表示する¶

サーバサイドで行ったバリデーションのエラーメッセージは、 HTTPエラー制御ハンドラでリクエストスコープに格納される。テンプレートエンジンでは、リクエストスコープに格納された ErrorMessages にアクセスすることでエラーメッセージを表示できる。リクエストスコープの変数名は、エラーメッセージのリクエストスコープへの設定を参照。

補足

JSPを使用した場合、カスタムタグを使用したエラー表示を使用することでエラーメッセージの表示ができるが、カスタムタグが出力するDOM構造の制約によりCSSフレームワークとの相性が悪い問題がある。

リクエストスコープ上のオブジェクトを使用した場合、DOM構造の制約がなくなるためJSPでも直接リクエストスコープ上のオブジェクトにアクセスしエラーメッセージを表示しても良い。

以下に Thymeleaf を使った場合の実装例を示す。

特定のプロパティに対応したメッセージを表示したい

ErrorMessages#hasError や ErrorMessages#getMessage を使用することでプロパティ(入力項目のname属性の値)に対応したエラー有無やメッセージの表示ができる。

この例では、 form.userName プロパティに対応したエラーメッセージがリクエストスコープにある場合にメッセージが表示される。

<input type='text' name='form.txt' />
<span class="error" th:if="${errors.hasError('form.userName')}"
    th:text="${errors.getMessage('form.userName')}">入力してください。</span>

グローバルメッセージ(プロパティに紐付かないメッセージ)を表示したい

ErrorMessages#getGlobalMessages() を使用してグローバルメッセージが表示できる。

<ul>
  <li th:each="message : ${errors.globalMessages}" th:text="${message}"></li>
</ul>

全てのメッセージを表示したい

ErrorMessages#getAllMessages() を使用して全てのメッセージが表示できる。

<ul>
  <li th:each="message : ${errors.allMessages}" th:text="${message}">エラーメッセージ</li>
</ul>