Thymeleaf+Spring Boot Webflow表单提交异常问题（涉及th:each与按钮）

嘿，我来帮你搞定Thymeleaf结合Spring Webflow时，带th:each循环的表单提交失败的问题！先从你提供的可正常工作的phoneLookup表单说起，对比着排查常见的坑：

先贴出你提供的正常表单代码做参考：

<form class="" autocomplete="off" th:object="${user}" method="post" role="form">
  <div class="row" style="margin-top: 20px">
    <div class="input-field col s8 offset-s2">
      <input th:field="*{phoneNo}" id="icon_telephone" type="number" class="validate" 
             style="height: 160px !important; text-align: center; font-size: 100px" data-length="10">
      <label for="icon_telephone" style="font-size: 40px">Telephone</label>
      <!-- 其他表单元素 -->
    </div>
  </div>
</form>

结合带th:each循环的场景，我整理了几个最容易踩的坑和解决办法：

1. 循环内表单元素的绑定路径要精准 #

当用th:each遍历集合时，th:field的表达式必须对应到根对象（也就是th:object="${user}"的user）下的集合属性，不能直接写循环项的属性。比如如果user里有个phones列表，正确的写法应该是：

<div th:each="phone, stat : ${user.phones}">
  <!-- 用循环状态变量stat的索引定位集合元素 -->
  <input th:field="*{phones[__${stat.index}__].number}" type="number" class="validate">
</div>

要是直接写*{phone.number}，Thymeleaf会找不到对应的绑定路径，自然提交不了。

2. 避免循环生成重复的ID #

循环里的表单元素如果用固定ID，会导致页面出现重复ID，浏览器解析时会出问题。可以结合stat变量生成唯一ID：

<input th:field="*{phones[__${stat.index}__].number}" 
       th:id="'phone_input_' + ${stat.index}" 
       type="number" class="validate">
<label th:for="'phone_input_' + ${stat.index}">Phone Number</label>

3. 确保Spring Webflow能追踪循环的集合变量 #

Spring Webflow对表单绑定的变量有严格要求：你遍历的集合必须是流程中定义的变量（比如user）的属性，而不是临时生成的集合。要是你循环的是一个临时创建的列表，Webflow没法追踪这些元素的变化，提交时自然拿不到数据。

4. 检查按钮的提交配置 #

如果是循环内的按钮触发提交，要确保按钮属于表单内部，或者通过form属性指定对应的表单ID（如果按钮在表单外）。另外，Spring Webflow里可以给按钮指定动作值，让流程能正确响应：

<form th:object="${user}" method="post" th:id="user_phone_form">
  <div th:each="phone, stat : ${user.phones}">
    <!-- 表单元素 -->
    <button type="submit" th:name="_eventId" th:value="savePhone">保存当前号码</button>
  </div>
</form>

这里的_eventId是Webflow识别动作的默认参数名，也可以根据你的流程配置调整。

5. 调试提交的表单参数 #

实在找不到问题的话，打开浏览器开发者工具的Network面板，看一下表单提交时的参数名是否符合预期——正常情况下，集合元素的参数名应该是phones[0].number、phones[1].number这种格式，如果参数名不对，后端肯定绑定不上数据。

要是这些方法还没解决问题，把你带th:each的表单代码贴出来，我再帮你针对性排查！

内容的提问来源于stack exchange，提问作者Marios