title: Thymeleaf dropdown options dissappear after adding second dropdown in loop
body: <p>this is my first question here so please be kind :D</p>
  <p>I am in the middle of a UNI project which is a businesses scheduler.
  I want to be able to add many task groups to my project, so I decided to do it with dropdown in a loop. Every time someone clicks on button new dropdown appears (not sure if it's best solution, but I'am still learning Spring and Thymeleaf). The problem is that when I have only one dropdown everything is fine.</p>
  <p><a href="https://i.stack.imgur.com/CQfD7.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CQfD7.png" alt="enter image description here" /></a></p>
  <p>But after I click on plus button the options from dropdown disappears.</p>
  <p><a href="https://i.stack.imgur.com/uQiT2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/uQiT2.png" alt="enter image description here" /></a></p>
  <p>I tried to find the answer on the internet but I can't find anything similar.</p>
  <p>Here is my form code:</p>
  <pre class="lang-html prettyprint-override"><code>  &lt;form action=&quot;#&quot; method=&quot;post&quot; th:action=&quot;@{/projects}&quot; th:object=&quot;${project}&quot;&gt;
                  &lt;p class=&quot;C(red)&quot; th:if=&quot;${#fields.hasAnyErrors()}&quot; th:errors=&quot;*{all}&quot;&gt;&lt;/p&gt;
                  &lt;br/&gt;
                  &lt;div&gt;&lt;h2&gt;New project&lt;/h2&gt;&lt;/div&gt;
                  &lt;label&gt;Description
                      &lt;input type=&quot;text&quot; class=&quot;form-control&quot; th:field=&quot;*{description}&quot; th:errorclass=&quot;'Bdc(red)'&quot;/&gt;
                  &lt;/label&gt;
                  &lt;fieldset th:each=&quot;projectGroup, projectGroupStat : *{selectedGroups}&quot;&gt;
                      &lt;div class=&quot;btn-group&quot;&gt;
                          &lt;select class=&quot;dropdown&quot; th:field=&quot;*{selectedGroups[__${projectGroupStat.index}__]}&quot;
                                  th:id=&quot;${projectGroupStat.index}&quot;&gt;
                              &lt;option th:each=&quot;group: ${groups}&quot; th:value=&quot;${group.id}&quot;&gt;&lt;a class=&quot;dropdown-item&quot;
                                                                                           th:text=&quot;${group.description}&quot;/&gt;
                              &lt;/option&gt;
                          &lt;/select&gt;
                      &lt;/div&gt;
                  &lt;/fieldset&gt;
                  &lt;div&gt;
                      &lt;button type=&quot;submit&quot; name=&quot;addGroup&quot;&gt;+&lt;/button&gt; 
                  &lt;/div&gt;
                  &lt;br/&gt;
                  &lt;p&gt;
                      &lt;button type=&quot;submit&quot; class=&quot;btn btn-primary&quot;&gt;Add&lt;/button&gt;
                      &lt;button type=&quot;reset&quot; class=&quot;btn btn-warning&quot;&gt;Clear&lt;/button&gt;
                  &lt;/p&gt;
              &lt;/form&gt;
  </code></pre>
  <p>Here is a part of my controller code:</p>
  <pre class="lang-java prettyprint-override"><code>    @GetMapping(produces = MediaType.TEXT_HTML_VALUE)
      String showProjects(Model model){
          model.addAttribute(&quot;project&quot;, new ProjectWriteModel());
          model.addAttribute(&quot;groups&quot;, getGroups());
          return &quot;projects&quot;;
      }
      
      
      @PostMapping(params = &quot;addGroup&quot;)
      String addProjectGroup(@ModelAttribute(&quot;project&quot;) ProjectWriteModel current){
          current.getSelectedGroups().add(new String());
          return &quot;projects&quot;;
      }
      
      private List&lt;GroupReadModel&gt; getGroups() {
          return taskGroupService.readAll();
      }
  </code></pre>
  <p>Am I missing something here? I will be grateful for any help.
  Thank you!</p>