MVC中下拉框显示枚举项

原文:MVC中下拉框显示枚举项

本篇将通过3种方式，把枚举项上的自定义属性填充到下拉框：
1、通过控制器返回List<SelectListItem>类型给前台视图
2、通过为枚举类型属性打上UIHint属性让模版显示枚举项
3、通过自定义元数据提供器DataAnnotationsModelMetadataProvider让模版显示枚举项

我们经常会把类型为Int16的属性通过枚举来获得。比如：

public class SomeClass

{

    public int16 Status{get;set;}

}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

对应的枚举：

public enum StatusEnum

    Enable = 0,

    Disable = 1

在MVC视图中可能会这样写：

<select id="sel">

   <option value="">==选择状态==</option>

   <option value="0">启用</option>

   <option value="1">禁用</option>

</select>

如果枚举的项发生变化怎么办？比如：

public enum StatusEnum

    Enable = 0,

    Disable = 1,

    NeverComeback = 2

如果修改每一页的代码，显然是不合理的。最理想的做法是：为每一个枚举项打上属性，显示的时候直接读取枚举以及枚举项属性值。

通过控制器返回List<SelectListItem>类型给前台视图

定义一个Model,其中有一个类型为Int16的属性Status，这个属性用来接收枚举值。

using System;

using System.ComponentModel.DataAnnotations;

namespace MvcApplication1.Models

    public class Stadium

        public int Id { get; set; }

        [Display(Name = "场馆名称")]

        public string Name { get; set; }

        [Display(Name = "是否启用")]

        public Int16 Status { get; set; }

为每个枚举项打上的属性需要我们自定义，通过构造函数接收名称，并提供一个属性供外部访问。

using System;

namespace MvcApplication1.Extension

    public class EnumDisplayNameAttribute : Attribute

        private string _displayName;

        public EnumDisplayNameAttribute(string displayName)

            this._displayName = displayName;

        public string DisplayName

            get { return _displayName; }

为每个枚举项打上自定义属性。

using MvcApplication1.Extension;

namespace MvcApplication1.Models.Enum

    public enum StatusEnum

        [EnumDisplayName("启用")]

        Enable = 0,

        [EnumDisplayName("禁用")]

        Disable =  1

我们的目的是在控制器获取List<SelectListItem>集合，然后传递到前台视图。现在，枚举和枚举项上的自定义属性都有了，有必要创建一个帮助类来帮我们获取List<SelectListItem>集合。

using System;

using System.Collections.Generic;

using System.Reflection;

using System.Web.Mvc;

namespace MvcApplication1.Extension

    public class EnumExt

        /// <summary>

        /// 根据枚举成员获取自定义属性EnumDisplayNameAttribute的属性DisplayName

        /// </summary>

        /// <param name="e"></param>

        /// <returns></returns>

        public static string GetEnumCustomDescription(object e)

            //获取枚举的Type类型对象

            Type t = e.GetType();

            //获取枚举的所有字段

            FieldInfo[] ms = t.GetFields();

            //遍历所有枚举的所有字段

            foreach (FieldInfo f in ms)

                if (f.Name != e.ToString())

                    continue;

                //第二个参数true表示查找EnumDisplayNameAttribute的继承链

                if (f.IsDefined(typeof (EnumDisplayNameAttribute), true))

                    return

                        (f.GetCustomAttributes(typeof(EnumDisplayNameAttribute), true)[0] as EnumDisplayNameAttribute)

                            .DisplayName;

            //如果没有找到自定义属性，直接返回属性项的名称

            return e.ToString();

        /// <summary>

        /// 根据枚举，把枚举自定义特性EnumDisplayNameAttribut的Display属性值撞到SelectListItem中

        /// </summary>

        /// <param name="enumType">枚举</param>

        /// <returns></returns>

        public static List<SelectListItem> GetSelectList(Type enumType)

            List<SelectListItem> selectList = new List<SelectListItem>();

            foreach (object e in Enum.GetValues(enumType))

                selectList.Add(new SelectListItem(){Text = GetEnumCustomDescription(e),Value = ((int)e).ToString()});

            return selectList;

