Model Validation in Asp.net MVC

原文:Model Validation in Asp.net MVC

     本文用于记录Pro ASP.NET MVC 3 Framework中阐述的数据验证的方式。 

     先说服务器端的吧。最简单的一种方式自然是直接在Action方法中来进行了,如下:

        [HttpPost]
        public ViewResult MakeBooking(Appointment appt)
        {        
            if (String.IsNullOrWhiteSpace(appt.ClientName))
            {
                ModelState.AddModelError("ClientName", "Please enter your name");
            }
            if (ModelState.IsValidField("Date") && DateTime.Now > appt.Date)
            {
                ModelState.AddModelError("Date", "Please enter a date in the future");
            }
            if (!appt.TermsAccepted)
            {
                ModelState.AddModelError("TermsAccepted", "You must accept the terms");
            }
            if (ModelState.IsValidField("ClientName") && ModelState.IsValidField("Date") &&
                appt.ClientName == "Joe" && appt.Date.DayOfWeek == DayOfWeek.Monday)
            {
                ModelState.AddModelError("", "Joe cannot book appointments on Mondays");
            }

            if (ModelState.IsValid)
            {
                repository.SaveAppointment(appt);
                return View("Completed", appt);
            }
            else
            {
                return View();
            } 
        }

补充Appointment类源码如下:

 

    public class Appointment
    {
        public string ClientName { get; set; }

        [DataType(DataType.Date)]
        public DateTime Date { get; set; }

        public bool TermsAccepted { get; set; }
    }

 

可以看到,Appointment类很POCO,其中Date属性上的DataType属性,不过是标注Date属性值为DateTime的Date部分(去掉Time部分)。再看action内部,将传入的appointment对象属性进行了一个遍历校验。最后,ModelState.AddModelError("", "Joe cannot book appointments on Mondays");
是标注一个对象模型级别的错误(方法的key参数为空),模型级别错误可以标注多个,它们均将通过@Html.ValidationSummary()显示错误信息。

      上述action对应的view为:

@model PageValidation.Models.Appointment
           
@{
    ViewBag.Title = "Make A Booking";
}
<h4>Book an Appointment</h4>
@using (Html.BeginForm())
{
    @Html.ValidationSummary();
                             
    <p>
        Your name: @Html.EditorFor(m => m.ClientName)     
        @Html.ValidationMessageFor(m => m.ClientName)   
    </p>
    <p>
        Appointment Date: @Html.EditorFor(m => m.Date)
        @Html.ValidationMessageFor(m => m.Date)
    </p>
    <p>
        @Html.EditorFor(m => m.TermsAccepted) I accept the terms & conditions   
        @Html.ValidationMessageFor(m => m.TermsAccepted)
    </p>
    <input type="submit" value="Make Booking" /> 
}

这个时候,运行程序,神马都不填写然后提交时,页面提示如下:

 

如果不想form中错误提示重复(顶部的summary和顶部的detail),将@Html.ValidationSummary();
更新为@Html.ValidationSummary(true); 即可。这个时候,顶部Validation Summary部分只会提示model-level错误了,比如上文中的ModelState.AddModelError("", "Joe cannot book appointments on Mondays");。
关于@Html.ValidationSummary()更多细节,请MSDN。

      另外,还有一个view的问题是,Firefox和Chrome等一些浏览器上,对checkbox样式的设置不取作用,上图中的效果是通过在checkbox外层包一个div,将checkbox样式转移到div上来实现的。具体为:在项目Views\Shared\EditorTemplates目录下,建立一个Boolean.cshtml文件以覆盖asp.net mvc默认的行为。文件内容如下:

@model bool?      
           
