jquery - Bootstrap CSS动态表 Accordion

我正在寻找一个可能的实现方式或想法，该如何或应该做到这一点。从本质上讲，我有一张要制成手风琴的桌子，并且我一直在关注这里的桌子：

http://www.bootply.com/fdTMNTiLis

问题是，此实现设置了例如“＃demo1”，“＃demo2”，当您知道数据和所有内容时，就可以了，但是我的实现适用于来自数据库的产品，因此不会完全知道“ ＃demo1“只是产品ID。

我的问题是，是否有一种更优雅的方式来显示此信息，而无需为每个包含ID的行都创建隐藏行？

最佳答案

您可以将数据库用于所有数据（作业名称-描述-提供者名称-区域状态），并可以将Thymeleaf用于HTML页面中的所有数据的可视化。

例如。

<tr th:each="datas : ${data}"
                    th:attr="data-dataId=${data.id}" data-toggle="collapse" data-target="#demo1" class="accordion-toggle">
              <td><button class="btn btn-default btn-xs"><span class="glyphicon glyphicon-eye-open"></span></button></td>
        <td th:text="|${data.name}|">OBS Name</td>
        <td th:text="|${data.description|">OBS Description</td>
        <td th:text="|${data.cloud}|">hpcloud</td>
        <td th:text="|${data.nova}|">nova</td>
      <td> created</td>

    </tr>

阅读Thymeleaf指南以获取更多示例。

您需要在我们的项目中使用Controller.java来进行数据库连接

关于jquery - Bootstrap CSS动态表 Accordion ，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/43494991/