实现表单输入数据的验证,包括客户端验证和服务器端验证

如何使用

数据验证在业务层的实体类字段上增加数据验证的特性,例如
    public class User
{
[Required(ErrorMessage = "请输入姓名")]
public string Name { get; set; }
}
常用的数据验证方式
Required:必填

DataTypeValidator: 数据类型验证(url、qq、电话、邮编、身份证、数值等)
StringLength: 字符串长度验证
RegularExpression:自定义正则表达式验证
Range:数值范围验证
Remote:请求服务器端验证
Compare:比较2个输入项是否一致
ClientCustom:自定义js函数验证,自定义函数返回校验是否通过(true/false),函数中用this获得当前校验的html元素,如
服务器端:
[ClientCustom("isnull", ErrorMessage = "Email不能为空")]
public string Email { get; set; }
JS函数:
function isnull() {
  return $(this).val() == "";
}

以上验证方式中DataTypeValidator和ClientCustom是SRF扩展的方式,其它为mvc自带的验证方式,mvc还有更多的验证方式,这里不一一列举。

 

如何实现

1、自定义验证方式
自定义验证要继承System.ComponentModel.DataAnnotations.ValidationAttribute,其中IsValid()函数实现服务器端验证返回验证是否通过,
客户端验证要实现System.Web.Mvc.IClientValidatable接口,
GetClientValidationRules()返回ModelClientValidationRule集合(包含验证类型、参数、错误提示信息)

        public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
{
var rule = new ModelClientValidationRule();
rule.ErrorMessage = base.ErrorMessage;
rule.ValidationParameters["pattern"] = this.pattern;
rule.ValidationType = "regex";
return new[] { rule };
}

在浏览器的html也将生成
 <input data-val="true" data-val-regex="错误提示信息" data-val-regex-pattern="pattern的值" type="text" value="" />
jquery.validate.unobtrusive.js将对根据data-val-regex和data-val-regex-pattern这2个属性做正则表达式的验证

如果要自定义客户端的验证方式,以ClientCustom为例,由于ClientCustom验证方式生成的data-val-custom和data-val-custom-func这中验证方式默认并不支持,所以要在jquery.validate.unobtrusive.js新增adapter,代码如下:

//扩展 zengyy(用自定义函数校验)
adapters.add("custom", ["func"], function (options) {
var value = options.params.func;
setValidationValues(options, "custom", value);
});
//扩展 zengyy(用自定义函数校验)
$jQval.addMethod("custom", function (value, element, params) {
if (params != undefined && params != "") {
var func = window[params];
if (func != undefined && typeof func == "function") {
return func.call(element, element);
} else {
return false;
}
} else {
return true;
}
});

2、验证结果的显示
验证不通过时 mvc3默认是在后边显示提示信息,但这样可能会引起页面布局的改变影响美观,所以改为在输入框的上边以tip的方式显示提示
这种显示方式用到jquery-tipsy这个jQ插件来实现,并修改jquery.validate.unobtrusive.js里边onError()函数的脚本

if (Global && Global.errorShowMode == "tip") { //zengyy:校验错误在上方浮动显示提示 需要用到 jquery.tipsy.cs
if (error.html() != "" && $.isFunction(inputElement.tipsy)) {
inputElement.attr("original-title", error.html());
inputElement.tipsy({ gravity: 's' });
}
else {
inputElement.attr("original-title", "");
}
}

