ThymeLeaf-将表数据（ArrayList）发送到另一个控制器

Question

我很难在Thymeleaf帖子中绑定一个ObjectList。

我正在尝试使用Spring5和ThymeLeaf来实现以下要求

1. User uploads a Excel File
2. Display data in HTML Table (For Java Script Data Validation)
3. Allow User to Delete Invalid Rows  (from Inmemory User Specific ArrayList)
4. Display Remaining Values
5. POST valid remaining values to Server

我计划在每行添加一个删除按钮。和一个Submit按钮，用于将所有剩余行保存在DB中。

如何将eachRowList转发到另一个控制器（用于删除操作和数据库保存）。

@PostMapping("/load-excel")
public ModelAndView loadFile(@RequestParam("fileName") MultipartFile file,
         @RequestParam("selectedApplicationName") String selectedApplicationName,RedirectAttributes redirectAttr,Model model) {

        List<EachRowinExcel> eachRowList = fileReaderService.convertExceltoObjList();
        ....

        modelAndView.addObject("eachRowList", eachRowList);

        return modelAndView;
}



 <tr th:each="eachRow : ${eachRowList}">
              <td th:text="${eachRow.column1}"></td>
              <td th:text="${eachRow.column2}"></td>
              <td th:text="${eachRow.column3}"></td>
              <td th:text="${eachRow.column4}"></td>
              <td th:text="${eachRow.column5}"></td>
              <td th:text="${eachRow.column6}"></td>
              <td th:text="${eachRow.column7}"></td>
              <!-- Special Columns -->
              <th:block th:each="customColumnValue:${eachRow.customColumnsList}">
                <td th:text="${customColumnValue}"></td>
              </th:block> 

            </tr>

更新1：

修改视图

<form action="#" th:action="@{/access/delete}" th:object="${form}" method="post">
    <table id="accessRequestDataTable"  class="display compact" style="width:100%">
      <thead>
        <tr>
          <!-- Headers -->       
        </tr>
      </thead>
      <tbody>
     <tr th:each="eachRow, iter : ${form.eachRowList}">
          <td  th:text="${eachRow.accessReqeustCounter}" th:field="*{eachRowList[__${iter.index}__].accessReqeustCounter}"></td>
          <td  th:text="${eachRow.accessReqeustID}" th:field="*{eachRowList[__${iter.index}__].accessReqeustID}"></td>
          <td  th:text="${eachRow.accessRequestType}" th:field="*{eachRowList[__${iter.index}__].accessRequestType}"></td>
          <td  th:text="${eachRow.userProfile}" th:field="*{eachRowList[__${iter.index}__].userProfile}"></td>
          <td  th:text="${eachRow.userFinalName}" th:field="*{eachRowList[__${iter.index}__].userFinalName}"></td>
          <td  th:text="${eachRow.userLoginName}" th:field="*{eachRowList[__${iter.index}__].userLoginName}"></td>
          <td  th:text="${eachRow.userEmail}" th:field="*{eachRowList[__${iter.index}__].userEmail}"></td>

          <td>              
            <button class="btn btn-danger btn-sm" 
            type="submit" value="submit">Delete</button>             
          </td>
        </tr>        

      </tbody>
    </table>
  </form>

@RequestMapping(value = "/access/delete", method = RequestMethod.POST)
public ModelAndView deleteUserFromTable(@ModelAttribute("form") EachRowListWrapper eachRowListWrapper){
    System.out.println(eachRowListWrapper.getEachRowList().size());
    ModelAndView modelAndView = new ModelAndView();
    eachRowListWrapper.getEachRowList().remove(0);
    modelAndView.setViewName("access-table");
    return modelAndView;        
}

  <thead>
    <tr>              
      <th scope="col">User Name</th>
      <th scope="col">Login</th>
      <th scope="col">Email</th>
      <th:block th:each="key, iter : ${form.customColumns}">
        <th th:text="${key}" scope="col"></th>
        <input type="hidden" th:field="${form.customColumns[__${iter.index}__]}" />
      </th:block> 
      <th scope="col">Action</th>
    </tr>
  </thead>

最终更新：

显然th：field输入标签不会绑定在thead部分（它不应该有输入字段LoL）。在我在表开始之前移动它后，一切都按预期工作。

Answer 1

您需要将表放在表单中，表单将决定在控制器的th：object字段中发送给控制器的内容。这在Spring中称为命令对象。在本例中，让我们假设您的“eachrowList”列表位于一个名为“form”的命令对象内。

<form method="post"
        th:action="@{/mappingInYourController}"
        th:object="${form}">
<!-- Here goes your table -->
</form>

您还必须指定哪些数据将放置在您在th：object中定义的对象中，以便将其发送到控制器。这是通过输入th：fields以以下方式完成的（您的某一行的示例）：

<tr th:each="eachRow, iter : ${form.eachRowList}">
<!-- ... -->
<td> <input th:value="${eachRow.column1}" th:field="*{eachRowList[__${iter.index}__].column1}"/>
</td>

请注意，当您使用*{}访问属性时，您引用的是定义为表单的th：object中的属性。

现在，如果您提交带有按钮的表单，您的控制器将能够在命令对象“form”中使用eachRowList列表，该列表的元素将是表输入中的元素。如果您不希望这些输入可以在表中内联编辑，可以使用以下方法进行编辑：

th:readonly="true"