2016-08-03 1 views
3

私はmenu items on master pageを持っています。ユーザーがそのメニュー項目をクリックすると、私はそれをアクティブにしたいと思います。私はそれをアクティブにするために既存のクラスにアクティブを追加したい。クリックしたメニュー項目のアクティブクラスを既存のクラスに追加する方法は?

_Layout.cshtml:

<div class="menu-items-navigation"> 
    <div class="Classy-item" class="@Html.IsSelected(actions: "Index", controllers: "Classy")"> 
     <a href="@Url.Action("Index", "Classy")" > 
      <div style="padding-top: 50px;">Classy Items</div> 
     </a> 
    </div> 
    <div class="Regular-stuff"> 
     <a href="@Url.Action("Index", "RegularStuff")"> 
      <div style="padding-top: 50px;">Regular Stuff</div> 
     </a> 
    </div> 

    <div class="Popular-Vessels"> 
     <a href="@Url.Action("Index", "PopularVessels")"> 
      <div style="padding-top: 50px;">Popular Vessels</div> 
     </a> 
    </div> 
</div> 

私は、このメニュー項目はActiveになりたい場合は今、私は、ユーザーが、この3のいずれかをクリックした場合、私はこれを与えたいするActiveと呼ばれる1クラスはDIV持っていますメニュー項目。私はそれにRegular Stuff as Active when user clicksを作りたい場合は

例えば、それは次のようになります。

<div class="Regular-stuff Active"> 

場合は、上品なアイテムをユーザーがクリック:ここReferenceから取ら

<div class="Classy-item Active"> 

コード:

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

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

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

      if (String.IsNullOrEmpty(actions)) 
       actions = currentAction; 

      if (String.IsNullOrEmpty(controllers)) 
       controllers = currentController; 

      string[] acceptedActions = actions.Trim().Split(',').Distinct().ToArray(); 
      string[] acceptedControllers = controllers.Trim().Split(',').Distinct().ToArray(); 

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

しかし、ここで混乱しているクラスこのIsselectedメソッドは、特定のメニュー項目がクリックされたときにクラス属性をdivで2回使用することはできません。

答えて

3

あなたが二回class属性を宣言することはできません、正しいですが、あなたは、このようにそれらを組み合わせることができます:選択されていない場合はレンダリングされます

<div class="Classy-item @Html.IsSelected(actions: "Index", controllers: "Classy")"> 

<div class="Classy-item "> 

またはこのレンダリング選択されている場合:

<div class="Classy-item Active"> 
+0

これはうまくいきません。それを考えてください。 –

関連する問題