MVC5 - Navbar активный цвет

Question

У меня возникли проблемы с получением активного Ли в моей панели навигации, чтобы изменить цвет, когда я нажимаю его и перейти к этой точке зрения, я включил некоторые ниже код, но я покажу вам больше, если необходимо

Это мой Navbar код, который помещается в мой макет общее представление:

<header id="main-header"> 
    <div class="container"> 
     <a href="@Url.Action("Index", "Home")"> 
      <img src="~/logo.png" id="logo" alt="logo" /> 
     </a> 
     <nav class="main-nav"> 
      <ul> 
       @if (User.IsInRole("Admin")) 
       { 
        <li>@Html.ActionLink("Venues", "Index", "Venues")</li> 
        <li>@Html.ActionLink("Events", "Index", "Events")</li> 
        <li>@Html.ActionLink("Bands", "Index", "Bands")</li> 
        <li>@Html.ActionLink("Admin", "Admin", "Home")</li> 
        @Html.Partial("_LoginPartial") 
       } 
       else 
       { 
        <li>@Html.ActionLink("Venues", "Index", "Venues")</li> 
        <li>@Html.ActionLink("Events", "Index", "Events")</li> 
        <li>@Html.ActionLink("Bands", "Index", "Bands")</li> 
        <li>@Html.Partial("_LoginPartial")</li> 
       } 
      </ul> 
     </nav> 
    </div> 
</header> 

Это классы CSS Header-Nav у меня есть:

.main-nav { 
    float: right; 
    padding-top: 17px; 
} 
.main-nav li { 
    float: left; 
    list-style: none; 
    margin-right: 10px; 
    position: relative; 
} 
.main-nav li:last-child { 
    margin-right: 0px; 
} 
.main-nav li.current > a { 
    border: 1px solid; 
} 
.main-nav li a { 
    text-transform: uppercase; 
    font-size: 15px; 
    color: #fff; 
    font-weight: 400; 
    padding: 2px 10px; 
    font-family: 'Montserrat', sans-serif; 
} 

Answer 1

в каждом способе действия необходимых контроллеров вы CA п добавить ViewBag значения:

public ActionResult Index() 
{ 
    ViewBag.Action = ControllerContext.RouteData.Values["Action"].ToString(); 
    ViewBag.Controller = ControllerContext.RouteData.Values["Controller"].ToString(); 

    return View(); 
} 

Тогда в представлении можно использовать следующие применить необходимый класс CSS:

<li class="@(ViewBag.Action == "Index" && ViewBag.Controller == "Venues" ? "current" : "")">@Html.ActionLink("Venues", "Index", "Venues")</li> 
<li class="@(ViewBag.Action == "Index" && ViewBag.Controller == "Events" ? "current" : "")">@Html.ActionLink("Events", "Index", "Events")</li> 
<li class="@(ViewBag.Action == "Index" && ViewBag.Controller == "Bands" ? "current" : "")">@Html.ActionLink("Bands", "Index", "Bands")</li> 
<li class="@(ViewBag.Action == "Admin" && ViewBag.Controller == "Home" ? "current" : "")">@Html.ActionLink("Admin", "Admin", "Home")</li> 

Это, вероятно, хорошо подходит для этих простых ссылок - но если бы вы были собираюсь добавить еще много, я бы порекомендовал добавить вам свой собственный HtmlHelper. См принятый ответ здесь для получения дополнительной информации: How to add "active" class to Html.ActionLink in ASP.NET MVC

Edit:

Вы могли бы упростить еще больше, просто имея это в контроллере:

public class EventsController : Controller 
{ 
    public ActionResult Index() 
    { 
     ViewBag.LinkText = "Events"; 

     return View(); 
    } 
} 

И тогда ссылки будут просто быть, например, :

<li class="@(ViewBag.Linktext == "Events" ? "current" : "")">@Html.ActionLink("Events", "Index", "Events")</li>