#author("2019-11-15T16:12:58+08:00","default:Admin","Admin") Thymeleaf

让我们看看当有错误的时候如何给一个表单域一个CSS类：

<input type="text" th:field="*{datePlanted}" 
               th:class="${#fields.hasErrors('datePlanted')}? fieldError" />

可以看到，#fields.hasErrors(...)函数接受一个表达式参数(datePlanted),返回一个布尔值告诉field该字段是否有验证错误。

我们可以根据他们各自的field获取所有的错误：

<ul>
  <li th:each="err : ${#fields.errors('datePlanted')}" th:text="${err}" />
</ul>

通过迭代，我们可以使用th:errors,一个专门用于创建一个通过制定选择器筛选的错误列表的属性，通过分隔。

<input type="text" th:field="*{datePlanted}" />
<p th:if="${#fields.hasErrors('datePlanted')}" th:errors="*{datePlanted}">Incorrect date</p>

简单错误基础css样式，th:errorclass在上边的例子中，如果字段有错误，将为表单的input域设置一个css类，因为这种方式很常见，Thymeleaf提供了一个特定的属性为 th:errorclass

应用于form域的标签(input,select,textarea等)，它将从现有的name属性或th:field属性字段的名词相同的属性，如果发生错误，则将制定的css类追加到标签中。

<input type="text" th:field="*{datePlanted}" class="small" th:errorclass="fieldError" />

如果datePlanted发生错误,则：

<input type="text" id="datePlanted" name="datePlanted" value="2013-01-01" class="small fieldError" />

全部错误 †

[edit]

如果我们想要在form中显示所有的错误呢？我们只需要通过'*'或'all'(等价)来查询#field.hasErrors(...)方法和#field.errors(...)方法：

<ul th:if="${#fields.hasErrors('*')}">
  <li th:each="err : ${#fields.errors('*')}" th:text="${err}">Input is incorrect</li>
</ul>

在上边的例子中，我们得到所有的错误并迭代他们：

<ul>
  <li th:each="err : ${#fields.errors('*')}" th:text="${err}" />
</ul>

建立一个以分隔的列表：

<p th:if="${#fields.hasErrors('all')}" th:errors="*{all}">Incorrect date</p>

最后，注意#field.hasErrors("")等效的属性#fields.hasAnyErrors()和#fields.errors()的等效的#fields.allErrors(),可以使用喜欢的任何语法。

<div th:if="${#fields.hasAnyErrors()}">
  <p th:each="err : ${#fields.allErrors()}" th:text="${err}">...</p>
</div>

全局错误 †

[edit]

Spring表单还有一种错误，全局错误，都是些不与窗体的任何特定字段关联的错误。

Thymeleaf提供了一个global的常量来访问这些错误。

<ul th:if="${#fields.hasErrors('global')}">
  <li th:each="err : ${#fields.errors('global')}" th:text="${err}">Input is incorrect</li>
</ul>

• Incorrect date

以及等效的#field.hasGlobalErrors()和#field.globalErrors()方法。

<div th:if="${#fields.hasGlobalErrors()}">
  <p th:each="err : ${#fields.globalErrors()}" th:text="${err}">...</p>
</div>

在表单外部显示错误 †

[edit]

表单验证错误也可以在表单外部显示，方法是通过变量(即${...})的内部选择变量(*{...})增加表单bean的名字作为前缀的方式。

<div th:errors="${myForm}">...</div>
<div th:errors="${myForm.date}">...</div>
<div th:errors="${myForm.*}">...</div>

<div th:if="${#fields.hasErrors('${myForm}')}">...</div>
<div th:if="${#fields.hasErrors('${myForm.date}')}">...</div>
<div th:if="${#fields.hasErrors('${myForm.*}')}">...</div>

<form th:object="${myForm}">
    ...
</form>

富错误对象 †

[edit]

Thymeleaf提供了以bean的形式(代替单纯的String)提供错误信息的能力，包括fieldName(String),message(String),和global(String)属性的错误。

这些错误可以通过工具方法#fields.datailedErrors()来实现：

<ul>
    <li th:each="e : ${#fields.detailedErrors()}" th:class="${e.global}? globalerr : fielderr">
        <span th:text="${e.global}? '*' : ${e.fieldName}">The field name</span> |
        <span th:text="${e.message}">The error message</span>
    </li>
</ul>

コメント：

お名前:

(画像の文字列を入力して下さい)