DropDownList 的編輯器模板

我為實現引導程序的字元串欄位創建了一個 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"))

所以它基本上是一個帶有 Twitter Bootstrap 樣式的 Generic DropDownList。

選項1

創建一個EditorTemplate命名BootstrapSelect.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"))

引用自：https://stackoverflow.com/questions/26162218