ブートストラップ ナビゲーション用に「アクティブ」クラスを ASP.NET MVC の Html.ActionLink に効率的に追加する方法

ASP.NET MVC の Html.ActionLink への「アクティブ」クラスの追加

ASP.NET MVC では、ブートストラップ ナビゲーション バーに「アクティブ」クラスを追加します。不可欠。ただし、それを に追加する一般的なアプローチは、

Bootstrap の方法

Bootstrap では、「active」クラスを

要素に適用する必要があります。 ではなく要素です。要素。これにより、どの要素にカーソルが置かれているかに関係なく、アクティブなクラスが常に表示されるようになります。

<ul class="nav navbar-nav">
    <li class="active">@Html.ActionLink("Home", "Index", "Home")</li>
    <li>@Html.ActionLink("About", "About", "Home")</li>
    <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>

自動クラス アプリケーション

「アクティブ」クラスを各

<ul class="nav navbar-nav">
    <li class="@(ViewContext.RouteData.Values["Action"].ToString() == "Index" ? "active" : "")">@Html.ActionLink("Home", "Index", "Home")</li>
    <li class="@(ViewContext.RouteData.Values["Action"].ToString() == "About" ? "active" : "")">@Html.ActionLink("About", "About", "Home")</li>
    <li class="@(ViewContext.RouteData.Values["Action"].ToString() == "Contact" ? "active" : "")">@Html.ActionLink("Contact", "Contact", "Home")</li>
</ul>

より洗練されたソリューション (HtmlHelper 拡張)

さらに洗練されたソリューションは、HtmlHelper 拡張メソッドを作成することです:

public static string IsSelected(this HtmlHelper html, string controllers = "", string actions = "", string cssClass = "selected")
{
    var viewContext = html.ViewContext;
    var isChildAction = viewContext.Controller.ControllerContext.IsChildAction;

    if (isChildAction)
        viewContext = html.ViewContext.ParentActionViewContext;

    var routeValues = viewContext.RouteData.Values;
    var currentAction = routeValues["action"].ToString();
    var currentController = routeValues["controller"].ToString();

    var acceptedActions = actions.Trim().Split(',').Distinct().ToArray();
    var acceptedControllers = controllers.Trim().Split(',').Distinct().ToArray();

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

使用法:

<ul>
    <li class="@Html.IsSelected(actions: "Home", controllers: "Default")">
        <a href="@Url.Action("Home", "Default")">Home</a>
    </li>
    <li class="@Html.IsSelected(actions: "List,Detail", controllers: "Default")">
        <a href="@Url.Action("List", "Default")">List</a>
    </li>
</ul>

以上がブートストラップ ナビゲーション用に「アクティブ」クラスを ASP.NET MVC の Html.ActionLink に効率的に追加する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。