Async Validator 异步验证使用说明
async-validator 是一个异步验证的库,需要传入要验证的数据和验证规则
官方链接 https://github.com/yiminghe/async-validator
要检验的数据,格式要求如下:
{ a:xxx, b:xxx }
检验规则定义格式如下:
{ a:[ {验证规则, message: 'xxx'}, {验证规则, message: 'xxx'} ], b:[ {验证规则, message: 'xxx'} ] }
message是规则没通过时返回的错误消息
举个例子, 因为是异步验证,所以我们用ES6 的 Promise去调用它,方便使用
var inputData = {'item':'12345'} var rules = [ {required: true, message: '年龄不能为空'}, {type: 'number', message: '年龄必须为数字值'} ] function validateData() { var validateRuler = new Promise(function (resolve, reject) { var validator = new AsyncValidator(rules) validator.validate(inputData, { firstFields: true }, (errors, fields) => { resolve(errors) }) return validateRuler } function validate() { validateData().then(function (errors) { console.log(errors) if (errors === null) { // 通过验证,该干嘛干嘛 } else { // 把验证结果展示在页面上 } }) } validate()
如果验证没通过是这样
通过了则返回 null
需要注意的是,如果传入的规则是空数组
上面的resolve(errors)是完全不会执行的
以上所述是小编给大家介绍的Async Validator 异步验证使用说明,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
相关推荐
-
jquery插件bootstrapValidator表单验证详解
Bootstrap Validator是为Bootstrap3设计的一款表单验证jQuery插件,非常适合基于Bootstrap框架的网站. 看作者的github,这款插件已经不再更新了,而推荐使用FormValidation,不过现在还是先介绍一下BootstrapValidator的使用. 准备工作 BootstrapValidator文档地址:http://bv.doc.javake.cn/ 下载源码后,将其中的bootstrapValidator.min.css和bootstapVali
-
使用bootstrap validator的remote验证代码经验分享(推荐)
这里需要说一下,bootstrapvalidator的帮助文档写的比较简单,对于remote验证器的说明更是如此,在经历多方测试之后才明白如何使用这个验证器. 一个典型的ajax验证代码如下: 服务端验证代码(使用spring mvc)如下: /* * 返回String类型的结果 * 检查用户名的合法性,如果用户已经存在,返回false,否则返回true(返回json数据,格式为{"valid",true}) */ @RequestMapping(value = "/chec
-
bootstrapValidator bootstrap-select验证不可用的解决办法
如何解决bootStrapValidator bootStrap-select验证不可用,只要三步: 思路:把多选下拉框的选中值,赋给一个隐藏的input组件,再对input组件进行验证(bootstrap-validator默认情况下hidden,disabled的组件不验证,可以通过excluded属性更改),具体步骤如下: 1.表单验证初始化(js) $('#myModalForm').bootstrapValidator({ message: 'This value is not val
-
Vue表单验证插件Vue Validator使用方法详解
Vue-validator 是Vue的表单验证插件,供大家参考,具体内容如下 Vue版本: 1.0.24 Vue-validator版本: 2.1.3 基本使用 <div id="app"> <validator name="validation"> <form novalidate> <div class="username-field"> <label for="username
-
Async Validator 异步验证使用说明
async-validator 是一个异步验证的库,需要传入要验证的数据和验证规则 官方链接 https://github.com/yiminghe/async-validator 要检验的数据,格式要求如下: { a:xxx, b:xxx } 检验规则定义格式如下: { a:[ {验证规则, message: 'xxx'}, {验证规则, message: 'xxx'} ], b:[ {验证规则, message: 'xxx'} ] } message是规则没通过时返回的错误消息 举个例子,
-
React中使用async validator进行表单验证的实例代码
react中进行表单验证毫无疑问是繁琐的,尤其对于动态添加或删除的表单,其验证逻辑更为复杂, 目前UI框架使用material ui ,但其表单处理不太理想,而后研究了一下另一个UI 框架 ant design, 其对表单的处理大大方便了逻辑的编写, 它使用async-validator处理验证逻辑 目前更换框架毫无疑问是不现实的,于是就想直接引入async-validator,下面描述一个简单的使用,具体信息可以去github上查看 validate.js import Schema from
-
jQuery异步验证用户名是否存在示例代码
现在有个需求就是异步验证用户名是否存在.用的技术是jQuery异步验证和struts2(其实springMVC也是一样的道理,都只是一个控制器). 表单: 复制代码 代码如下: <input class="width150" maxlength="32" type="text" id="dept_name" name="dept.dept_name" value="${dept.dept_n
-
angular异步验证器防抖实例详解
目录 背景: 防抖节流 定义: 代码实现: 疑惑 first()的使用 单元测试 fakeAsync; 题外 补充 总结 背景: 当前输入框的formControl设置了异步验证器,会根据当前的值进行请求后台,判断数据库中是否存在. 原版异步验证器: vehicleBrandNameNotExist(): AsyncValidatorFn { return (control: AbstractControl): Observable<ValidationErrors | null> =>
-
利用jQuery.Validate异步验证用户名是否存在(推荐)
HTML头部引用: <script type="text/JavaScript" src="../js/jQuery-1.3.2.min.js"></script> <script type="text/javascript" src="../js/jquery.validate.min.js"></script> <script type="text/javas
-
spring boot 使用@Async实现异步调用方法
使用@Async实现异步调用 什么是"异步调用"与"同步调用" "同步调用"就是程序按照一定的顺序依次执行,,每一行程序代码必须等上一行代码执行完毕才能执行:"异步调用"则是只要上一行代码执行,无需等待结果的返回就开始执行本身任务. 通常情况下,"同步调用"执行程序所花费的时间比较多,执行效率比较差.所以,在代码本身不存在依赖关系的话,我们可以考虑通过"异步调用"的方式来并发执行. &q
-
thinkphp5使用bootstrapvalidator进行异步验证邮箱的示例
本文介绍了thinkphp5使用bootstrapvalidator进行异步验证邮箱的示例,分享给大家,具体如下: js验证 /** * Created by HONGXIN on 2017-10-23. */ $(function () { $('form').bootstrapValidator({ message: 'This value is not valid', feedbackIcons: { valid: 'glyphicon glyphicon-ok', invalid: 'g
-
jquery登录的异步验证操作示例
本文实例讲述了jquery登录的异步验证操作.分享给大家供大家参考,具体如下: //定义一个json var validate = { username : false, pwd : false, pwded : false, verify : false, loginUsername : false, loginPwd :false } //存储错误信息 var $msg = ""; //验证注册表单 $(function(){ //获取表单对象 var register = $('
-
jQuery Ajax async=>false异步改为同步时,解决导致浏览器假死的问题
今天做一个需求遇到了这么个情况,就是用户个人中心有个功能,点击按钮,可以刷新用户当前的积分,这个肯定需要使用到ajax的同步请求了,当时喀喀喀三下五除二写玩了,大概代码如下: /** * 异步当前用户积分 by zgw 20161216 * @return {[type]} [description] */ function flushIntegralSum() { //点击按钮刷新前修改按钮的文案,已经去掉点击事情,防止多次点击 $("#flushbutton").replaceWi
-
在layui中使用form表单监听ajax异步验证注册的实例
今天给大家介绍的是当下很流行的框架layui中的一个小案例.就是form表单监控提交并且使用ajax异步提交验证数据.在layui中我们想使用哪个模块就要layui.use('form',function{});这种形式要引用form内置模板,下面是HTML全部代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>注册</title> <
随机推荐
- Go语言判断指定文件是否存在的方法
- AngularJs表单校验功能实例代码
- Win2003+ASP.NET虚拟主机安全设置图文教程
- 浅析Oracle和Mysql分页的区别
- asp.net下检测SQL注入式攻击代码
- 详解.net循环、逻辑语句块(基础知识)
- asp.net gridview分页:第一页 下一页 1 2 3 4 上一页 最末页
- vue快捷键与基础指令详解
- 如何调优SQL Server查询
- postgres 数据库中的数据转换
- 深入理解javascript动态插入技术
- Android多媒体教程之播放视频的四种方法
- java对象初始化顺序验证示例
- Java中Console对象实例代码
- Android设计模式之代理模式Proxy浅显易懂的详细说明
- Django ORM 自定义 char 类型字段解析
- 浅谈Android客户端与服务器的数据交互总结
- Python(Django)项目与Apache的管理交互的方法
- opencv平均背景法详解
- python Canny边缘检测算法的实现