EditorTemplate爲DropDownList的

Question

我已經創建了一個實現引導字符串字段的EditorTemplate如下：

@using MyProject 
@model object 
<div class="form-group"> 
    @Html.LabelFor(m => m, new { @class = "col-md-3 control-label" }) 
    <div class="col-md-9"> 
     @Html.TextBox(
      "", 
      ViewData.TemplateInfo.FormattedModelValue, 
      htmlAttributes) 
     @Html.ValidationMessageFor(m => m, null, new { @class = "help-block" }) 
    </div> 
</div> 

而且我可以簡單地稱之爲是這樣的：

@Html.EditorFor(model => model.FirstName,"BootstrapString") 

我的問題： 我怎麼會做這樣的一個DropDownList，這樣我可以只叫@ Html.EditorFor如下：

@Html.EditorFor(model => model.CategoryId,new SelectList(ViewBag.Categories, "ID", "CategoryName")) 

所以它基本上是一個通用的DropDownList與Twitter的引導造型。

Answer 1

選項1

創建一個名爲EditorTemplateBootstrapSelect.cshtml

@model object 
<div class="form-group"> 
    @Html.LabelFor(m => m, new { @class = "col-md-3 control-label" }) 
    <div class="col-md-9"> 
    @Html.DropDownListFor(m => m, (SelectList)ViewBag.Items, new { @class = "form-control"}) 
    @Html.ValidationMessageFor(m => m, null, new { @class = "help-block" })  
    </div> 
</div> 

，並在視圖

@Html.EditorFor(m => m.CategoryId, "BootstrapSelect") 

但這意味着你送花兒給人需要分配`在ViewBag.Items控制器

var categories = // get collection from somewhere 
ViewBag.Items = new SelectList(categories, "ID", "CategoryName"); 

選項2

修改EditorTemplate接受額外的ViewData

@model object 
<div class="form-group"> 
    @Html.LabelFor(m => m, new { @class = "col-md-3 control-label" }) 
    <div class="col-md-9"> 
    @Html.DropDownListFor(m => m, (SelectList)ViewData["selectList"], new { @class = "form-control"}) 
    @Html.ValidationMessageFor(m => m, null, new { @class = "help-block" })  
    </div> 
</div> 

，並在視圖中通過SelectList在additionalViewData參數

@Html.EditorFor(m => m.CategoryId, "BootstrapSelect", new { selectList = new SelectList(ViewBag.Categories, "ID", "CategoryName") }) 

這是在更好的你不需要依賴ViewBag。例如，如果您有一個屬性public SelectList CategoryItems { get; set; }視圖模型，那麼你可以使用

@Html.EditorFor(m => m.CategoryId, "BootstrapSelect", Model.CategoryItems) 

選項3

創建了自己的助手利用內置的輔助方法

using System; 
using System.Linq.Expressions; 
using System.Text; 
using System.Web.Mvc; 
using System.Web.Mvc.Html; 

namespace YourAssembly.Html 
{ 
    public static class BootstrapHelper 
    { 
    public static MvcHtmlString BootstrapDropDownFor<TModel, TValue>(this HtmlHelper<TModel> helper, Expression<Func<TModel, TValue>> expression, SelectList selectList) 
    {  
     MvcHtmlString label = LabelExtensions.LabelFor(helper, expression, new { @class = "col-md-3 control-label" }); 
     MvcHtmlString select = SelectExtensions.DropDownListFor(helper, expression, selectList, new { @class = "form-control" }); 
     MvcHtmlString validation = ValidationExtensions.ValidationMessageFor(helper, expression, null, new { @class = "help-block" }); 
     StringBuilder innerHtml = new StringBuilder(); 
     innerHtml.Append(select); 
     innerHtml.Append(validation); 
     TagBuilder innerDiv = new TagBuilder("div"); 
     innerDiv.AddCssClass("col-md-9"); 
     innerDiv.InnerHtml = innerHtml.ToString(); 
     StringBuilder outerHtml = new StringBuilder(); 
     outerHtml.Append(label); 
     outerHtml.Append(innerDiv.ToString()); 
     TagBuilder outerDiv = new TagBuilder("div"); 
     outerDiv.AddCssClass("form-group"); 
     outerDiv.InnerHtml = outerHtml.ToString(); 
     return MvcHtmlString.Create(outerDiv.ToString()); 
    } 
    } 
} 

並在視圖

@Html.BootstrapDropDownFor(m => m.CategoryId, new SelectList(ViewBag.Categories, "ID", "CategoryName"))