title: How to display input values in a datatable with dynamic columns using thymeleaf
body: <p>I am trying to create a form list with a Data Table where I place some input values from a collection. The fact is that I don't know how to display the values with connection with the Controller to display and register the values from the input correctly.</p>
  
  <p>This is the DTO I want to display as a Form List:</p>
  
  <pre><code>@Data
  public class ComponentPeriodValues {
  
  private int idComponent;
  private String description;
  private List&lt;String&gt; periods;
  private List&lt;BigDecimal&gt; values;
  
  }
  </code></pre>
  
  <p>All records have equal numbers of periods and I am trying to build a data table like below:</p>
  
  <p><a href="https://imgur.com/Bqe9csh" rel="nofollow noreferrer"><img src="https://i.imgur.com/Bqe9csh.png" title="source: imgur.com" /></a></p>
  
  <p>My HTML is like below:</p>
  
  <pre><code>&lt;div id="data" th:unless="${cpv == null}" style="width:100%;height:500px;overflow:auto;"&gt;
      &lt;form action="#" th:action="@{/planning-components/save}"
          th:object="${cpv}" method="POST"&gt;
  
          &lt;table class="table table-bordered table-striped"&gt;
              &lt;thead class="thead-dark"&gt;
                  &lt;tr&gt;
                      &lt;th&gt;Description&lt;/th&gt;
                      &lt;th:block th:each="p : ${cpv[0].periods}"&gt;
                          &lt;th th:text="${p}"&gt;&lt;/th&gt;
                      &lt;/th:block&gt;
                  &lt;/tr&gt;
              &lt;/thead&gt;
  
              &lt;tbody&gt;
                  &lt;tr th:each="c : ${cpv}"&gt;
                      &lt;td th:text="${c.description}" /&gt;
                      &lt;th:block th:each="v : ${c.values}"&gt;
                          &lt;td&gt;
                              &lt;input type="text" th:field="*{v}"
                                  class="form-control mb-4 col-4"/&gt;
                          &lt;/td&gt;
                      &lt;/th:block&gt;
                  &lt;/tr&gt;
              &lt;/tbody&gt;        
          &lt;/table&gt;
  
          &lt;button type="submit" class="btn btn-info col-2"&gt;Save&lt;/button&gt;
      &lt;/form&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>But, when I use this input field, I got this error:</p>
  
  <p>Caused by: org.springframework.beans.NotReadablePropertyException: Invalid property 'v' of bean class [java.util.ArrayList]: Bean property 'v' is not readable or has an invalid getter method: Does the return type of the getter match the parameter type of the setter?</p>
  
  <p>When I use an plain text field it works..</p>
  
  <p>So, my question is: How can I use input fields here to reflect changes in the DTO and then work with my DTO updated in order to process the update into the database?</p>