MVC学习笔记之：ASP.NET MVC的客户端验证-jQuery.validate验证结合Model验证中的实现

关于JQuery.validate客户端验证，可以在网上找找资料， Jquery Validate客户端验证

jQuery验证控件jquery.validate.js使用说明+中文API

结合ASP.NET MVC中的运用，可以看蒋金楠大牛的博客，写的很系统，ASP.NET MVC的客户端验证：jQuery的验证.以及他相关的博客，写的非常好。

下面是我个人结合自己项目中的笔记：

Model的定义：

 
public class UserInfo
{
        [Required]
        [StringLength(20, ErrorMessage = "UserName can not more than 20 chars")]
        public string UserName { get; set; }
        [Required]
        [StringLength(200)]
        public string Password { get; set; }
}

View中的代码：

@model XXX.Model.User.UserInfo

                            

                                Username
                            
                            @Html.TextBoxFor(m => m.UserName)
                            

                            @Html.ValidationMessageFor(m => m.UserName)

                        
                        

                            

                                Password
                            
                            @Html.PasswordFor(m => m.Password)
                            

                            @Html.ValidationMessageFor(m => m.Password)
                        

生成的Html代码：

 

                            

                                Username
                            
                            
                            

                            

                        
                        

                            

                                Password
                            
                            
                            

                            
                        

如果看过jquery.validate相关的文档，你可能会疑惑，jquery.validate一般都是把验证规则定义在css样式中，更规范的写法，独立写js，和html脱离开来。

<input class="required"  id="name" name="name" type="text"/>

or

我们发现，在Model中设置了[Required]等特性，在前台不写一行js验证的代码，客户端已经实现了验证；后台只要调用一行代码ModelState.IsValid，就实现了服务器端的验证，是不是有web form中Page.IsValid的感觉，不用写验证的代码，是不是很爽？

if (ModelState.IsValid)
                {
                    LoginResponse response = eServiceProxy.serviceProxy.Login(request);
                    if (response != null && response.IsAuthenticated)
                    {
                        FormsAuthentication.SetAuthCookie(request.Username, true);
                        return RedirectToAction("Index", "Home");
                    }
                    else
                    {
                        ViewData["errorMsg"] = "Login Fail";
                    }
                }

可是，有没有很好奇，MVC生成的html中，没有定义规则的class,也没有生成相关的js来定义rules.甚至连调用验证的validate()方法都没有，它是如何触发验证的呢？