html 如何使用thymeleaf实现列表的折叠和展开？

bpzcxfmw 于 2022-11-27 发布在其他

关注(0)|答案(2)|浏览(258)

我有一个HashMap（称为test），格式如下：HashMap<String,List<MyClass>> .
我想将HashMap值的项目显示为可展开的标题，您可以在标题下找到列表中每个对象的信息。
我有下面的代码，但是我在展开的列表中看到的是每个标题只有一行。实际上，列表中的项目被for循环中的下一个项目覆盖了。

<tbody>
  <tr th:each="element, iterStat  : ${test}">
    <td data-toggle="collapse" th:attr="data-target=|#demo${iterStat.count}|" th:text="${element.key}">keyvalue</td>

    <tr class="accordian-body collapse" th:id="'demo' + ${iterStat.count}" th:each="anews : ${element.value}">
      <td th:text="''">Place name</td>
      <td th:text="${anews.first_point}">First point</td>
      <td th:text="${anews.second_point}">Second point</td>
    </tr>
  </tr>
</tbody>

如何更正代码？

Html

来源：https://stackoverflow.com/questions/60191335/how-to-implement-collapsing-and-expanding-of-a-list-using-thymeleaf

2条答案

按热度按时间

jdzmm42g1#

这是你想要的吗？

<tbody>
    <th:block th:each="element, iterStat  : ${test}">
        <tr>
            <td colspan="3" data-toggle="collapse" th:data-target="|.demo${iterStat.count}|" th:text="${element.key}" />
        </tr>

        <tr th:class="|accordian-body collapse demo${iterStat.count}|" th:each="anews : ${element.value}">
            <td th:text="''">Place name</td>
            <td th:text="${anews.first_point}" />
            <td th:text="${anews.second_point}" />
        </tr>
    </th:block>
</tbody>

赞(0）回复(0）举报 2022-11-27

ovfsdjhp2#

我刚刚更新了bootstrap和jquery的版本，它工作了。我最终使用了以下版本：

<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" />
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script
src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>

赞(0）回复(0）举报 2022-11-27

我来回答

html 如何使用thymeleaf实现列表的折叠和展开？

2条答案

相关问题

热门标签

最新问答