MVC4枚举和单选button列表
我已经看到了这个几个线程,但似乎没有适用于MVC4,因为RadioButtonFor HTML扩展方法/帮手不存在。
假设我有一个枚举列表 – 即航空公司:
public enum Airlines { Unknown = 0, BritishAirways = 1, VirginAtlantic = 2, AirFrance = 3 }
我如何将它绑定到我的视图上的单选button列表,并能够检索选定的项目? 如果没有select,可以说“select一个项目”呢?
您可以为枚举Airlines
创build一个自定义的编辑器模板,它将呈现一个单选button列表。 在您的模型中,您将拥有一个types为Airlines
的属性,并使用Required
属性标记此属性,并设置ErrorMessage = "select one item"
。 不要忘记,如果你想要的话,包括jQueryvalidation客户端validation,通常只需要添加@Scripts.Render("~/bundles/jqueryval")
在您的布局或视图。 如果你不使用jQueryvalidation,你将需要在模型上使属性为空,因为枚举默认设置为第一个值,所以MVC不会认为它是无效的。 请记住,如果将属性更改为可为空,则还需要将“编辑器模板”的“模型”types更改为可以为null。
UPDATE
要使编辑器模板呈现任何枚举的单选button列表,请将模板更改为以下内容:
@model Enum @foreach (var value in Enum.GetValues(Model.GetType())) { @Html.RadioButtonFor(m => m, value) @Html.Label(value.ToString()) }
原版的
在Editor \ Shared \ EditorTemplates目录中的Editor Template, Airlines.cshtml :
@model MvcTest.Models.Airlines @foreach (var value in Enum.GetValues(typeof(MvcTest.Models.Airlines))) { @Html.RadioButtonFor(m => m, value) @Html.Label(value.ToString()) }
该模型:
public class TestModel { [Required(ErrorMessage = "select one item")] public Airlines Airline { get; set; } }
行动方法:
public class HomeController : Controller { [HttpGet] public ActionResult Index() { return View(new TestModel()); } [HttpPost] public ActionResult Index(TestModel model) { if (ModelState.IsValid) { return RedirectToAction("Index"); } return View(model); } }
风景:
@model MvcTest.Models.TestModel @{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Layout.cshtml"; } <h2>Index</h2> @using (Html.BeginForm()) { @Html.EditorFor(m => m.Airline) <input type="submit" value="Submit" /> @Html.ValidationSummary(false) }
我build议类似的方法来解决其他答案,但是使用下面的编辑器模板; EnumRadioButtonList.cshtml ,在Views \ Shared \ EditorTemplates目录中:
@model Enum @foreach (var value in Enum.GetValues(Model.GetType())) { var id = TagBuilder.CreateSanitizedId(string.Format( "{0}_{1}_{2}", ViewData.TemplateInfo.HtmlFieldPrefix, Model.GetType(), value)); <div> @Html.RadioButton(string.Empty, value, value.Equals(Model), new { id }) @Html.Label(value.ToString(), new { @for = id }) </div> }
每个单选button的HTML id
需要是唯一的。 因此,上面的代码通过使用ViewData.TemplateInfo.HtmlFieldPrefix
将id
与绑定属性的名称相前缀。 如果模型包含多个使用此枚举的属性,并且这个编辑器模板用于每个属性,这将确保唯一的id
。
每个单选button的伴随label
将具有正确设置的属性。 这意味着用户可以通过单击标签文本来select一个单选button,这比单选button本身更大更好的点击目标。
对于MVC模型绑定,单选button都将其HTML name
属性值设置为EditorFor
调用中指定的属性值(此场景中为Airline
)。
要使用它:
@Html.EditorFor(m => m.Airline, "EnumRadioButtonList")
你是什么意思RadioButtonFor不存在? 我使用MVC4并在我的代码中使用。 对于一个列表,你可以设置多个相同的名字
@Html.RadioButtonFor(x => x.Airlines, Airlines.Unknown) @Html.RadioButtonFor(x => x.Airlines, Airlines.BritishAirways) @Html.RadioButtonFor(x => x.Airlines, Airlines.VirginAtlantic) @Html.RadioButtonFor(x => x.Airlines, Airlines.AirFrance)
这些将被绑定到模型,所以在回发你会看到航空公司设置为选定的项目,并加载页面时,匹配的单选button将被选中。
我通过渐进式故障提高了最高评分答案,以反映选定的值。 将其保存为EnumRadioButton.cshtml到您的共享视图EditorTemplates文件夹:
@model Enum @foreach (var value in Enum.GetValues(Model.GetType())) { if (Equals(Model, value)) { @Html.RadioButtonFor(m => m, value, new {@checked = "checked"}) } else { @Html.RadioButtonFor(m => m, value) } @Html.Label(value.ToString()) }
用法:
@Html.EditorFor(item => Model.MyEnumType, "EnumRadioButton")