Javascript foreach循环中的引导折叠

我很难让可折叠面板在我的foreach循环中工作。单击一个项目时，所有项目都会展开/缩回，这不是我想要的。我希望每个元素都是独立的

我连接到数据库，基本上希望简单地显示数据，并能够扩展以查看更多信息

我已经尝试了很多不同的解决方案，我目前的方法是基于 我应该如何处理id和href

任何帮助都将不胜感激

    foreach (var item in groupItem){

<div class="panel-group" id="accordion">
                        <div class="panel panel-default" id="panel1">
                            <div class="panel-heading">
                                <h4 class="panel-title">
                                    <a data-toggle="collapse" data-target="#collapseOne"
                                       href="#collapseOne">
                                       @Html.DisplayFor(modelItem => item.Name)
                                    </a>
                                </h4>

                            </div>
                            <div id="collapseOne" class="panel-collapse collapse in">
                                <div class="panel-body">@Html.DisplayFor(modelItem => item.IdNumber)
                                </div>
                            </div>
                        </div>

                    </div>

foreach（groupItem中的变量项）{
@DisplayFor（modelItem=>item.IdNumber）

基本上，您正在创建带循环的面板，并将相同的

id

分配给所有

面板组

，这就是问题的原因！因此，您可以尝试如下操作，请注意

id在DOM中应该是唯一的

@{int i=0;}
foreach (var item in groupItem)
{
       <div class="panel-group" id="accordion_@i">
              <div class="panel panel-default" id="panel_@i">
                     <div class="panel-heading">
                           <h4 class="panel-title">
                                 <a data-toggle="collapse" data-target="#collapseOne_@i" href="#collapseOne_@i">
                                       @Html.DisplayFor(modelItem => item.Name)
                                  </a>
                            </h4>
                      </div>
                      <div id="collapseOne_@i" class="panel-collapse collapse in">
                            <div class="panel-body">
                                 @Html.DisplayFor(modelItem => item.IdNumber)
                            </div>
                      </div>
              </div>
        </div>
        i++;
}

@{int i=0；}
foreach（groupItem中的var项）
{
@DisplayFor（modelItem=>item.IdNumber）
i++；
}
id
应该是每个文档的唯一值。您将
id=“accordion”
在一个循环中，所以你有点违反了这个规则。随时..快乐编码..：）@sumedha..没有问题..快乐编码..：）你能解释一下@的意思吗？@mamamadgiaishwarya它基本上是Asp.net MVC语法，用于后台动态内容的样板UI..。）@mamadgiaishwarya随时..快乐编码..：）