首页 > 解决方案 > 根据asp.net中的选择将菜单设置为活动类

问题描述

我的应用程序中的菜单选择存在问题。基本上,我有一个从数据库动态填充的侧边菜单。

foreach (var item in Model.SideMenuItemsList)
{
    <li id="@item.Id" class="@Html.IsSelected(actions: "Index, Profile", controllers: "Employee, Policy")">
        <a href="@{if (item.SubMenus.Count > 0) { <text> #exampledropdownDropdown </text>} else { @item.Url} } " @{if (item.SubMenus.Count > 0) { <text> aria-expanded="false" data-toggle="collapse" </text>  } }> <i class="@item.Icon"></i>@item.Name</a>
        <ul id="exampledropdownDropdown" class="collapse list-unstyled">

            @foreach (var subMenus in item.SubMenus)
            {
                <li><a href="@subMenus.Url"><i class="@subMenus.Icon"></i>@subMenus.Name</a></li>
            }
        </ul>
    </li>
}

如果我在特定页面上,我已经使用自定义 Html Helper 来选择菜单。Html Helper 如下:

public static string IsSelected(this IHtmlHelper htmlHelper, string controllers, string actions, string cssClass = "active")
{
    string currentAction = htmlHelper.ViewContext.RouteData.Values["action"] as string;
    string currentController = htmlHelper.ViewContext.RouteData.Values["controller"] as string;

    IEnumerable<string> acceptedActions = (actions ?? currentAction).Split(',');
    IEnumerable<string> acceptedControllers = (controllers ?? currentController).Split(',');

    return acceptedActions.Contains(currentAction) && acceptedControllers.Contains(currentController) ?
        cssClass : String.Empty;
}

它将菜单类设置为active. 但这里的问题是,我所有的菜单都被设置为活动状态。我如何才能根据我所在的页面仅使当前页面处于活动状态?请帮忙。

标签: c#asp.netasp.net-mvc

解决方案


一些帮助在这里,从这里

您需要做的是编写一个 HtmlHelper,它将在每个页面加载时将“活动”类添加到当前链接。在您的项目下创建一个名为 Helpers 的文件夹,并添加一个自定义 HtmlHelper 类。

using System;
using System.Web.Mvc;

public static class ActiveMenuHelper
{
    public static MvcHtmlString MenuLink(this HtmlHelper htmlHelper, string linkText, string actionName, string controllerName, string areaName)
    {
        var currentAction = htmlHelper.ViewContext.RouteData.GetRequiredString("action");
        var currentController = htmlHelper.ViewContext.RouteData.GetRequiredString("controller");
        var currentArea = htmlHelper.ViewContext.RouteData.DataTokens["area"];

        var builder = new TagBuilder("li")
        {
            //InnerHtml = htmlHelper.ActionLink(linkText, actionName, controllerName).ToHtmlString()
            InnerHtml = "<a href=\"" + new UrlHelper(htmlHelper.ViewContext.RequestContext).Action(actionName, controllerName, new { area = areaName }).ToString() + "\">" + linkText + "</a>"
        };

        if (String.Equals(controllerName, currentController, StringComparison.CurrentCultureIgnoreCase) && String.Equals(actionName, currentAction, StringComparison.CurrentCultureIgnoreCase))
            builder.AddCssClass("active");

        return new MvcHtmlString(builder.ToString());
    }
}

然后在您的部分视图中:

@using YourProjectName.Helpers

<ul>
    @Html.MenuLink("Resume", "Index", "Resume", "" )
    @Html.MenuLink("Cover Letter", "Index", "CoverLetter", "" )
</ul>

推荐阅读