首先建一个空的解决方案 然后建 Visual C# / Web / ASP.NET MVC 4 Web 应用程序
然后在 MVC 的 Models 文件夹里 建一个类 例如 UserInfo
引用命名空间
using System.ComponentModel;
using System.ComponentModel.DataAnnotations;
类里面代码：
[DisplayName("用户名"), Required(ErrorMessage = "用户名非空"),
StringLength(int.MaxValue, MinimumLength = 2, ErrorMessage = "用户名必须大于2")]
[System.Web.Mvc.Remote("CheckUserName", "Test01", HttpMethod = "post", ErrorMessage = "用户名已存在")]
public string UserName { get; set; }
[DisplayName("密码"), StringLength(int.MaxValue, MinimumLength = 6, ErrorMessage = "密码必须大于6")]
public string Password { get; set; }
[DisplayName("再次输入密码"), Compare("Password", ErrorMessage = "确认密码与原始密码不一致")]
public string ConfirmPassword { get; set; }
[DisplayName("年龄"), Range(1, 120, ErrorMessage = "年龄必须在1到120岁之间")]
public int Age { get; set; }
[DisplayName("邮箱"), RegularExpression(@"^\[email protected]\w+.\w+$", ErrorMessage = "Emial不合法")]
//[EmailAddress]
public string Email { get; set; }
建一个控制器 并在 Action里添加一个刚建的 UserInfo 类的强类型视图
视图中 嵌入 3 个引用
<link href="~/Content/Site.css" rel="stylesheet" />
<script src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
创建表格
<div>
<form action="/Test01/Add" method="post">
@Html.DisplayNameFor(c => c.UserName)
@Html.TextBoxFor(c => c.UserName)
@Html.ValidationMessageFor(c => c.UserName)
<br />
@Html.DisplayNameFor(c => c.Password)
@Html.PasswordFor(c => c.Password)
@Html.ValidationMessageFor(c => c.Password)
<br />
@Html.DisplayNameFor(c => c.ConfirmPassword)
@Html.PasswordFor(c => c.ConfirmPassword)
@Html.ValidationMessageFor(c => c.ConfirmPassword)
<br />
@Html.DisplayNameFor(c => c.Age)
@Html.TextBoxFor(c => c.Age)
@Html.ValidationMessageFor(c => c.Age)
<br />
@Html.DisplayNameFor(c => c.Email)
@Html.TextBoxFor(c => c.Email)
@Html.ValidationMessageFor(c => c.Email)
<br />
<input type="submit" value="注册" />
</form>
</div>
如何判断用户名已经存在 例如 张三
再在这个控制器里建在建一个Action 特别注意：此处建的Action 必须按照前面实体类里面的
[System.Web.Mvc.Remote("CheckUserName", "Test01", HttpMethod = "post", ErrorMessage = "用户名已存在")]
否则没用
里面代码：
string name = Request.Form["UserName"];
if (name == "张三")
{
return Content("false");
}
return Content("true");
1、模型注解，用来检查表单中元素的合法性，效果类似于前面学过的 formvalidate.js插件
命名空间： using System.ComponentModel; 下面存储了
1、DisplayName():标记属性要显示的名称 配合视图上面的 @Html.DisplayNameFor(c=>c.属性名称)来显示
命名空间： using System.ComponentModel.DataAnnotations; 下面存储了
1、Required ：用来做非空验证检查,特点：在非字符串类型属性上会自动加上 Required 特性标签,如果是字符串类型必须手动添加
2、StringLength ：用来检查字符串类型的属性的长度验证
3、Range：用来检查数值(int,decimal,double,float)类型的属性的范围验证
4、Compare：用来比较两个属性的值是否一致,一般用于确认密码属性上
5、[RegularExpression("\\d+", ErrorMessage="年龄必须是一个数值")]：约束此属性的值必须是一个数值
命名空间： using System.ComponentModel.DataAnnotations; 下面存储了
1、Remote("请求的action名称","控制器名称",HttpMethod = "post/get(一般推荐使用post请求来防止ajax的缓存)",ErrorMessage = "提示文本")：会发出一个ajax请求到某个控制器中的某个 action进行检查操作，如果存在则返回字符串的 false (注意不能使用大写的False，如果使用了则不能正常调用)
表示此值已经存在不能再使用，否则返回true(注意不能使用大写的True，如果使用了则不能正常调用) 表示可以使用
[System.Web.Mvc.Remote("CheckUserName" //代表的是请求的action名称
,"Home" //代表控制器名称
,HttpMethod="post" //表示发出post的ajax异步请求，主要是为了防止ajax请求的缓存，如果使用get可能出现结果不准确
,ErrorMessage="此值已经被使用，请重新跟换") //表示如果服务器返回的是false字符串，则提醒用户
]
使用Required 进行页面元素的合法性验证步骤:
1、在实体属性上打上[Required(ErrorMessage="Name属性非空")]
2、在视图页面上 利用@Html.TextBoxFor(c=>c.Name) ：用来生产文本框，同时给文本框架加上 data-val="true" data-val-*......
3、在视图页面上 利用@Html.ValidationMessageFor(c=>c.Name) 用来显示提示文本的
4、引用三个js脚本
<script src="~/Scripts/jquery-1.7.1.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
5、注意：元素必须放到表单中 <form> 标签才能起验证作用
6、检查MVC网站跟目录下面的web.config中的<appSettings>节点中的两个节点
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
的值必须为true，才能骑验证作用，否则任何一个关闭都不起作用
什么叫做非嵌入式脚本（非侵入式脚本）~/Scripts/jquery.validate.unobtrusive.js
没有在视图上写一个验证的代码就完成表单元素的验证功能，仅仅只是利用了相关的脚本来完成，这个就叫做非嵌入式