2010-10-08 56 views
0

我繼承了一個基於列表的菜單,這個列表在我開始之前就已經使用了,並且需要進入MVC。MVC 2.0中的選定列表項

該列表需要爲所選項目顯示一個白色框,其餘爲標準灰色框。到目前爲止,所有顯示的都是灰色的框。我們一直在尋找解決方案,但我們沒有做到這一點。隨着時間的推移

  <ul id="headerBarMenu" class="horizontalMenu"> 
       <li class="fontstyle01a" > 
        <%: Html.ActionLink("Manage Payment Run", "ManagePaymentRun", "Home")%></li> 
       <li class="fontstyle01a" > 
        <%: Html.ActionLink("About", "About", "Home")%></li> 
      </ul> 
ul.horizontalMenu li 
{ 
    list-style: none; 
    padding: 0; 
    float: left;  
    border-top: 1px solid #bbb; 
    border-right: 1px solid #bbb; 
    border-bottom: 0px; 
    border-left: 1px solid #bbb; 
    margin: 0; 
} 

ul.horizontalMenu a 
{ 
    padding: .6em 1.5em 1em 1.5em; 
    display: block; 
    background: #cccccc; 
} 

ul.horizontalMenu a.selected 
{ 
    position: relative; 
    top: 1px; 
    background: white; 
    color: black; 
    font-weight: bold; 
} 

.fontstyle01a /*bold_dark*/ 
{ 
    font-family: Verdana, Arial, Helvetica, sans-serif; 
    text-align: center; 
    font-size: 7pt; 
    font-style: normal; 
    font-weight: bold; 
    color:#666666; 
    text-decoration: none; 
    margin: 0; 
    padding: 0; 
    width: 140px; 
} 

.fontstyle01a a, a:link, a:visited 
{ 
    color:#666666; 
    text-decoration: none; 
} 

.fontstyle01a a:activea:hover 
{ 
    color:#9f117a; 
} 

名單將擴大我一直都在下面的嘗試和改變它this,但我還沒有找到一個解決方案。

感謝您的時間

回答

0

下面是您可能會嘗試的html助手方法。它設置基於當前操作的類名:

public class Link 
{ 
    public string Text { get; set; } 
    public string Action { get; set; } 
    public string Controller { get; set; } 
    public object RouteValues { get; set; } 
    public object HtmlAttributes { get; set; } 
} 

public static class HtmlExtensions 
{ 
    public static MvcHtmlString Menu(this HtmlHelper htmlHelper, IEnumerable<Link> links) 
    { 
     var currentAction = (string)htmlHelper.ViewContext.RouteData.Values["action"]; 
     var currentController = (string)htmlHelper.ViewContext.RouteData.Values["controller"]; 

     var ul = new TagBuilder("ul"); 
     ul.GenerateId("headerBarMenu"); 
     ul.AddCssClass("horizontalMenu"); 
     links = links ?? Enumerable.Empty<Link>(); 
     var sb = new StringBuilder(); 
     foreach (var link in links) 
     { 
      var li = new TagBuilder("li"); 
      if (string.Equals(currentAction, link.Action, StringComparison.OrdinalIgnoreCase) && 
       string.Equals(currentController, link.Controller, StringComparison.OrdinalIgnoreCase)) 
      { 
       li.AddCssClass("white"); 
      } 
      else 
      { 
       li.AddCssClass("grey"); 
      } 
      li.InnerHtml = htmlHelper.ActionLink(link.Text, link.Action, link.Controller, link.RouteValues, link.HtmlAttributes).ToHtmlString(); 
      sb.Append(li.ToString()); 
     } 
     ul.InnerHtml = sb.ToString(); 
     return MvcHtmlString.Create(ul.ToString()); 
    } 
} 

,然後應用在你的意見菜單:

<%= Html.Menu(new[] { 
    new Link { Text = "Manage Payment Run", Action = "ManagePaymentRun", Controller = "Home" }, 
    new Link { Text = "About", Action = "About", Controller = "Home" }, 
}) %> 

現在,如果您導航到/home/ManagePaymentRun第一li將獲得一流的white,如果你導航到/home/about第二個li將得到這個類。

現在,所有剩下的就是樣式這些規則:

.white { 
    /** TODO **/ 
} 
.grey { 
    /** TODO **/ 
} 
0

退房this answer到我的問題之一。它是一個基於控制器和/或操作返回類名的HtmlHelper。

+0

我已經使用你們倆的代碼來寫一些東西來爲我的案例工作。不幸的是,我只能選擇1個答案,但如果我得到15rep,我會upvote。謝謝。 – Andy 2010-10-11 11:48:34

相關問題