@if (ViewData.ModelMetadata.IsNullableValueType)
{
    @Html.DropDownListFor(m => m, new SelectList(new[] { "Not Set", "True", "False" }, Model));
}
else
{
    ModelState state = ViewData.ModelState[ViewData.ModelMetadata.PropertyName];
    bool value = Model ?? false;
    if (state != null && state.Errors.Count > 0)
    {
    <div class="input-validation-error" style="float: left">
        @Html.CheckBox("", value)
    </div>
    }
    else
    {
    @Html.CheckBox("", value)
    }
}

     

       服务器端验证第2种方式是通过Model Binder了。我们继承DefaultModelBinder来写一个Appointment需要的类:

    public class ValidatingModelBinder : DefaultModelBinder
    {
        protected override void SetProperty(ControllerContext controllerContext, ModelBindingContext bindingContext, 
            PropertyDescriptor propertyDescriptor, object value)
        {
            // make sure we call the base implementation
            base.SetProperty(controllerContext, bindingContext, propertyDescriptor, value);

            // perform our property-level validation
            switch (propertyDescriptor.Name)
            {
                case "ClientName":
                    if (string.IsNullOrEmpty((string)value))
                    {
                        bindingContext.ModelState.AddModelError("ClientName", "Please enter your name");
                    }
                    break;
                case "Date":
                    if (bindingContext.ModelState.IsValidField("Date") && DateTime.Now > ((DateTime)value))
                    {
                        bindingContext.ModelState.AddModelError("Date", "Please enter a date in the future");
                    }
                    break;
                case "TermsAccepted":
                    if (!((bool)value))
                    {
                        bindingContext.ModelState.AddModelError("TermsAccepted", "You must accept the terms");
                    }
                    break;
            }
        }

        protected override void OnModelUpdated(ControllerContext controllerContext, ModelBindingContext bindingContext)
        {
            // make sure we call the base implementation
            base.OnModelUpdated(controllerContext, bindingContext);

            Appointment model = bindingContext.Model as Appointment;
            // apply our model-level validation
            if (model != null && bindingContext.ModelState.IsValidField("ClientName") && bindingContext.ModelState.IsValidField("Date") 
                && model.ClientName == "Joe" && model.Date.DayOfWeek == DayOfWeek.Monday)
            {
                bindingContext.ModelState.AddModelError("", "Joe cannot book appointments on Mondays");
            }
        }
    }

其中,OnModelUpdated方法是当给model所有属性赋值时触发,SetProperty方式是当单个属性变化时即触发。接下来要做的,就是在global的Application_Start方法中注册了:

ModelBinders.Binders.Add(typeof(Appointment), new ValidatingModelBinder());

然后,MakeBooking action就可以解脱出来,只需要如下几行代码:

            if (ModelState.IsValid)
            {
                repository.SaveAppointment(appt);
                return View("Completed", appt);
            }
            else
            {
                return View();
            }   

此时,效果和第1种方式完全一样。

     

     第3种方式是通过MetaData了。Asp.net MVC内置了5个meta data验证属性:Compare、Range、RegularExpression、Required、StringLength。基于这5个属性的一些限制,为了更适切Appointment类,自定义几个验证属性如下:

futureDate验证属性: 

    public class FutureDateValidatorAttribute : ValidationAttribute
    {
        public override bool IsValid(object value)
        {
            var isDate = value is DateTime;
            if(isDate)
            {
                var date = Convert.ToDateTime(value);
                if (date <= DateTime.Now)
                {
                    return false;
                }
            }  

            return true;
        }
    }

MustBeTrue验证属性:

    public class MustBeTrueAttribute : ValidationAttribute
    {
        public override bool IsValid(object value)
        {
            return value is bool && (bool)value;
        }
    }

Appointment验证属性:

    public class AppointmentValidatorAttribute : ValidationAttribute
    {
        public AppointmentValidatorAttribute()
        {
            ErrorMessage = "Joe cannot book appointments on Mondays";
        }

        public override bool IsValid(object value)
        {
            Appointment app = value as Appointment;
            if (app == null || string.IsNullOrEmpty(app.ClientName) || app.Date == null)
            {
                // we don't have a model of the right type to validate, or we don't have
                // the values for the ClientName and Date properties we require
                return true;
            }
            else
            {
                return !(app.ClientName == "Joe" && app.Date.DayOfWeek == DayOfWeek.Monday);
            }
        }
    }

