mvc中无限多级菜单

时间:2016-02-10 21:28:50

标签: c# html asp.net-mvc linq submenu

我在mvc中创建了多级菜单。它的工作原理,但我想要无限次数。现在有4个级别,所以将来如果有人想在数据库中添加5.级别,它将不会显示在我的菜单中。我需要添加另一个foreach循环来显示5. level。那么如何让我的菜单无限制?

这是我的菜单视图。

 @{       
    var myMenu = @Model;
    var navbarmenu = myMenu.Where(x => x.ParentID == null);
    var i = 0;
    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class=" nav navbar-nav">
                    @foreach (var menuLevel1 in navbarmenu)
                    {
                        <li class="dropdown">
                            <a href="~/ADDS/Default.aspx" style="font-size:16px;">
                                @menuLevel1.MenuName
                                @if (menuLevel1.MenuName != "Home")
                                {
                                    <span class="caret"></span>
                                }
                            </a>
                            @{ var navbarsubmenu = myMenu.Where(x => x.ParentID == menuLevel1.MenuID);}
                            @if (navbarsubmenu.IsAny())
                            {
                                <ul class="dropdown-menu">
                                    @foreach (var menuLevel2 in navbarsubmenu)
                                    {
                                        <li class="dropdown-submenu">
                                            @if (!string.IsNullOrEmpty(menuLevel2.MenuLink))
                                            {
                                                <a href="@Url.Content(menuLevel2.MenuLink)">
                                                    @menuLevel2.MenuName
                                                </a>
                                            }
                                            else
                                            {
                                                <a href="~/ADDS/Default.aspx">
                                                    @menuLevel2.MenuName
                                                </a>
                                            }
                                            @{var navbarsubmenu2 = myMenu.Where(x => x.ParentID == menuLevel2.MenuID);}
                                            @if (navbarsubmenu2.IsAny())
                                            {
                                                <ul class="dropdown-menu">
                                                    @foreach (var menuLevel3 in navbarsubmenu2)
                                                    {
                                                        <li class="dropdown-submenu">
                                                            @if (!string.IsNullOrEmpty(menuLevel3.MenuLink))
                                                            {
                                                                <a href="@Url.Content(menuLevel3.MenuLink)">
                                                                    @menuLevel3.MenuName
                                                                </a>
                                                            }
                                                            else
                                                            {
                                                                <a href="~/ADDS/Default.aspx">
                                                                    @menuLevel3.MenuName
                                                                </a>
                                                            }
                                                            @{var navbarsubmenu3 = myMenu.Where(x => x.ParentID == menuLevel3.MenuID);}
                                                            @if (navbarsubmenu3.IsAny())
                                                            {
                                                                <ul class="dropdown-menu">
                                                                    @foreach (var menuLevel4 in navbarsubmenu3)
                                                                    {
                                                                        <li class="dropdown-submenu">
                                                                            @if (!string.IsNullOrEmpty(menuLevel4.MenuLink))
                                                                            {
                                                                                <a href="@Url.Content(menuLevel4.MenuLink)">
                                                                                    @menuLevel4.MenuName
                                                                                </a>
                                                                            }
                                                                            else
                                                                            {
                                                                                <a href="~/ADDS/Default.aspx">
                                                                                    @menuLevel4.MenuName
                                                                                </a>
                                                                            }
                                                                        </li>
                                                                    }
                                                                </ul>
                                                            }
                                                        </li>
                                                    }
                                                </ul>
                                            }
                                        </li>
                                    }
                                </ul>
                            }
                        </li>
                    }
                </ul>
            </div>
        </div>
    </nav>
}

2 个答案:

答案 0 :(得分:3)

我会创建一个MultiLevelMenu模型,该模型将由服务层中的数据库填充,然后您可以使用部分视图。

public class MultiLevelMenu
{
   public string MenuName { get; set; }
   public MultiLevelMenu NestedMenu { get; set; }
}

然后在主视图中有:

@model MultiLevelMenu;

<div>@Model.MenuName</div>

@Html.Partial("_MultiLevelMenu", Model);

然后是局部视图:

@if (Model.MultiLevelMenu != null) 
{
    <div>@Model.MenuName</div>
    @Html.Partial("_MultiLevelMenu", Model);
}

答案 1 :(得分:2)

您是否考虑过在视图中尝试辅助方法?使用递归的更多内容是什么?

@helper GetSubMenus(IEnumerable<menutable> siteMenu, Nullable<int> parentID)
{
    foreach (var i in Model.Where(a => a.ParentID.Equals(parentID)))
    {
        var submenu = Model.Where(a => a.ParentID.Equals(i.MenuID)).Count();

        <li class="@(submenu > 0 ? "dropdown-submenu" : "dropdown")">
            <a href="@(!string.IsNullOrEmpty(i.MenuLink) ? Url.Content(i.MenuLink) : "~/default)" style="font-size:16px;">@i.MenuName</a>
            @if (submenu > 0)
            {
                <ul class="dropdown-menu">
                    @GetSubMenus(siteMenu, i.MenuID)
                    @* Recursive  Call for Populate Sub items here*@
                </ul>
            }
        </li>
    }
}

@{
    var mymenu = @Model;
    var menuParentID = mymenu.First().ParentID;
}  
@if (mymenu != null && mymenu.Count() > 0)
{
    <nav class="navbar navbar-default">
        <div class="container-fluid">
            <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
                <ul class=" nav navbar-nav">
                    @GetSubMenus(mymenu, menuParentID)
                </ul>
            </div>
        </div>
    </nav>
}