Asp.Net Mvc выделяет текущую технику ссылки на страницу?

Question

Мне нужно выделить активную ссылку в меню. Кстати, мое меню находится на главной странице. Я ищу лучший способ реализовать это? Есть идеи?

Answer 1

Лучший способ справиться с этим - написать HTML-помощник. Вы можете использовать RouteData.Values["action"], чтобы получить выполняемое в данный момент действие и сравнить с именем меню, и если они соответствуют применяемому классу CSS, который выделит его.

public static MvcHtmlString MenuItem(
    this HtmlHelper htmlHelper, 
    string action, 
    string text 
) 
{ 
    var menu = new TagBuilder("div"); 
    var currentAction = (string)htmlHelper.ViewContext.RouteData.Values["action"]; 
    if (string.Equals(
      currentAction, 
      action, 
      StringComparison.CurrentCultureIgnoreCase) 
    ) 
    { 
     menu.AddCssClass("highlight"); 
    } 
    menu.SetInnerText(text); 
    return MvcHtmlString.Create(menu.ToString()); 
} 

И затем использовать этот помощник для отображения пунктов меню:

<%: Html.MenuItem("about", "About us") %> 
<%: Html.MenuItem("contact", "Contact us") %> 
... 

Answer 2

Я уверен, что вы можете сделать это с помощью чистого CSS. Он включает в себя селектор классов и faffing around с тегом тела. Я бы пошел со вспомогательным методом каждый день недели.

Answer 3

Я использую это решение:

Первый - добавить атрибут данных-menuPageId в меню связывает

<ul class="menu"> 
    <li data-menuPageId="home"> 
      @(Html.Link<HomeController>(x => x.Index(), "Home")) 
    </li> 
    <li data-menuPageId="products"> 
      @(Html.Link<ProductsController>(x => x.Index(), "Products")) 
    </li> 
</li> 

Следующая - добавить скрытое поле для текущей страницы Id к Layout.cshtml

<input type="hidden" id="currentPageId" value="@(ViewBag.Page ?? "home")" /> 

Добавить ViewBag.Page на ваших страницах, например, Главная или Продукты

@{ 
    ViewBag.Page = "products"; 
} 

И последняя вещь, которую вы должны сослаться на эту Javascipt из йор Layout.cshtml

$(function() { 
    var pageIdAttr = "data-menuPageId"; 
    var currentPage = $("#currentPageId").attr("value"); 

    var menu = $(".menu"); 

    $("a[" + pageIdAttr + "]").removeClass("selected"); 
    $("a[" + pageIdAttr + "=\"" + currentPage + "\"]", menu).addClass("selected"); 
}); 

Answer 4

Я всегда использовать это решение Html Часть

<ul> 
    @Html.ListItemAction("Home Page","Index","Home") 
    @Html.ListItemAction("Manage","Index","Home") 
</ul> 

Helper Часть

public static class ActiveLinkHelper 
    { 
     public static MvcHtmlString ListItemAction(this HtmlHelper helper, string name, string actionName, string controllerName) 
     { 
     var currentControllerName = (string)helper.ViewContext.RouteData.Values["controller"]; 
     var currentActionName = (string)helper.ViewContext.RouteData.Values["action"]; 
     var sb = new StringBuilder(); 
     sb.AppendFormat("<li{0}", (currentControllerName.Equals(controllerName, StringComparison.CurrentCultureIgnoreCase) && 
              currentActionName.Equals(actionName, StringComparison.CurrentCultureIgnoreCase) 
               ? " class=\"active\">" : ">")); 
     var url = new UrlHelper(HttpContext.Current.Request.RequestContext); 
     sb.AppendFormat("<a href=\"{0}\">{1}</a>", url.Action(actionName, controllerName), name); 
     sb.Append("</li>"); 
     return new MvcHtmlString(sb.ToString()); 
    } 
} 

Answer 5

В макет попробуйте следующее:

@{ 
    string url = Request.RawUrl; 
} 
@switch (url) 
{ 
    case "/home/":     
     @Html.ActionLink("Home", "../home/", null, new { @style = "background:#00bff3;" }) 
     @Html.ActionLink("Members", "../home/MembersList/") 
    break; 
    case "/home/MembersList/": 
     @Html.ActionLink("Home", "../home/") 
     @Html.ActionLink("Members", "../home/MembersList/", null, new { @style = "background:#00bff3;" }) 
    break; 
    default: 
      @Html.ActionLink("Home", "../home/") 
      @Html.ActionLink("Members", "../home/MembersList/") 
    break; 
} 

Answer 6

Если вы хотели бы также предоставить информацию контроллер, пожалуйста, посмотрите на эту ссылку

https://stackoverflow.com/a/20411015/875708