再来定义Appointment类:

    [AppointmentValidator]
    public class Appointment
    {
        [Required(ErrorMessage = "Please enter your name")]
        public string ClientName { get; set; }

        [DataType(DataType.Date)]
        [FutureDateValidator(ErrorMessage = "You must enter a date in the future")]
        public DateTime Date { get; set; }

        //[Range(typeof(bool), "true", "true", ErrorMessage = "You must accept the terms")]
        [MustBeTrue(ErrorMessage = "You must accept the terms")]
        public bool TermsAccepted { get; set; }
    }

    第4种方式:通过实现IValidatableObject接口,定义自验证model。还是Appointment类,如下:

    public class Appointment : IValidatableObject
    {
        public string ClientName { get; set; }

        [DataType(DataType.Date)]
        public DateTime Date { get; set; }

        public bool TermsAccepted { get; set; }

        public IEnumerable<ValidationResult> Validate(ValidationContext validationContext)
        {
            List<ValidationResult> errors = new List<ValidationResult>();
            if (string.IsNullOrEmpty(ClientName))
            {
                errors.Add(new ValidationResult("Please enter your name", new string[] { "ClientName" }));
            }
            if (DateTime.Now > Date)
            {
                errors.Add(new ValidationResult("Please enter a date in the future", new string[] { "Date" }));
            }
            if (errors.Count == 0 && ClientName == "Joe"
                && Date.DayOfWeek == DayOfWeek.Monday)
            {
                errors.Add(new ValidationResult("Joe cannot book appointments on Mondays"));
            }
            if (!TermsAccepted)
            {
                errors.Add(new ValidationResult("You must accept the terms", new string[] { "TermsAccepted" }));
            }
            return errors;
        }
    }

可以看到,它的核心不过是:将类对象验证内容移入到Valiate方法中。

 

      第5种方式,通过继承ModelValidationProvider,创建自定义ValidationProvider. 如下:

    public class CustomValidationProvider : ModelValidatorProvider
    {
        public override IEnumerable<ModelValidator> GetValidators(ModelMetadata metadata, ControllerContext context)
        {
            if (metadata.ContainerType == typeof(Appointment))
            {
                return new ModelValidator[] {
                    new AppointmentPropertyValidator(metadata, context)
                };
            }
            else if (metadata.ModelType == typeof(Appointment))
            {
                return new ModelValidator[] {
                    new AppointmentValidator(metadata, context)
                };
            }

            return Enumerable.Empty<ModelValidator>();
        }
    }

AppointmentPropertyValidator代码如下:

    public class AppointmentPropertyValidator : ModelValidator
    {
        public AppointmentPropertyValidator(ModelMetadata metadata, ControllerContext context)
            : base(metadata, context)
        {
        }

        public override IEnumerable<ModelValidationResult> Validate(object container)
        {
            Appointment appt = container as Appointment;
            if (appt != null)
            {
                switch (Metadata.PropertyName)
                {
                    case "ClientName":
                        if (string.IsNullOrEmpty(appt.ClientName))
                        {
                            return new ModelValidationResult[]
                                       {
                                           new ModelValidationResult
                                               {
                                                   //MemberName = "ClientName",
                                                   Message = "Please enter your name"
                                               }
                                       };
                        }
                        break;
                    case "Date":
                        if (appt.Date == null || DateTime.Now > appt.Date)
                        {
                            return new ModelValidationResult[]
                                       {
                                           new ModelValidationResult
                                               {
                                                   MemberName = "",
                                                   Message = "Please enter a date in the future"
                                               }
                                       };
                        }
                        break;
                    case "TermsAccepted":
                        if (!appt.TermsAccepted)
                        {
                            return new ModelValidationResult[]
                                       {
                                           new ModelValidationResult
                                               {
                                                   MemberName = "",
                                                   Message = "You must accept the terms"
                                               }
                                       };
                        }
                        break;
                }
            }
            return Enumerable.Empty<ModelValidationResult>();
        }
    }

 

