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 异步验证使用说明,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!
相关推荐
-
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
-
使用bootstrap validator的remote验证代码经验分享(推荐)
这里需要说一下,bootstrapvalidator的帮助文档写的比较简单,对于remote验证器的说明更是如此,在经历多方测试之后才明白如何使用这个验证器. 一个典型的ajax验证代码如下: 服务端验证代码(使用spring mvc)如下: /* * 返回String类型的结果 * 检查用户名的合法性,如果用户已经存在,返回false,否则返回true(返回json数据,格式为{"valid",true}) */ @RequestMapping(value = "/chec
-
jquery插件bootstrapValidator表单验证详解
Bootstrap Validator是为Bootstrap3设计的一款表单验证jQuery插件,非常适合基于Bootstrap框架的网站. 看作者的github,这款插件已经不再更新了,而推荐使用FormValidation,不过现在还是先介绍一下BootstrapValidator的使用. 准备工作 BootstrapValidator文档地址:http://bv.doc.javake.cn/ 下载源码后,将其中的bootstrapValidator.min.css和bootstapVali
-
bootstrapValidator bootstrap-select验证不可用的解决办法
如何解决bootStrapValidator bootStrap-select验证不可用,只要三步: 思路:把多选下拉框的选中值,赋给一个隐藏的input组件,再对input组件进行验证(bootstrap-validator默认情况下hidden,disabled的组件不验证,可以通过excluded属性更改),具体步骤如下: 1.表单验证初始化(js) $('#myModalForm').bootstrapValidator({ message: 'This value is not val
-
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> <
随机推荐
- asp.net+Ajax校验用户是否存在的实现代码
- Bootstrap前端开发案例二
- JS实现3D图片旋转展示效果代码
- PHP 截取字符串专题集合
- 使用PHP制作新闻系统的思路
- php学习笔记(三)操作符与控制结构
- php使用curl和正则表达式抓取网页数据示例
- jQuery UI 实现email输入提示实例
- Java实现的AES256加密解密功能示例
- .Net平台开发实践的一些点滴总结(技术规范与实践精华)第1/2页
- javascript 跨浏览器开发经验总结(五) js 事件
- Android ListView用EditText实现搜索功能效果
- 详解layui弹窗父子窗口之间传参数的方法
- PHP使用Redis长连接的方法详解
- vue-cli配置flexible过程详解
- centOS7 NET模式设置静态Ip的方法步骤
- C++结构体与类指针知识点总结
- thinkphp5+layui实现的分页样式示例
- 修改ORACLE数据库密码有效期的方法
- InteliJ IDEA 设置eclipse快捷键 的图文教程