CODEWITHSUNDEEP
htmlthymeleafdropdown
cmplx96
cmplx96

Reputation: 1651

thymeleaf - create dynamic dropdown from array

I send an array with objects to my view. My goal is to create a dropdown-menu-item for each object in the array.

The problem is that it only creates an item for the first object.

   <div class="dropdown">
            <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                <span class="caret"></span>
            </button>
            <ul th:each="u : ${users}" class="dropdown-menu" aria-labelledby="dropdownMenu1">
                <li><a th:href="@{/show(id=${u.id})}"><span th:text="${u.name}"></span></a></li>
            </ul>
   </div>

I tried it with a table like this and it is working, however I dont want a table.

   <table class="table table-hover">
      <thead>
         <tr>
           <th>User</th>
         </tr>
      </thead>
      <tbody>
         <tr th:each="u : ${users}">
           <td th:text="${u.name}"></td>
         </tr>
      </tbody>
  </table>

Thanks!

Upvotes: 0

Views: 594

Answers (1)

JokingBatman
JokingBatman

Reputation: 66

the th:each should be inside li tag. 

<div class="dropdown">
                <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
                    <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" aria-labelledby="dropdownMenu1">
                    <li th:each="u : ${users}"><a th:href="@{/show(id=${u.id})}"><span th:text="${u.name}"></span></a></li>
                </ul>
       </div>

Upvotes: 1

Related Questions