ASP.NET MVC5之客户端验证的示例分析

这篇文章主要为大家展示了"ASP.NET MVC5之客户端验证的示例分析"，内容简而易懂，条理清晰，希望能够帮助大家解决疑惑，下面让小编带领大家一起研究并学习一下"ASP.NET MVC5之客户端验证的示例分析"这篇文章吧。

客户端的验证，使用Jquery和Jquery插件来实现【jquery.validate.min.js and jquery.validate.unobtrusive.min.js) 】

在服务端验证中，页面必须要提交到服务器，进行验证，如果数据验证不通过，服务器端就会发送一个响应到客户端，然后客户端根据相应的信息，进行处理；而客户端验证则不同，用户输入的数据，只要一提交，客户端就会进行先验证，如果不通过就报错，不会提交到服务器进行验证，如果通过了，才会把请求传到服务器端。

如果你是使用VS2012以上的版本，那么会自带的启用了客户端验证的：【当然你也可以手动添加下面的配置。】

我们还是之前的项目：

using System;using System.Collections.Generic;using System.ComponentModel.DataAnnotations;using System.Linq;using System.Web;namespace Server_Side_Validation_IN_MVC.Models{  public class StudentServer  {    [Required(ErrorMessage="Name为必填项")]    public string Name { get; set; }    [Required(ErrorMessage="电子邮件必须")]    [EmailAddress(ErrorMessage="电子邮件格式不对")]    public string Email { get; set; }  }}

public ActionResult SeverSideIndex()    {      return View();    }    [HttpPost]    public ActionResult SeverSideIndex(StudentServer model)    {      if (ModelState.IsValid)      {        ViewBag.Name = model.Name;        ViewBag.Email = model.Email;      }      return View();    }

不同的是，这里，我添加视图，不一样：

注意这里一定要勾选引用脚本库，也就是引入Jquery和Jquery插件，这样才能进行客户端验证：
修改一下默认路由：

 public static void RegisterRoutes(RouteCollection routes)    {      routes.IgnoreRoute("{resource}.axd/{*pathInfo}");      routes.MapRoute(        name: "Default",        url: "{controller}/{action}/{id}",        defaults: new { controller = "Student", action = "SeverSideIndex", id = UrlParameter.Optional }      );    }

运行项目：

我们在控制器的POST方法中添加一个断点

直接点击按钮：没有调用POST方法，直接在客户端验证了数据的合法性。

输入合法的数据：

断点触发了，也就是说，在客户端验证通过之后，才会提交到服务器进行进一步处理。

好了，这就是客户端验证，比较简单。但注意要引入Jquery插件

以上是"ASP.NET MVC5之客户端验证的示例分析"这篇文章的所有内容，感谢各位的阅读！相信大家都有了一定的了解，希望分享的内容对大家有所帮助，如果还想学习更多知识，欢迎关注行业资讯频道！