SRF之数据验证的更多相关文章

  1. 我这么玩Web Api(二):数据验证,全局数据验证与单元测试

    目录 一.模型状态 - ModelState 二.数据注解 - Data Annotations 三.自定义数据注解 四.全局数据验证 五.单元测试   一.模型状态 - ModelState 我理解 ...

  2. MVC 数据验证

    MVC 数据验证 前一篇说了MVC数据验证的例子,这次来详细说说各种各样的验证注解.System.ComponentModel.DataAnnotations 一.基础特性 一.Required 必填 ...

  3. kpvalidate开辟验证组件,通用Java Web请求服务器端数据验证组件

    小菜利用工作之余编写了一款Java小插件,主要是用来验证Web请求的数据,是在服务器端进行验证,不是简单的浏览器端验证. 小菜编写的仅仅是一款非常初级的组件而已,但小菜为它写了详细的说明文档. 简单介 ...

  4. MVC3 数据验证用法之密码验证设计思路

    描述:MVC数据验证使用小结 内容:display,Required,stringLength,Remote,compare,RegularExpression 本人最近在公司用mvc做了一个修改密码 ...

  5. jQuery MiniUI开发系列之:数据验证

    在开发应用系统界面时,往往需要进行很多.复杂的数据验证,当填写的数据符合规定,才能提交保存. jQuery MiniUI提供了比较完美的表单数据验证和错误显示的方式. 常见的表单控件,都有一个验证事件 ...

  6. AngularJS快速入门指南14:数据验证

    thead>tr>th, table.reference>tbody>tr>th, table.reference>tfoot>tr>th, table ...

  7. atitit.数据验证--db数据库数据验证约束

    atitit.数据验证--db数据库数据验证约束 1. 为了加强账户数据金额的安全性,需要增加验证字段..1 2. 创建帐户1 3. 更改账户2 4. ---code3 5. --fini4 1. 为 ...

  8. MVC数据验证原理及自定义ModelValidatorProvider实现无编译修改验证规则和错误信息

    Asp.net MVC中的提供非常简单易用的数据验证解决方案. 通过System.ComponentModel.DataAnnotations提供的很多的验证规则(Required, StringLe ...

  9. MVC 数据验证[转]

    前一篇说了MVC数据验证的例子,这次来详细说说各种各样的验证注解. 一.基础特性 一.Required 必填选项,当提交的表单缺少该值就引发验证错误. 二.StringLength 指定允许的长度 指 ...

随机推荐

  1. 使用kendoui对grid指定行变色

    关键点在于绑定数据源后进行判断,可直接获取当前绑定对象的属性 dataBound: function () { dataView = this.dataSource.view(); ; i < ...

  2. 记录特殊情况的Python脚本的内存异常与处理

    问题 Python 脚本使用 requests 模块做 HTTP 请求,验证代理 IP 的可用性,速度等. 设定 HTTP 请求的 connect timeout 与 read response ti ...

  3. 剖析Disruptor:为什么会这么快?(二)神奇的缓存行填充

    原文链接:http://mechanitis.blogspot.com/2011/07/dissecting-disruptor-why-its-so-fast_22.html 需FQ 计算机入门   ...

  4. noip2008 火柴棒等式

    P1149 火柴棒等式 1.9K通过 3.7K提交 题目提供者该用户不存在 标签搜索/枚举模拟2008NOIp提高组 难度普及- 提交该题 讨论 题解 记录   题目描述 给你n根火柴棍,你可以拼出多 ...

  5. HTML5-新API选择器

    新的选择器document.querySelector("selector");selector:根据CSS选择器返回第一个匹配到的元素,如果没有匹配到,则返回null;支持: C ...

  6. 使用ffmpeg快速生成视频截图

    1 ffmpeg -i input.mkv -ss 00:10:00 -f image2 output.jpg 但是这个命令会花费相当长的时间. 对一个清晰的或者较大的视频文件进行操作, 会花费半分钟 ...

  7. 第九周java学习总结

    20145306<java程序设计>第九周学习总结 教材学习内容总结 第十六章 一.JDBC入门 1.JDBC简介 JDBC是用于执行SQL的解决方案,开发人员使用JDBC的标准接口,数据 ...

  8. 中间人攻击破解HTTPS传输内容

    最近App安全受到不小的關注,有人問我,說某某App不安全,究竟是真的還假的啊...所謂有被攻擊的風險,是不是危言聳聽,只是為了嚇人來著的? 現在就來為各位說明一下,是怎麼個不安全法.就來說說攻擊是怎 ...

  9. PHP 按二维数组的键值排序

    /** * 按二维数组的键值排序 * @param unknown $array 二维数组 * @param unknown $key 二维数组的键值 * @param string $order 升 ...

  10. css style与class之间的区别,cssclass

    问题描述:    网页点击[导出]按钮后,将页面table内容另存成excel文件,却发现无法保存表格样式 分析过程: 1.table表格用class,而不是style.导出时并没有导出class定义 ...