title: Thymeleaf: Iterating over elements of property of object of form
body: <p>I have a thymeleaf form which I would like to make dynamic, without using JS. The form should fill an object of class <code>ProjectNewDto</code></p>
  
  <pre><code>public class ProjectNewDto {
  
      private List&lt;UsernameAndPps&gt; usernamesAndPps;
  
      ...
  }
  </code></pre>
  
  <p>Therefore holding a list of <code>UsernameAndPps</code> elements:</p>
  
  <pre><code>public class UsernameAndPps {
      private String username;
      private double pps;
  
      ...
  }
  </code></pre>
  
  <p>The controller puts the object as an attribute of the model and intialize the list of <code>usernamesAndPps</code> with a single element:</p>
  
  <pre><code>@RequestMapping("/projectNewPageR")
  public String projectNewPage(Model model) {
      if(!model.containsAttribute("project")) {
          ProjectNewDto project = new ProjectNewDto();
          project.setUsernamesAndPps(new ArrayList&lt;UsernameAndPps&gt;());
          project.getUsernamesAndPps().add(new UsernameAndPps("user",100.0));
  
          model.addAttribute("project",project);
      }
      return "views/projectNewPage";
  }
  </code></pre>
  
  <p>And then I try to show it with thymeleaf as</p>
  
  <pre><code>&lt;form id="new_project_form" action="#" th:action="@{/views/projectNewSubmit}" th:object="${project}" method="post"&gt;
      &lt;div th:each="usernameAndPps : $(project.usernamesAndPps)"&gt;
          &lt;input type="text" th:value="${usernameAndPps.username}"&gt;&lt;/input&gt;
          &lt;input type="number" th:value="${usernameAndPps.pps}"&gt;&lt;/input&gt;
      &lt;/div&gt;
      &lt;button type="submit" class="btn btn-lg btn-primary btn-block"&gt;Create&lt;/button&gt;
  &lt;/form&gt;
  </code></pre>
  
  <p>I have also tried with <code>$(usernamesAndPps)</code> instead of <code>$(project.usernamesAndPps)</code>, but the error remains the same:</p>
  
  <pre><code>Could not parse as each: "usernameAndPps : $(project.usernamesAndPps)"
  </code></pre>
  
  <p>I have removed a lot of other sytle related suff, but the is still an error of some kind. Any ideas?</p>
  
  <p>The next step will be to add another button to add elements to the <code>usernamesAndPps</code> property. Lets keep positive here.</p>