注意,上文代码中MemberName不能填写,获取赋值为空,否则error提交到ModelState时,key值会重叠,比如ClientName会成为ClientName.ClientName。AppointmentValidator代码如下:

    public class AppointmentValidator : ModelValidator
    {
        public AppointmentValidator(ModelMetadata metadata, ControllerContext context)
            : base(metadata, context)
        {
        }

        public override IEnumerable<ModelValidationResult> Validate(object container)
        {
            Appointment appt = (Appointment)Metadata.Model;
            if (appt.ClientName == "Joe" && appt.Date.DayOfWeek == DayOfWeek.Monday)
            {
                return new ModelValidationResult[]
                                       {
                                           new ModelValidationResult
                                               {
                                                   MemberName = "",
                                                   Message = "Joe cannot book appointments on Mondays"
                                               }
                                       };
            }

            return Enumerable.Empty<ModelValidationResult>();
        }
    }

做完这些工作,然后就是注册启用CustomerValidationProvider了。在Application_Start中加入:

ModelValidatorProviders.Providers.Add(new CustomValidationProvider());

就完毕了。

      关于CustomerValidationProvider这种方式,作者建议仅用于复杂场合。如:需要从db中动态加载validation rule,或者实现自己的一些验证框架时才使用。这里有一个案例:http://www.codeproject.com/Articles/463900/Creating-a-custom-ModelValidatorProvider-in-ASP-NE 

 

 

      好吧,再看浏览器端的验证。

      第1步先启用客户端验证:

    <add key="ClientValidationEnabled" value="true"/>
    <add key="UnobtrusiveJavaScriptEnabled" value="true"/>

 或者在Application_Start中增加:

    HtmlHelper.ClientValidationEnabled = true;
    HtmlHelper.UnobtrusiveJavaScriptEnabled = true;

还有,view当中确保没有:

HtmlHelper.ClientValidationEnabled = false;

默认情况下,它是true。如果要禁用,上述3个区域任意一个设置为false即可。

      第2步,view中加载4个必须文件:

    <link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" />
    <script src="@Url.Content("~/Scripts/jquery-1.5.1.min.js")" type="text/javascript"></script>          

    <script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
    <script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>

      第3步,据说最简单的方式是利用meta data属性:

    [AppointmentValidator]
    public class Appointment
    {
        [Required(ErrorMessage = "Please enter your name")]
        [StringLength(10, MinimumLength = 3, ErrorMessage = "Please enter a string of whose length is between 3 and 10")]
        [EmailAddress]
        public string ClientName { get; set; }

        [DataType(DataType.Date)]
        [FutureDateValidator(ErrorMessage = "You must enter a date in the future")]
        public DateTime Date { get; set; }

        [MustBeTrue(ErrorMessage = "You must accept the terms")]
        public bool TermsAccepted { get; set; }
    }

其中EmailAddress是新实现的一个可供客户端验证用的metadata属性。如下: 

    public class EmailAddressAttribute : ValidationAttribute, IClientValidatable
    {
        private static readonly Regex emailRegex = new Regex(".+@.+\\..+");

        public EmailAddressAttribute()
        {
            ErrorMessage = "Enter a valid email address";
        }

        public override bool IsValid(object value)
        {
            return !string.IsNullOrEmpty((string) value) &&
                   emailRegex.IsMatch((string) value);
        }

        public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
        {
            return new List<ModelClientValidationRule>
                       {
                           new ModelClientValidationRule
                               {
                                   ValidationType = "email",
                                   ErrorMessage = this.ErrorMessage
                               },
                           //new ModelClientValidationRule
                           //    {
                           //        ValidationType = "required",
                           //        ErrorMessage = this.ErrorMessage
                           //    }
                       };
        }
    }

 它实现了一个IClientValidatable
