在mvc中使用表单进行数据提交时,数据验证分为服务器端验证和客户端验证;

我们可以通过使用HtmlHelper中的方法及在页面中引用js库对Model的属性的数据注解(System.ComponentModel.DataAnnotations命名空间下的一组类)进行解析,实现前端、后端的数据验证;

HtmlHelper、数据注解在其他文章中再详细介绍,本文主要介绍如何使数据验证发生作用。

下面分别介绍两种验证方式:

一、服务器端验证

要实现服务器端的验证非常简单,只需要满足下面三个条件:

①有数据注解

②页面部分使用HtmlHelper生成各种表单元素

使用这些html标签的时候,需要引用一下mvc工程中的css文件:

<link href="~/Content/Site.css" rel="stylesheet" />

③在后端代码中指明需要验证

但是只有服务器端的验证不能满足我们,因为每一次的错误数据都会提交到服务器,不仅影响了性能,用户体验也差强人意。

二、客户端验证

客户端验证是通过jquery validate插件进行数据验证的,它需要有jquery的支持,因此在引用它之前必须引用jquery文件。

但jquery validate是需要在js中编写相关代码(如下图),才能实现数据验证的;

但这样子也是挺麻烦的,我们在属性写的数据注解岂不是没什么卵用了,不用担心,只要我们引用一下mvc工程中的 jquery.validate.unobtrusive.js 就可以啦。

利用mvc的HtmlHelper中类似Html.EditorFor(m => m.Name)这样的语法,生成的代码如下:

<input class="text-box single-line" data-val="true" data-val-required="请输入用户名!" id="Name" name="Name" type="text" value="">

这样子,引用的js库就可以解析以data-val-为前缀的属性用来设置验证规则了。data-val="true"表示对用户输入的值进行验证。

如果上面的js库你都引用了,但客户端的验证还是没有起效,那就检查一下配置文件吧。在配置文件中,有两个选项是需要配置为true的,建立mvc应用程序的时候,默认是已经添加了的。

第一行表示启用客户端验证;

第二行表示启用unobtrusive相关的js验证,在使用AjaxHelper,引用jquery.unobtrusive-ajax.js时,也需要该配置为true;

综上所述,客户端的验证需要满足以下几个条件:

①有数据注解

②页面部分使用HtmlHelper生成各种表单元素

③引用相关js文件,如下图:

④配置web.config(默认存在)

三、总结

在实际开发中,基本都是客户端验证+服务器端验证一起使用的;

也有的验证可能还是需要在js中实现,那么在进行后端验证时,就不能只以ModelState.IsValid为参考了,还需要写额外代码验证;如果有错误的时候,可以使用ModelState.AddModelError("key", "errorMesaage");//第一个参数是key,第二个参数是要显示的错误消息

在页面中展示后台的错误消息的时候,有两种方式:

①Html.ValidationSummary(true)

ValidationSummary有几种重载形式:

重载形式

说明

Html.ValidationSummary()

汇总显示所有的验证错误

Html.ValidationSummary(bool)

如果bool参数=true,只显示Model层次的错误,否则所有的验证错误都显示

Html.ValidationSummary(string)

在所有错误消息之前再显示string给出的字符串

Html.ValidationSummary(bool, string)

同Html.ValidationSummary(bool),只是在错误消息前多显示string给出的字符串

在页面数据提交到后台时,表明属性的数据注解验证已经通过了,因此前端显示错误消息的时候只会显示 ModelState.AddModelError()方法中的错误消息;

在页面中会生成如下图所示的div:

ValidationSummary方法会展示所有的错误消息,而不会根据key值显示特定的消息;主要用来汇总显示从后台返回的错误消息列表。

②Html.ValidationMessage(key)

该方法会根据ModelState.AddModelError("key", "errorMesaage")里的key值显示对应的错误消息;

它在前端生成的是一个span标签;

不过通常不会使用该方法,而是使用Html.ValidationMessageFor(c => c.Name)显示属性的数据注解的错误消息;

