Question

我试图使用Accordion隐藏/显示行。我证实手风琴的作用是：

<div id="accordion">
   <h3>Some 1:</h3>
      <div><p>ABC</p></div>
   <h3>Some 2:</h3>
      <div><p>Muris</p></div>
</div>

但是当试图将它用于我的应用程序时，它无法正常工作。以下是我想要完成的事情。我不确定它是否是某些标签的位置，只是手风琴在表格元素中不起作用，或者剃刀语法是个问题。

<table>
<tr>
    <th>Name</th>
    <td>@Html.Display("Name")</td>
</tr>
<tr>
    <th>Event</th>
    <th>Program</th>
</tr>
<div id="accordion">
 @for (var i = 0; i < @ViewBag.Events.Count; i++)
{
<tr>
    <td><h3>@ViewBag.Events[i].Event</h3></td>
    <td>@ViewBag.Events[i].Program</td>
</tr>
@Html.Raw("<div>")
<tr>
    <td>Value A</td>
    <td>Value B</td>
</tr>
for (var j = 0; j < @ViewBag.Events[i].Azc.Count; j++)
{
<tr>
    <td>@ViewBag.Events[i].Azc[j].ValueA</td>
    <td>@ViewBag.Events[i].Azc[j].ValueB</td>
</tr>
}
@Html.Raw("</div>")
}
</div>

所以基本上，我希望所有事件/程序都可以作为行显示，并且在单击其中一行时，将显示该事件的其余行。

Answer 1

你是对的。 Accordion在表元素中不起作用。您可以使用jquery-accordion和bootstrap网格系统来完成此任务：http://getbootstrap.com/css/#grid

在表元素中使用带有Razor语法的Accordion

1 个答案: