MVC3 탭 도우미

Question

페이지의 "탭"기능을 처리하는 html 도우미가 필요합니다. 탭을 클릭하면 페이지가 다시로드되고 부분 뷰 (지정된 경우)가 다시로드됩니다. 나는 이렇게 썼다. 그러나 이것이 최선의 해결책이라고 확신하지 못한다. ??

public static class TabExtensions 
{ 
    public static MvcHtmlString Tabs(this HtmlHelper htmlHelper, List<TabItem> tabItems, object htmlAttributes = null) 
    { 
     if (tabItems == null) 
     { 
      throw new ArgumentException("at least one tab item required"); 
     } 

     string viewName = string.Empty; 
     object model = null; 
     var sb = new StringBuilder(); 
     sb.Append("<a name=\"tabs\"></a>"); 

     var tagUl = new TagBuilder("ul"); 
     tagUl.MergeAttributes(HtmlHelper.AnonymousObjectToHtmlAttributes(htmlAttributes)); 

     // Current url data 
     var baseUri = new UriBuilder(htmlHelper.ViewContext.HttpContext.Request.Url); 
     var selTab = htmlHelper.ViewContext.RequestContext.HttpContext.Request.QueryString["tab"]; 

     foreach (var tab in tabItems) 
     { 
      // No tab user selected 
      if (string.IsNullOrEmpty(selTab)) 
      { 
       selTab = tab.TabLinkText; 
      } 

      var tagLi = new TagBuilder("li"); 
      string tagInnerHtml; 

      if (selTab.Equals(tab.TabLinkText, StringComparison.OrdinalIgnoreCase)) 
      { 
       tagLi.MergeAttribute("class", "current"); 
       tagInnerHtml = string.Format("<strong>{0}</strong>", tab.Text); 
       viewName = tab.PartialViewName; 
       model = tab.PartialViewModel; 
      } 
      else 
      { 
       tagInnerHtml = tab.Text; 
      } 

      var queryToAppend = string.Concat("tab=", tab.TabLinkText); 
      var querystring = new StringBuilder(); 

      if (baseUri.Query.Length > 1) 
      { 
       if (baseUri.Query.Contains("tab")) 
       { 
        querystring.Append(baseUri.Query.Replace(string.Concat("tab=", selTab), queryToAppend)); 
       } 
       else 
       { 
        querystring.Append(baseUri.Query + "&" + queryToAppend); 
       } 
      } 
      else 
      { 
       querystring.Append("?" + queryToAppend); 
      } 

      // Assign anchor link 
      querystring.Append("#tabs"); 

      tagLi.InnerHtml = string.Format("<a href=\"{0}\">{1}</a>", querystring, tagInnerHtml); 
      tagUl.InnerHtml += tagLi.ToString(); 
     } 

     sb.Append(tagUl.ToString()); 

     // Render partial 
     if (!string.IsNullOrEmpty(viewName)) 
     { 
      htmlHelper.ViewData.Model = model; 

      using (StringWriter sw = new StringWriter()) 
      { 
       ViewEngineResult viewResult = ViewEngines.Engines.FindPartialView(htmlHelper.ViewContext.Controller.ControllerContext, viewName); 
       ViewContext viewContext = new ViewContext(htmlHelper.ViewContext.Controller.ControllerContext, viewResult.View, htmlHelper.ViewData, htmlHelper.ViewContext.TempData, sw); 
       viewResult.View.Render(viewContext, sw); 

       sb.Append(sw.GetStringBuilder().ToString()); 
      } 
     } 

     return MvcHtmlString.Create(sb.ToString()); 
    } 
} 

#region Tab Item Model 

public class TabItem 
{ 
    public string Text { get; set; } 

    public string TabLinkText { get; set; } 

    public string PartialViewName { get; set; } 

    public object PartialViewModel { get; set; } 

    public TabItem(string text, string tabLinkText) 
     : this() 
    { 
     this.Text = text; 
     this.TabLinkText = tabLinkText; 
    } 

    public TabItem(string text, string tabLinkText, string partialViewName, object partialViewModel = null) 
     : this() 
    { 
     this.Text = text; 
     this.TabLinkText = tabLinkText; 
     this.PartialViewName = partialViewName; 
     this.PartialViewModel = partialViewModel; 
    } 

    public TabItem() 
    { 
     this.Text = string.Empty; 
     this.PartialViewName = string.Empty; 
     this.TabLinkText = string.Empty; 
     this.PartialViewModel = null; 
    } 
} 

#endregion 

당신은 너무처럼 사용

<ul class="firmTabs clearfix"><li><a href="?tab=about#tabs">O firmie</a></li><li><a href="?tab=offer#tabs">Firma oferuje</a></li><li><a href="?tab=profile#tabs">Profil</a></li><li class="current"><a href="?tab=contact#tabs"><strong>Kontakt</strong></a></li></ul> 

Answer 1

나는 더 나은 솔루션 탭 메뉴 및 보기를 마스터 페이지를 만드는 것입니다 생각 :

    <% 
         var tabList = new List<TabItem> 
         { 
          new TabItem(LocalResources.fld_AboutFirm_lbl, "about"), 
          new TabItem(LocalResources.fld_FirmOffers_lbl, "offer"), 
          new TabItem(LocalResources.fld_Profile_lbl, "profile", "~/Views/Partial/FirmProfileTab.cshtml", Model), 
          new TabItem(LocalResources.fld_Contact_lbl, "contact", "~/Views/Partial/FirmContactTab.cshtml", Model) 
         }; 
        %> 
        <%: Html.Tabs(tabList, new { @class = "firmTabs clearfix" })%> 

이 HTML을 생성합니다 페이지 내용은입니다. 당신의 접근 방식은 나를 위해 매우 복잡해 보입니다. 왜 HTML 도우미가 필요합니까? html을 헬퍼 메소드로 캡슐화하면 뷰가 느슨해집니다. 그래서 MVC 측면에서 당신의 생각은 좋지 않습니다.