接口,所以能够直接在客户端交互。

       关于它的实现原理,它不过是在server端将view上需要验证的全部信息都render并且隐藏在页面,然后基于jQuery的validation组件来交互。 看一下html片段:

<p>
         Your name: <input data-val="true" data-val-email="Enter a valid email address" data-val-length="Please enter a string of whose length is between 3 and 10" data-val-length-max="10" data-val-length-min="3" data-val-required="Please enter your name" id="ClientName" name="ClientName" type="text" value="" />            

        <span class="field-validation-valid" data-valmsg-for="ClientName" data-valmsg-replace="true"></span>   

    </p>

    <p>

        Appointment Date: <input class="text-box single-line" data-val="true" data-val-remote="&amp;#39;Date&amp;#39; is invalid." data-val-remote-additionalfields="*.Date" data-val-remote-url="/Appointment/ValidateDate" data-val-required="The Date field is required." id="Date" name="Date" type="text" value="2012/10/16" />

        <span class="field-validation-valid" data-valmsg-for="Date" data-valmsg-replace="true"></span>
    </p>

所以,在客户端,其实你可以脱离mvc框架自己来写。如:

$(document).ready(function () {
$('form').validate({
errorLabelContainer: '#validtionSummary',
wrapper: 'li',
rules: {
ClientName: {
required: true,
}
},
messages: {
ClientName: "Please enter your name"
}
});
});

同时,在view中render时,你也可以按照自己的方式来做。如将原有的ClientName显示方式换为:                    

    <p>               
         Your name: @Html.TextBoxFor(m => m.ClientName, new { data_val = "true",
data_val_email = "Enter a valid email address",
                                                data_val_required = "Please enter your name"})            
        @Html.ValidationMessageFor(m => m.ClientName)   
    </p>

 因为-在C#中是非法变量名字符,所以用_替代,同时asp.net mvc生成html时会将它替换为-。

 

       最后一个问题是,当客户端验证需要使用服务器端资源时,怎么办? 这时就要使用到Remote Validation了。首先,自然是得后端有一个ajax调用的action了:

        public JsonResult ValidateDate(string Date)
        {
            DateTime parsedDate;
            if (!DateTime.TryParse(Date, out parsedDate))
            {
                return Json("Please enter a valid date (mm/dd/yyyy)", JsonRequestBehavior.AllowGet);
            }
            else if (DateTime.Now > parsedDate)
            {
                return Json("Please enter a date in the future", JsonRequestBehavior.AllowGet);
            }
            else
            {
                return Json(true, JsonRequestBehavior.AllowGet);
            }
        }

然后,在Appointment类的Date属性上加个Remote特性:

        [DataType(DataType.Date)]
        //[FutureDateValidator(ErrorMessage = "You must enter a date in the future")]
        [Remote("ValidateDate", "Appointment")]
        public DateTime Date { get; set; }

至此,它就完成了。当你输入date结束后,就会调用ValidateDate(string Date)方法。 我在想,这里Appointment得是真正的ViewModel了,要不然就太别扭了。因为它实际上是调用了controller的action方法了。

 

全部源码download 

时间: 2024-09-08 09:44:19

Model Validation in Asp.net MVC的相关文章

ASP.NET MVC 模型绑定的 6 个建议

原文名称:6 Tips for ASP.NET MVC Model Binding 原文地址:http://odetocode.com/Blogs/scott/archive/2009/04/27/6-tips-for-asp-net-mvc-model-binding.aspx ASP.NETMVC中的Model Binding使用起来非常简单.你的Action方法需要数据,在传入的HTTP请求中携带着你需要的数据,数据可以在请求的表单数据中,还可能在你的URL地址本身中.通过DefaultM

ASP.NET MVC模型绑定的6个建议,徐汇区网站设计