mvc中服务器端、客户端属性验证的更多相关文章

  1. mvc中常见的属性验证

    客户端验证逻辑会对用户向表单输入的数据给出一个即时反馈.而之所以需要服务器端验证,是因为来自网络的信息都是不能被信任的. 当在ASP.NET MVC设计模式上下文中谈论验证时,主要关注的是验证模型的值 ...

  2. MVC中获取模型属性的Range和StringLength验证特性设置

    MVC中的客户端及服务端模型验证信息都以ModelMetadata类型作为承载,在获得属性的ModelMetadata之后(还不知道怎么获取ModelMetadata的童鞋请自行恶补),我们可以轻松得 ...

  3. mvc中使用remote属性来做ajax验证

    mvc中使用remote属性来做ajax验证比較easy : [Remote("Action", "Controller", AdditionalFields ...

  4. MVC系列学习(十一)-客户端的验证

    1.通过一个实例,来了解MVC中强大的验证功能 1.1新建一个 [基本] 的mvc项目,因为要用到验证的js,然后在一个视图中写上一下代码,以及Model中的代码如下 [注]在调用html.EditF ...

  5. 关于MVC中模型model的验证问题

    今天在做项目练习的时候发现,MVC中使用自带的模型验证时会提前显示在界面上,比如下面所示: 这是什么原因了,是因为我在表示get请求的action里面返回了其界面所显示使用的model,我们知道mvc ...

  6. MVC中”从客户端检测到有潜在危险的Request.Form值“的解决方法

    从客户端检测到有潜在危险的Request.Form值: 在webForm中,可以在aspx页面顶部 <%@ Page Language="C#" AutoEventWireu ...

  7. 在ASP.NET MVC中对手机号码的验证

    在ASP.NET MVC中,可以使用RegularExpression特性来验证手机号码. public class Customer { [Required(ErrorMessage = " ...

  8. 【Azure API 管理】在APIM中使用客户端证书验证API的请求,但是一直提示错误"No client certificate received."

    API 管理 (APIM) 是一种为现有后端服务创建一致且现代化的 API 网关的方法. 问题描述 在设置了APIM客户端证书,用户保护后端API,让请求更安全. 但是,最近发现使用客户端证书的API ...

  9. Asp .Net MVC中常用过滤属性类

    /// <summary> /// /// </summary> public class AjaxOnlyAttribute : ActionFilterAttribute ...

随机推荐

  1. Lua 学习笔记(七)编译、执行外部代码块

    Lua称为解释型语言的原因:Lua允许在运行源代码之前,先将源代码预编译为一种中间形式.区别解释型语言的主要特征是在于编译器是否是语言运行时库的一部分,即有能力执行动态生成的代码.因为Lua中有dof ...

  2. 浅析Openflow

    这应该算是我在博客园的第一篇技术性的文章. OH,不,这不是一篇技术性的文章,只是一篇很好玩的浅显分析接触到的技术的文章.只是个人的理解,并没有任何的代码和执行的操作.初次带来的,是从08年开始火起来 ...

  3. 前端自动化构建工具gulp的使用总结

    前端自动化构建工具gulp的使用总结 博主最近偶的空闲,在此对gulp的使用做一个总结,让小伙伴知道如何合理的使用gulp以及gulp的使用技巧. 谈到gulp,有人可能就会想到另外一个构建工具gru ...

  4. DOMContentLoaded实现

    IE系列直到IE9才支持DOMContentLoaded事件,对于IE8及其之前版本,如果html内没有框架,则可以采用document.documentELement.doScroll来判断 是否构 ...

  5. 使用PL/SQL工具比对表结构,同步表结构

    需求:Oracle数据库,B库和C库,某些表的表结构不一致,现在要求以C库为标准,同步更新B库表结构PL/SQL 连接到C库, Tools --> Compare User Objects .. ...

  6. 六、CsrfViewMiddleware

    CSRF(Cross-site request forgery),中文名称:跨站请求伪造,也被称为:one click attack/session riding,缩写为:CSRF/XSRF. 你这可 ...

  7. C# 文件下载 : WebClient

    最近更新了一个下载小工具,主要提升了下面几点: 1. 在一些分公司的局域网中,连接不上外网 2. 服务器上的文件更新后,下载到的还是更新前的文件 3. 没有下载进度提示 4. 不能终止下载 下面和大家 ...

  8. [.NET逆向] .net IL 指令速查(net破解必备)

    .net的破解比较特殊,很多人看见IL就头疼,最近在研究的时候发现了这个东东 相信对广大学习net破解的人一定有帮助 .对上指令表一查,跟读原代码没什么区别了, 名称 说明 Add 将两个值相加并将结 ...

  9. svn中cleanup作用

    我们开发项目的时候,用版本控制软件svn提交项目时候难免会遇到cleanup,那么这个提示是怎么产生的呢?它有什么作用呢? 产生原因:SVN 本地更新时,由于一些操作中断更新,如磁盘空间不够,用户取消 ...

  10. 【转】zigbee协议的多种profile