在控制器中,通过ViewData把List<SelectListItem>集合往前台传。控制器包含2个方法，一个方法用来显示创建视图界面，另一个用来显示编辑视图界面。

        //创建

        public ActionResult Index()

            ViewData["s"] = EnumExt.GetSelectList(typeof (StatusEnum));

            return View(new Stadium());

        //编辑

        public ActionResult Edit()

            Stadium s = new Stadium()

                Id = 2,

                Name = "水立方",

                Status = (short)StatusEnum.Disable

};

            ViewData["s"] = EnumExt.GetSelectList(typeof(StatusEnum));

            return View(s);

在强类型的创建视图界面中，通过@Html.DropDownListFor(model => model.Status,(List<SelectListItem>)ViewData["s"])接收来自控制器的数据。

@model MvcApplication1.Models.Stadium

@{

    ViewBag.Title = "Index";

    Layout = "~/Views/Shared/_Layout.cshtml";

<h2>Index</h2>

@using (Html.BeginForm()) {

    @Html.ValidationSummary(true)

    <fieldset>

        <legend>Stadium</legend>

        <div class="editor-label">

            @Html.LabelFor(model => model.Name)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.Name)

            @Html.ValidationMessageFor(model => model.Name)

        </div>

        <div class="editor-label">

            @Html.LabelFor(model => model.Status)

        </div>

        <div class="editor-field">

            @Html.DropDownListFor(model => model.Status,(List<SelectListItem>)ViewData["s"])

            @Html.ValidationMessageFor(model => model.Status)

        </div>

<p>

            <input type="submit" value="添加" />

        </p>

    </fieldset>

@section Scripts {

    @Scripts.Render("~/bundles/jqueryval")

在强类型的编辑视图界面中，同样通过@Html.DropDownListFor(model => model.Status,(List<SelectListItem>)ViewData["s"])接收来自控制器的数据。

@model MvcApplication1.Models.Stadium

@{

    ViewBag.Title = "Edit";

    Layout = "~/Views/Shared/_Layout.cshtml";

<h2>Edit</h2>

@using (Html.BeginForm()) {

    @Html.ValidationSummary(true)

    <fieldset>

        <legend>Stadium</legend>

        @Html.HiddenFor(model => model.Id)

        <div class="editor-label">

            @Html.LabelFor(model => model.Name)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.Name)

            @Html.ValidationMessageFor(model => model.Name)

        </div>

        <div class="editor-label">

            @Html.LabelFor(model => model.Status)

        </div>

        <div class="editor-field">

             @Html.DropDownListFor(model => model.Status,(List<SelectListItem>)ViewData["s"])

            @Html.ValidationMessageFor(model => model.Status)

        </div>

<p>

            <input type="submit" value="编辑" />

        </p>

    </fieldset>

@section Scripts {

    @Scripts.Render("~/bundles/jqueryval")

创建界面：

编辑界面：

通过为枚举类型属性打上UIHint属性让模版显示枚举项

由于模版是根据属性类型来判断的，再定义一个Model，其中一个属性类型是枚举。

using System.ComponentModel.DataAnnotations;

using MvcApplication1.Models.Enum;

namespace MvcApplication1.Models

    public class Stadium1

        public int Id { get; set; }

        [Display(Name = "场馆名称")]

        public string Name { get; set; }

        [Display(Name = "是否启用")]

        public StatusEnum Status { get; set; }

在Views/Shared/EditorTemplates文件夹下创建Enum.cshtml,用来处理类型为Enum的属性。

@using System.ComponentModel.DataAnnotations

@using System.Reflection

@using MvcApplication1.Extension

@{

    var selectList = new List<SelectListItem>();

    string optionLabel = null;

    object htmlAttributes = null;

    var enumType = (Type)Model.GetType();

    foreach (var value in Enum.GetValues(enumType))

        var field = enumType.GetField(value.ToString());

        var option = new SelectListItem() {Value = value.ToString()};

        var display = field.GetCustomAttributes(typeof (EnumDisplayNameAttribute), false).FirstOrDefault() as EnumDisplayNameAttribute;

        if (display != null)

            option.Text = display.DisplayName;

        else

            option.Text = value.ToString();

        option.Selected = object.Equals(value, Model);

        selectList.Add(option);

@Html.DropDownList("",selectList, optionLabel, htmlAttributes)

控制器中有2个方法用来显示创建和编辑视图界面。

        //创建

        public ActionResult TemplateCreate()

            return View(new Stadium1());

        //编辑

        public ActionResult TemplateEdit()

            Stadium1 s = new Stadium1()

                Id = 2,

                Name = "水立方",

                Status = StatusEnum.Disable

};

            return View(s);

强类型的创建视图界面：

@model MvcApplication1.Models.Stadium1

@{

    ViewBag.Title = "TemplateCreate";

    Layout = "~/Views/Shared/_Layout.cshtml";

<h2>TemplateCreate</h2>

@using (Html.BeginForm()) {

    @Html.ValidationSummary(true)

    <fieldset>

        <legend>Stadium</legend>

        <div class="editor-label">

            @Html.LabelFor(model => model.Name)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.Name)

            @Html.ValidationMessageFor(model => model.Name)

        </div>

        <div class="editor-label">

            @Html.LabelFor(model => model.Status)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.Status)

            @Html.ValidationMessageFor(model => model.Status)

        </div>

<p>

            <input type="submit" value="Create" />

        </p>

    </fieldset>

@section Scripts {

    @Scripts.Render("~/bundles/jqueryval")

强类型的编辑视图界面：

@model MvcApplication1.Models.Stadium1

@{

    ViewBag.Title = "TemplateEdit";

    Layout = "~/Views/Shared/_Layout.cshtml";

<h2>TemplateEdit</h2>

@using (Html.BeginForm()) {

    @Html.ValidationSummary(true)

    <fieldset>

        <legend>Stadium</legend>

        @Html.HiddenFor(model => model.Id)

        <div class="editor-label">

            @Html.LabelFor(model => model.Name)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.Name)

            @Html.ValidationMessageFor(model => model.Name)

        </div>

        <div class="editor-label">

            @Html.LabelFor(model => model.Status)

        </div>

        <div class="editor-field">

            @Html.EditorFor(model => model.Status)

            @Html.ValidationMessageFor(model => model.Status)

        </div>

<p>

            <input type="submit" value="Save" />

        </p>

    </fieldset>

@section Scripts {

    @Scripts.Render("~/bundles/jqueryval")

最后，给Stadium1的枚举属性，打上UIHint属性，指明使用公共Enum类型模版Views/Shared/EditorTemplates/Enum.cshtml。

using System.ComponentModel.DataAnnotations;

using MvcApplication1.Models.Enum;

namespace MvcApplication1.Models

    public class Stadium1

        public int Id { get; set; }

        [Display(Name = "场馆名称")]

        public string Name { get; set; }

        [Display(Name = "是否启用")]

        [UIHint("Enum")]

        public StatusEnum Status { get; set; }

创建视图界面：

编辑视图界面：

通过自定义元数据提供器DataAnnotationsModelMetadataProvider让模版显示枚举项

如果觉得为属性打上[UIHint("Enum")]属性麻烦的话，还可以通过数据提供器，为所有类型为Enum的属性指明模版。

当然自定义的元数据提供器是需要在全局中注册的。

    public class MvcApplication : System.Web.HttpApplication

        protected void Application_Start()

            AreaRegistration.RegisterAllAreas();

            WebApiConfig.Register(GlobalConfiguration.Configuration);

            FilterConfig.RegisterGlobalFilters(GlobalFilters.Filters);

            RouteConfig.RegisterRoutes(RouteTable.Routes);

            BundleConfig.RegisterBundles(BundleTable.Bundles);

            //注册自定义元数据提供其

            ModelMetadataProviders.Current = new CustomMetadataProvider();

现在可以把Stadium的[UIHint("Enum")]注释掉。

总结

如果，我们想在下拉框中显示枚举项，首先给枚举项打上自定义属性，通过反射可以拿到自定义属性的相关属性值。

如果，想在控制器方法中获取List<SelectListItem>集合往前台传，我们可以封装一个方法，根据枚举返回List<SelectListItem>集合；

如果想根据属性的类型显示枚举模版，要么给枚举属性打上[UIHint("Enum")]，要么在全局自定义一个DataAnnotationsModelMetadataProvider。

MVC中下拉框显示枚举项的更多相关文章

ASP.NET MVC之下拉框绑定四种方式（十）
前言上两节我们讲了文件上传的问题,关于这个上传的问题还未结束,我也在花时间做做分割大文件处理以及显示进度的问题,到时完成的话再发表,为了不耽误学习MVC其他内容的计划,我们今天开始好好讲讲关于MVC ...
flex中下拉框的实现
flex中下拉框的实现 <mx:ComboBox id = "combobox" dataProvider = "{deviceCodeType }" e ...
jquery选中将select下拉框中一项后赋值给text文本框
jquery选中将select下拉框中一项后赋值给text文本框,出现无法将第一个下拉框的value赋值给文本框因为select默认选中第一项..在选择第一项时,便导致无法激发onchange事件. ...
Bootstrap Flat UI的select下拉框显示不出来问题解决
Bootstrap Flat UI的select下拉框显示不出来?看这里,恰巧今天我也遇到了这个问题: 点击Messages后并没有出现下拉列表,然而官网的index.html却能显示出来. 经过一番 ...
MVC视图中下拉框的使用
一.一般变量或对象的绑定首先要在controller 中将选项设置成 selecList对象,并赋值给viewBag动态对象. public ActionResult Index(string mo ...
ASP.NET MVC 下拉框的传值的两种方式
以前使用WebForm变成时,下拉框传值只需直接在后台绑定代码就可以了.现在我们来看看在MVC中DropDownList是如果和接受从Controller传过来的值的. 第一种:使用DropDownL ...
jQuery Ajax MVC 下拉框联动
无刷新下拉框联动方法: Controllers代码 public JsonResult DH_Change(string DH_ID) { List<SelectListItem> Tea ...
Js获取下拉框当前选择项的文本和值
现在有一个Id为AreaId的下拉框,要获取它当前选择项的文本和值有以下方法: <span class="red">* </span> 地区: ...
DevExpress GridControl 中下拉框联动效果的实现（及支持文本框录入情况）
先解释一下标题: grid中的某一列默认为文本框,根据需要动态的变更为下拉框,且支持动态变更数据源需求是这样的: 有一些参数(A),这些参数又分别对应另外的参数(B),所以,先把A作为一列,B根据A ...

随机推荐

Vs2012在Linux应用程序开发（3）：加入新平台hi3516
下面我们将VS2012添加一个新的平台支持,由于近来与哈斯hi3516.就选它吧! 1.1 复制平台文件原来一直认为要让VS支持一个新的平台须要编写代码,某天在看MSBUILD文件夹的时候突 ...
springmvc + excel代
1.xml简介  <bean class="org.springframework.web.servlet.view.Bea ...
Atitit.软件的仪表板(8)--os子系统--监控资源使用情况
Atitit.软件的仪表板(8)--os系统--资源占用监測 CPU使用内存使用磁盘队列任务管理器网络速度插件列表( 资源管理器插件,浏览器插件,360optim) 启动项管理 (350) ...
间隔DP基础 POJ2955——Brackets
取血怒.first blood,第一区间DP,这样第一次没有以某种方式在不知不觉中下降~~~ 题目尽管是鸟语.但还是非常赤裸裸的告诉我们要求最大的括号匹配数.DP走起~ dp[i][j]表示区间[i, ...
linux 下上传 datapoint数据到yeelink 修改版本
/*client.c*/ #include <stdio.h> #include <stdlib.h> #include <string.h> #include ...
CenOS下安装jdk
1. 安装JDK1.7.0 下载完成后在取得root权限后执行: [root@sea sea]# sudo rpm -ivh /目录/jdk-7-linux-x64.rpm 执行结果: Prepari ...
【屌丝程序的口才逆袭演讲稿50篇】第十篇：程序猿们请看看外面的世界吧【张振华.Jack】
演讲稿主题:<程序猿们请看看外面的世界吧> --作者:张振华Jack 大家都知道我是一个程序猿.几年下来认识了最典型的三个程序猿. ...
【C语言探索之旅】第一部分第八课：第一个C语言小游戏
内容简介 1.课程大纲 2.第一部分第八课:第一个C语言小游戏 3.第一部分第九课预告: 函数课程大纲我们的课程分为四大部分,每一个部分结束后都会有练习题,并会公布答案.还会带大家用C语言编写 ...
如何更改IE查看源代码菜单使用的HTML编辑器
一:打开注册表｡二:打开"HKEY_CURRENT_USER/SOFTWARE/MICROSOFT/INTERNET EXPLORER"或"HKEY_LOCAL_MAC ...
左右AjaxFileUpload背景返回Json治
项目中用到图片的无刷新上传,因此想到用ajaxUpLoadFile来解决. 第一步,先在上传图片的页面引入你下载到本地的ajaxfileupload.js文件. 文件下载地址:http://downl ...

MVC中下拉框显示枚举项

MVC中下拉框显示枚举项的更多相关文章

随机推荐

热门专题