为什么在单击表标题展开/折叠时，它是针对我的所有表而不仅仅是单击的表

Question

我正在ASP.Net Core MVC项目的视图中创建Json生成的表。当单击标题时，我使用引导程序来展开/折叠表，但当我这样做时，它会展开/折叠我的所有表，而不仅仅是我正在单击的表。我如何解决此问题，只显示我正在单击标题的表中的数据？

@foreach (var item in Model)
{
@foreach (var i in item.Request.Path.Matchers)
{
@if (i.Pattern.Contains("/api.datastore") == false)
{
<table class="table">
<thead class="thead-dark">
<tr data-toggle="collapse" data-target="#accordion" class="clickable">
<th class="center">Id: @item.Guid</th>
</tr>
</thead>
<tbody id="accordion" class="collapse">

<tr>
<td><span class="label">URL: </span>@i.Pattern</td>
</tr>
<tr>
<td><span class="label">Body: </span>@item.Response.Body</td>
</tr>

</tbody>
</table>
}
}

Answer 1

data-target和id都是相同的(accordion(，您需要像下面这样区分它们：

@{ 
var j = 0;   //add this...
}
@foreach (var item in Model)
{
@foreach (var i in item.Request.Path.Matchers)
{
@if (i.Pattern.Contains("/api.datastore") == false)
{
<table class="table">
<thead class="thead-dark">
//change here...
<tr data-toggle="collapse" data-target="#accordion_@j" class="clickable">
<th class="center">Id: @item.Guid</th>
</tr>
</thead>
//change here...
<tbody id="accordion_@j" class="collapse">
<tr>
<td><span class="label">URL: </span>@i.Pattern</td>
</tr>
<tr>
<td><span class="label">Body: </span>@item.Response.Body</td>
</tr>
</tbody>
</table>
j++;   //add this .....
}
}
}

Answer 2

关键是关于数据target="手风琴"；并且id＝"0"；手风琴"；。可以将@item中的一些文本添加到"之后的数据目标和id的值中；手风琴"；以识别关系。