0

次のメニューがあります。

<ul class="nav nav-tabs nav-stacked">
<li class="nav-header">Navigation Menu</li>
<li>@Html.MenuLink("Test Link", "Index", "Home", "active",true)</li>

MenuLink は、クラスを ActionLink (href) 要素に設定するヘルパーです。

public static HtmlString MenuLink(this HtmlHelper htmlHelper, string linkText, string actionName, string controllerName, string activeClass, bool checkAction)
        {
            string currentAction = htmlHelper.ViewContext.RouteData.GetRequiredString("action");
            string currentController = htmlHelper.ViewContext.RouteData.GetRequiredString("controller");

            if (string.Compare(controllerName, currentController, StringComparison.OrdinalIgnoreCase) == 0 && ((!checkAction) || string.Compare(actionName, currentAction, StringComparison.OrdinalIgnoreCase) == 0))
            {
                return htmlHelper.ActionLink(linkText, actionName, controllerName, null, new { @class = activeClass });
            }

            return htmlHelper.ActionLink(linkText, actionName, controllerName);

        }

必要なのは、class 属性を親 HTML 要素 (この場合は<li>要素) に設定することです。そのため、最終的な結果は次のようになります。

<ul class="nav nav-tabs nav-stacked">
<li class="nav-header">Navigation Menu</li>
<li class="active"><href="....."></li>

実際の結果の代わりに:

<ul class="nav nav-tabs nav-stacked">
<li class="nav-header">Navigation Menu</li>
<li><href="....."  class="active"></li>

手がかり、アドバイスをいただければ幸いです。

ありがとう。

4

1 に答える 1

0

MenuLink ヘルパーの代わりに、次のように @Url ヘルパーを使用できます。

<li class="active">
    <href="@Url.Action("Index", "Home")">
</li> 

クラス名の結果を生成するためだけにカスタム ヘルパーを記述します (例: active )

したがって、最終的なコードは次のようになります。

<li class="@Html.YourCustomHelperForActiveTab("Index","Home")" >
    <href="@Url.Action("Index", "Home")">
</li> 

更新:各タブのクラスを取得するためのヘルパーの例は次のようになる可能性があることに言及することも一部の人々にとって役立つかもしれません:(ソース)

public static string ActiveTab(this HtmlHelper helper, string activeController, string[] activeActions, string cssClass)
{
    string currentAction = helper.ViewContext.Controller.
            ValueProvider.GetValue("action").RawValue.ToString();
    string currentController = helper.ViewContext.Controller.
            ValueProvider.GetValue("controller").RawValue.ToString();

    string cssClassToUse = currentController == activeController 
         && activeActions.Contains(currentAction)
                               ? cssClass
                               : string.Empty;
    return cssClassToUse;
}
于 2013-07-02T18:17:40.940 に答える