ASP.NET MVC中的Model Binding使用起来非常简单.你的Action方法需要数据,在传入的HTTP请求中携带着你需要的数据,数据可以在请求的表单数据中,还可能在你的URL地址本身中.通过DefaultModelBinder,可以神奇地将表单中的数据和路由中的数据转换到对象中.Model Binder使得你的控制器代码可以干净地从请求以及关联的环境中分离出来. 这里有一些关于在MVC项目中更好使用Model Binding的建议. Tip#1:最好使用Model Binding而

一起谈.NET技术,ASP.NET MVC 2扩展点之Model Binder

Model Binder在Asp.net MVC中非常简单.简单的说就是你控制器中的Action方法需要参数数据:而这些参数数据包含在HTTP请求中,包括表单上的Value和URL中的参数等.而ModelBinder的功能就是将这些个表单上的Value和URL中的参数换成对象,然后将这些对象绑定到Action的参数上面.我简单的画了一个图,看起来会更加直观. 在asp.net mvc中你可以写类似下面这样的代码: [HttpPost]public ActionResult Create(){Bo

ASP.NET MVC 2扩展点之Model Binder

Model Binder在Asp.net MVC中非常简单.简单的说就是你控制器中的Action方法需要参数数据:而这些参数数据包含在HTTP请求中,包括表单上的Value和URL中的参数等.而ModelBinder的功能就是将这些个表单上的Value和URL中的参数换成对象,然后将这些对象绑定到Action的参数上面.我简单的画了一个图,看起来会更加直观. 在asp.net mvc中你可以写类似下面这样的代码: [HttpPost] public ActionResult Create() {

Unobtrusive JavaScript in ASP.NET MVC 3

Unobtrusive JavaScript 是什么?<!--以下是常规Javascript下写出来的Ajax--> <div id="test"> <a href="http://www.cnblogs.com/" onclick="Sys.Mvc.AsyncHyperlink.handleClick(this, new Sys.UI.DomEvent(event), { insertionMode: Sys.Mvc.Ins

ASP.NET MVC 3 概述

原文地址:http://www.asp.net/mvc/mvc3 导言 ASP.NET MVC3 在 ASP.NET MVC 1 和 2 的基础上,增加了大量的特性,使得代码更加简化,并且可以深度扩展.这篇文章提供包含在此次发布中的许多新特性的说明,分为以下部分: Razor 视图引擎 支持多视图引擎 Controller 改进 JavaScript 和 Ajax Model 验证的改进 依赖注入 Dependency Injection 的改进 其他新特性 Razor 视图引擎 ASP.NET

ASP.NET MVC 3 概述“.NET研究”

原文地址:http://www.asp.net/mvc/mvc3 导言 ASP.NET MVC3 在 ASP.NET MVC 1 和 2 的基础上,增加了大量的特性,使得代码更加简化,并且可以深度扩展.这篇文章提供包含在此次发布中的许多新特性的说明,分为以下部分: Razor 视图引擎 支持多视图引擎 Controller 改进 JavaScript 和 Ajax Model 验证的改进 依赖注入 Dependency Injection 的改进 其他新特性 Razor 视图引擎 ASP.NET

一起谈.NET技术,Unobtrusive JavaScript in ASP.NET MVC 3

Unobtrusive JavaScript 是什么? <!--以下是常规Javascript下写出来的Ajax--><div id="test"><a href="http://www.cnblogs.com/" onclick="Sys.Mvc.AsyncHyperlink.handleClick(this, new Sys.UI.DomEvent(event), { insertionMode: Sys.Mvc.Inse

一起谈.NET技术,ASP.NET MVC 3 概述

原文地址:http://www.asp.net/mvc/mvc3 导言 ASP.NET MVC3 在 ASP.NET MVC 1 和 2 的基础上,增加了大量的特性,使得代码更加简化,并且可以深度扩展.这篇文章提供包含在此次发布中的许多新特性的说明,分为以下部分: Razor 视图引擎 支持多视图引擎 Controller 改进 JavaScript 和 Ajax Model 验证的改进 依赖注入 Dependency Injection 的改进 其他新特性 Razor 视图引擎 ASP.NET