一、概述
MVC分为ViewModel、Control、View,对数据的封装MVC做的很好,确实是不错的WEB框架,针对MVC的ViewModel封装的也是相当的不错,最近做一个MVC的项目,采用的框架MVC4+JQuery+JQueryUI。由于开发需要,也特别研究了一下MVC中的ViewMode的数据校验,觉得MVC这种模式真的真赞,现总结一下ViewModel的使用方式;
二、ViewModel基础特性
基本特性的命名空间位于: System.ComponentModel.DataAnnotations 和 System.Web.Mvc;
1、Required
说明:必填项,当提交数据该缺少的时候,就会引发异常;
举例:[Required]
2、StringLength
说明:指定运行的长度,指定最大长度、最小长度以及错误消息
举例:[StringLength(30, ErrorMessage = "{0}长度必须在{2}至{1}个字符间", MinimumLength = 6)]
3、RegularExpression
说明:正则表达式匹配,匹配失败引发异常;
举例:[RegularExpression("^[A-Za-z0-9_]+$",ErrorMessage="密码必须是字母、数字或下划线")]
4、Range
说明:数据大小范围,一般为数字类型属性;
举例:[Range(35,44,ErrorMessage="数据不能小于35也不能大于44")] //整型,最小35,最大44
5、Remote
说明:数据远程校验,Ajax数据请求
举例:[Remote("CheckUserExits", "SysAdmin", ErrorMessage = "该账号已存在")]
6、Compare
说明:匹配两个数据,内容不一致则引发错误
举例:[Compare("Password",ErrorMessage="新密码和确认密码不一致")]
7、Display
说明:现实属性名称
举例:[Display(Name="确认密码")]
三、使用说明
MVC数据校验分为2种方式,客户端校验和后台校验,使用的时候,需要配置webconfig文件;
1、配置web config
<add key="ClientValidationEnabled" value="true"/> <add key="UnobtrusiveJavaScriptEnabled" value="true"/>
2、引用前台客户端JS验证还需在页面配置
2.1、引入JS和CSS文件
<link href="@Url.Content("~/Content/Site.css")" rel="stylesheet" type="text/css" /> <script src="http://www.cnblogs.com/Scripts/jquery-1.7.2.min.js" type="text/javascript"></script> <script src="http://www.cnblogs.com/Scripts/jquery.validate.min.js" type="text/javascript"></script> <script src="http://www.cnblogs.com/Scripts/jquery.validate.unobtrusive.min.js" type="text/javascript"></script>
2.2、页面添加:
@{
Html.EnableClientValidation();
}
2.3、页面Form窗体展示不能使用<form>....</form>,而是采用Html.BeginForm的方式进行
@using (Html.BeginForm()) { <td align="right">@Html.LabelFor(model => model.AdminCode)</td> <td>@Html.TextBoxFor(model => model.AdminCode, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.AdminCode)</td> }
另外有时候默认的样式,存在site.css不是我们需要的样式 ,我们可以效果默认样式,或者添加自定义Class;
四、使用举例
1、ViewModel代码块
public class AdminCreateViewModel:BaseViewModel { [Required] [Display(Name="账号")] [StringLength(15,ErrorMessage="{0}长度在{2}至{1}个字符间",MinimumLength=5)] [Remote("CheckUserExits", "SysAdmin", ErrorMessage = "该账号已存在")] public string AdminCode { get; set; } [Required] [DataType(DataType.Password)] [StringLength(30, ErrorMessage = "{0}长度必须在{2}至{1}个字符间", MinimumLength = 6)] [RegularExpression("^[A-Za-z0-9_]+$",ErrorMessage="密码必须是字母、数字或下划线")] [Display(Name="新密码")] public string Password { get; set; } [Display(Name="确认密码")] [DataType(DataType.Password)] [Compare("Password",ErrorMessage="新密码和确认密码不一致")] public string ConfirmPassword { get; set; } [Required] [Display(Name = "级别")] public string PowerCode { get; set; } //管理员姓名 [Required] [RegularExpression(@"^(\w|[\u4e00-\u9fa5])*$", ErrorMessage = "输入数据无效")] [Display(Name = "姓名")] public string Name { get; set; } //管理员电话 [DataType(DataType.PhoneNumber)] [RegularExpression(@"(^(13[0-9]{9})|(15[89][0-9]{8})$)|(^(\s*)$)",ErrorMessage="电话号码格式不正确")] [Display(Name = "电话")] public string PhoneNo { get; set; } //管理员Email [Display(Name="邮箱")] [DataType(DataType.EmailAddress)] [RegularExpression(@"(\w*@\w*)|(^(\s*?)$)", ErrorMessage = "邮箱格式不正确")] public string Email { get; set; } //管理员所属单位 [Display(Name = "单位")] [RegularExpression(@"(^(\w|[\u4e00-\u9fa5])*$)|(^(\s*)$)", ErrorMessage = "输入数据无效")] public string Comp { get; set; } //管理员所属部门 [Display(Name = "部门")] [RegularExpression(@"(^(\w|[\u4e00-\u9fa5])*$)|(^(\s*)$)", ErrorMessage = "输入数据无效")] public string Dep { get; set; } //管理员所属职位 [Display(Name = "职位")] [RegularExpression(@"(^(\w|[\u4e00-\u9fa5])*$)|(^(\s*)$)", ErrorMessage = "输入数据无效")] public string JobPost { get; set; } //管理员状态 public bool Disable { get; set; } }
2、View代码块
@model WebMgr.Models.AdminCreateViewModel @{ ViewBag.Title = "Create"; Layout = "~/Views/Shared/_Layout.cshtml"; Html.EnableClientValidation(); } <div align="center"> <div class="manager-daohang"> <div class="manager-daohang-04">@Html.ActionLink("管理员列表","Index","SysAdmin")</div> <div class="manager-daohang-03">添加管理员</div> </div> <div> @using (Html.BeginForm()) { <input type="hidden" name="Disable" value="true"/> <table width="100%" border="0" cellpadding="10" cellspacing="1" class="manager-Table-01"> <tr> <td align="right" width="250"> </td> <td width="220"> </td> <td> </td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.AdminCode)</td> <td>@Html.TextBoxFor(model => model.AdminCode, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.AdminCode)</td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.Password)</td> <td>@Html.PasswordFor(model => model.Password, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.Password)</td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.Password)</td> <td>@Html.PasswordFor(model => model.ConfirmPassword, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.ConfirmPassword)</td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.PowerCode)</td> <td> <select name="PowerCode" class="manager-from02" id="PowerCode"> <option selected="selected">选择管理员级别</option> <option value="AD5235864">超级管理员</option> <option value="AD8456212">一级管理员</option> <option value="AD5235864">二级管理员</option> </select> </td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.Name)</td> <td>@Html.TextBoxFor(model => model.Name, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.Name)</td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.Comp)</td> <td>@Html.TextBoxFor(model => model.Comp, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.Comp)</td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.Dep)</td> <td>@Html.TextBoxFor(model => model.Dep, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.Dep)</td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.JobPost)</td> <td>@Html.TextBoxFor(model => model.JobPost, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.JobPost)</td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.PhoneNo)</td> <td>@Html.TextBoxFor(model => model.PhoneNo, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.PhoneNo)</td> </tr> <tr> <td align="right">@Html.LabelFor(model => model.Email)</td> <td>@Html.TextBoxFor(model => model.Email, new { @class = "manager-from02" })</td> <td>@Html.ValidationMessageFor(Model => Model.Email)</td> </tr> <tr> <td> </td> <td><input name="button" type="submit" class="manager-from03" id="button" value="确认添加"></td> <td> </td> </tr> <tr> <td> </td> <td> </td> <td> </td> </tr> </table> } </div> </div> @section scripts { @Scripts.Render("~/bundles/jqueryval") }
参考文章:
1、MVC验证 http://www.cnblogs.com/kissdodog/archive/2013/05/04/3060278.html
2、MVC验证:http://blog.csdn.net/wanglei_samrtfish/article/details/6862770