I am having issues with a list of menus clicking and hiding other panels when one is clicked and active.
@{int i = 0;}
@foreach (var levelOne in Model.MenuLevelOne)
{
<div class="panel-group" id="accordion_@i">
<div class="panel panel-default" id="panel_@i">
<div class="panel-heading">
<h4 class="panel-title">
<a onclick="leveltwo('@levelOne.MenuLevel')" data-toggle="collapse" data-target="#collapseOne_@i" href="#collapseOne_@i">@levelOne.MenuLevel</a>
</h4>
</div>
<div id="collapseOne_@i" class="panel-collapse collapse in">
<div class="panel-body">
<ul class="" id="[email protected]"></ul><ul class="filter-categories__list"></ul>
</div>
</div>
</div>
</div>
i++;
}
This will bring a list of Menus so like this with its sub menus :
Fruit
Apple
Pear
Grape
Veg
Carrot
Cucumber
Beetroot
Other
Cake
Chocalte
All these are collapsed on page load which is fine and working,
Shows as :
Fruit
Veg
Other
however, when I open one and then open another one they should close.
So for example if I open Fruit, and then I open Veg. Fruit should close and Veg should open.
Fruit
Apple
Pear
Grape
Veg
Other
This should now open like this like but it is not working.
Fruit
Veg
Carrot
Cucumber
Beetroot
Other
Both of them stay open. How can I keep one open then close the rest?
Can someone tell me where I am wrong in the code?
Thanks
New error:
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…