Thymeleaf - Saving Multiple Records in a Table

Question

Apologies if this question has been asked and answered elsewhere, but I couldn't find much help about it so thought I'll ask here. I am very new to Thymeleaf and still trying to make sense of things. So here is what I'm trying to do,
OBJECTIVE: Extract data from the database and display it on a simple webpage in tabular form (i.e., Rows and Columns). All fields are editable with a Submit and Reset button at the end. Something like this,

PROBLEM: So the issue I am facing is this, if there is only one row data, there is no issue in updating the records, but if there is more than 1 record when I edit the record and press Submit, the updated record remains the same as before, but the first record in the list gets the updated text concatenated to the existing text in their respective columns. This behavior is shown in the following image,

As seen in the image above, I had two records ... without even changing the record, I press Submit button and now I can see Record 1 has Row 2 text concatenated to its existing text.

This is my Code,

HTML

<form
  action="#"
  th:action="@{/saveMapping}"
  th:object="${hanaMappingT}"
  method="post"
>
  <table id="mappings">
    <thead>
      <tr>
        <th>ID</th>
        <th>WBSNAME</th>
        <th>ITEMDESCRIPTION</th>
        <th>WBSCANDYCODE</th>
        <th>WBSHENAME</th>
      </tr>
    </thead>
    <tbody>
      <tr th:each="mapping : ${allMappings}">
        <td>
          <input
            type="text"
            field="*{id}"
            th:name="id"
            th:value="${mapping.id}"
          />
        </td>
        <td>
          <input
            type="text"
            field="*{wbsName}"
            th:name="wbsName"
            th:value="${mapping.wbsName}"
          />
        </td>
        <td>
          <input
            type="text"
            id="itemDescription"
            field="*{itemDescription}"
            th:name="itemDescription"
            th:value="${mapping.itemDescription}"
          />
        </td>
        <td>
          <input
            type="text"
            field="*{wbsCandyCode}"
            th:name="wbsCandyCode"
            th:value="${mapping.wbsCandyCode}"
          />
        </td>
        <td>
          <input
            type="text"
            field="*{wbsHeName}"
            th:name="wbsHeName"
            th:value="${mapping.wbsHeName}"
          />
        </td>
      </tr>
    </tbody>
  </table>
  <input type="submit" value="Submit" />
  <input type="reset" value="Reset" />
</form>;

CONTROLLER CLASS

@PostMapping("/saveMapping")
  public String saveMapping(
    @ModelAttribute HanaMappingT mapping, Model model) {        
      try {
        log.info(mapping.toString());
        List<HanaMappingT> mappingList = new ArrayList<HanaMappingT>();
        mappingList.add(mapping);
        log.info("List : " + mappingList.toString());
        hanaService.updateMapping(mappingList);            
      } catch (Exception e) {
        log.error("Unable to save mapping data - ", e);
      }
      return "result";
  }

HanaMappingT class

@Data
@Entity
@Table(name = "MAPPING_T")
public class HanaMappingT {

  @Id
  @Column(name = "ID")
  private Integer id;

  @Column(name = "WBSNAME")
  private String wbsName;
  @Column(name = "ITEMDESCRIPTION")
  private String itemDescription;
  @Column(name = "WBSCANDYCODE")
  private String wbsCandyCode;
  @Column(name = "WBSHENAME")
  private String wbsHeName;
}

I am not really sure how to deal with multiple records, how with one single submit button I can store all records in their respective columns and rows.

If you need further clarification, please feel free to ask questions and I'll try to answer to the best of my ability.