简体   繁体   English

Bootstrap INSPINIA可折叠导航栏

[英]Bootstrap INSPINIA Collapsible Navigation bar

I am using the INSPINIA theme for a web platform. 我正在将INSPINIA主题用于Web平台。

In my navigationbar there is an collapsible menu-entry. 在我的导航栏中,有一个可折叠的菜单项。 Each of it's sub-items redirect to a different controller. 它的每个子项目都重定向到不同的控制器。

在此处输入图片说明

If I click on "Text1" I want to keep the collapsible entry extended. 如果单击“ Text1”,我想保持可折叠项的扩展。 But if I click, the menu collapses because it redirects to a different controller: 但是,如果单击,菜单会折叠,因为它会重定向到其他控制器:

在此处输入图片说明

If a extend the menu again I see the correct result ("Data" and "Text1" are selected) - but it's initially collapsed! 如果再次扩展菜单,我会看到正确的结果(选择了“数据”和“文本1”)-但是它最初是折叠的!

Are there any ideas? 有什么想法吗?

        <li>
            <a href="#"><i class="fa fa-user"></i><span class="nav-label">Data</span><span class="fa arrow"></span></a>
            <ul class="nav nav-second-level collapse">
                <li class="@Html.IsSelected(action: "DoAction", controller: "Controller1")" style="border-left:none !important"><a href="@Url.Action("DoAction", "Controller2")">Text1</a></li>
                <li class="@Html.IsSelected(action: "DoAction", controller: "Controller2")" style="border-left:none !important"><a href="@Url.Action("DoAction", "Contorller2")">Text2</a></li>
            </ul>
        </li>

Edit: I set up an example project. 编辑:我建立了一个示例项目。 This shows you the problem: http://inspinia-test.azurewebsites.net/ 这向您显示了问题: http : //inspinia-test.azurewebsites.net/

I solved it in this way: 我是这样解决的:

The drop down is now extended everytime an "Details" or "Edit" action is called. 现在,每次调用“详细信息”或“编辑”操作时,下拉列表都会扩展。 So if I view the detail site and click the "edit" button, the menu entry is still selected. 因此,如果我查看详细站点并单击“编辑”按钮,则菜单项仍处于选中状态。 It works also to differ between the multipe controllers in the drop down by substituting "action: "DoAction"" with "controller: "Controller1"". 通过将“ action:“ DoAction””替换为“ controller:“ Controller1”“,下拉菜单中的multipe控制器之间也可以有所不同。

This works because I only use Details and Edit Actions in this menu drop down. 这行得通,因为我仅在此菜单下拉菜单中使用“详细信息”和“编辑操作”。 If I will use them in a other menu drop down, I would have to implement a additional testing. 如果要在其他菜单下拉菜单中使用它们,则必须执行其他测试。

<li class="@Html.IsSelected(action:"Details") @Html.IsSelected(action:"Edit")">
        <a href="#"><i class="fa fa-user"></i><span class="nav-label">Data</span><span class="fa arrow"></span></a>
        <ul class="nav nav-second-level collapse">
        <li class="@Html.IsSelected(controller: "Controller1")" style="border-left:none !important"><a href="@Url.Action("Details", "Controller1")">Text1</a></li>
        <li class="@Html.IsSelected(controller: "Controller2")" style="border-left:none !important"><a href="@Url.Action("Details", "Contorller2")">Text2</a></li>
    </ul>
 </li>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM