我是Web开发的新手,想要创建用户可以点击一行的表格以显示更多细节(其他行)。我不知道注意它是否很重要但是,我桌子的每一排都很沉重,它们包含:
我按照documentation来做我想做的事,但确实有效。根据这个帮助,它是写的
手风琴的容器需要类.accordion和属性数据手风琴。请注意,在这些示例中,我们使用a,但您可以使用任何所需的元素。
所以这是我的代码:
<table class="accordion" data-accordion data-accordion>
<thead>
<tr>
<th>XXXX</th>
<th class="sorttable_numeric">Score</th>
</tr>
</thead>
<tbody>
{% for X,couples in zipped %}
<tr data-accordion-item data-multi-expand="true">
<td>
<a href="http://www.XXX={{XXX}}">{{XXX}}</a>
</td>
<td>
<body>
<ul class="vertical menu" data-accordion-menu>
<li>
<a href="#">{{0.295}}</a>
<ul class="menu vertical nested">
<li>
<table>
<tbody>
<tr>
{% for couple in couples %}
<td>{{VINIO}}</td>
<td>{{PINIO}}</td>
<td>{{0.222}}</td>
</tr>
{% endfor %}
</tbody>
</thead>
</table>
</li>
</li>
</ul>
</body>
</body>
</td>
<td>
<div class="switch tiny">
<input class="switch-input" id={{ZZZZ}}_{{forloop.counter}} type="radio"
name="exampleSwitch">
<label class="switch-paddle" for={{ZZZZ}}_{{forloop.counter}}>
<span class="show-for-sr">Tiny Sandwiches Enabled</span>
</label>
</div>
</td>
</tr>
<div class="accordion-content" data-tab-content>
Here should be the content that appears when the user click on the table row. I want this content to be others rows, is possible ?
</div>
</li>
{% endfor %}
</tbody>
</table>
我不明白为什么我没有一个表,用户可以点击并展开它以查看该行包含的内容。
感谢您的帮助。