2012-04-19 15 views
8

Twitter önyükleme tabanlı bir sayfa oluşturuyorum.ViewModel özelliğine göre div sınıfını değiştir

Belirli bir CUD'de, bir div sınıfını değiştirmem gerekiyor. Benim viewmodel özelliklerine bağlı olarak class="tab-pane active" veya class="tab-pane".

Özellik muhtemelen bir int olacak ve her div için aktif sekmede bir doğrulama yapacağım. Bu doğru geliyor mu? Böyle Deneyin

<div class="@(Model.ActiveTab == 1 ? "tab-pane active" : "tab-pane")" id="1"> 
+0

IS Rible etiket çorba özel bir HTML yardımcı yazma beklenen? –

cevap

10

:

<div class="tab-pane @(Model.ActiveTab == 1 ? " active" : "")" id="1"> 
    ... 
</div> 

bu Bu çalışması gerekir

+1

+1 Cevabımdan daha iyi: D –

2

işe yaramadı açıkçası

<div(@Model.ActiveTab == 1 ? class="tab-pane active" : class="tab-pane") id="1"> 

ama:

Ben böyle bir şey düşündüm veya bu hordan kaçınmak için

public static class TabExtensions 
{ 
    private class TabControl: IDisposable 
    { 
     private readonly ViewContext _viewContext; 
     public TabControl(ViewContext viewContext) 
     { 
      _viewContext = viewContext; 
     } 

     public void Dispose() 
     { 
      _viewContext.Writer.Write("</div>"); 
     } 
    } 

    public static IDisposable Tab(this HtmlHelper htmlHelper, bool active, object htmlAttributes) 
    { 
     var div = new TagBuilder("div"); 
     div.MergeAttributes(new RouteValueDictionary(htmlAttributes)); 
     div.AddCssClass("tab-pane"); 
     if (active) 
     { 
      div.AddCssClass("active"); 
     } 
     htmlHelper.ViewContext.Writer.Write(div.ToString(TagRenderMode.StartTag)); 
     return new TabControl(htmlHelper.ViewContext); 
    } 
} 

böyle kullanılabilir:

@using (Html.Tab(Model.ActiveTab == 1, new { id = "tab1" })) 
{ 
    ... 
} 

ve bu durumda yayarlar olacaktır: ActiveTab değeri olarak

<div class="tab-pane active" id="tab1"> 
    ... 
</div> 
İlgili konular