Spring and Thymeleaf: Sending an object to a controller from a th:each table

Question

I am making a table of experience data using the th:each attribute with Thymeleaf and my goal is to have a submit button in each row that, when clicked, will send an experience object to my controller that corresponds with the row I clicked the submit button in.

I have no idea whats wrong and can't seem to find anything online to help with this problem.

Here is my section of webpage code:

<div th:unless="${#lists.isEmpty(borrower.experiences)}">
    <h2>List of Experiences</h2>
    <!--  <form ACTION="#" th:action="@{/initiate-edit}" th:object="${experience}"
      method="POST">-->
        <table id="your-table-id">
          <thead>
            <tr>
              <td>Edit Buttons</td>
                <th>Date Planted</th>
                <th>Rating</th>
                <th>Category</th>
                <th>Dept</th>
                <th>Resolution</th>
                <th>Source</th>
                <th>Last Update Date</th>
                <th>Last Update Name</th>
                <th>Comment</th>
            </tr>
          </thead>
          <tbody>
              <tr th:each="experience : ${borrower.experiences}">       
                <td>
                  <form ACTION="#" th:action="@{/initiate-edit}" 
                    th:object="${experience}" method="POST">
                    <!--<a th:href="@{/initiate-edit/}">CLICK</a>-->
                    <button type="submit">Submit</button>
                  </form>
                </td>
                <td th:text="${experience.experienceDate}">13/01/2014</td>
                <td th:text="${experience.rating}">4</td>
                <td th:text="${experience.categoryShortDesc}">Account and Billing</td>
                <td th:text="${experience.deptDesc}">Account and Billing</td>
                <td th:text="${experience.resolutionShortTx}">Account and Billing</td>
                <td th:text="${experience.source}">Account and Billing</td>
                <td th:text="${experience.lastUpdateDate}">Account and Billing</td>
                <td th:text="${experience.lastUpdatedName}">Account and Billing</td>
                <td th:text="${experience.commentsShort}">Account and Billing</td>    
              </tr>             
            </tbody>
       </table>    
</div>

Here is the method I am sending it to:

@RequestMapping(value = "/initiate-edit", method = RequestMethod.POST)
    public String initiateEdit(@AuthenticationPrincipal final User user, 
                               @ModelAttribute("SpringWeb")CustomerExperience editableExperience, final Model model) {

        LOG.info("THIS IS A TEST!!!" + editableExperience.getSsn());

        model.addAttribute("editableExperience", editableExperience);

        return EDIT_PAGE;

    }

Answer 1

You need to fill your form with inputs as the inputs get sent:

<form ACTION="#" th:action="@{/initiate-edit}" th:object="${experience}" method="POST">
     <input type="hidden" th:field="*{experienceDate}"/>
     <input type="hidden" th:field="*{rating}"/>
     <!-- ADD ALL THE OTHER FIELDS THAT ARE PART OF THE OBJECT -->
     <button type="submit">Submit</button>
</form>

This will hide your object data from user but when they click on submit, it will send the object data as required (rather than having empty form sent as you have it currently).

Answer 2

As @Aeseir's answer, you need to pay attention to the th:object and th:field The field can be int, double, String, List and the object should have getter and setter for its field. In this case

public class Experience{
     String field;
     List<String> list;
     //getter() and setter()
}

Answer 3

I had the same problem. What @Aeseir said it has helped me, but instead of :

<input type="hidden" th:field="*{experienceDate}"/>

I needed to use:

<input type="hidden" th:value="${experience.experienceDate}" name="someName"/>