Bootstrap 表单验证formValidation 实现远程验证功能

前端之家收集整理的这篇文章主要介绍了Bootstrap 表单验证formValidation 实现远程验证功能前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

@H_502_0@最近项目用到了一个很强大的表单验证。记录下。官方地址:<a rel="external nofollow" href="http://formvalidation.io/api/"&gt;http://formvalidation.io/api/


@H_502_0@还有一点很重要:这个插件的Bootstrap最好用他们自带的,有点改动。不用再去Bootstrap官网下载。


@H_502_0@向上效果


<p style="text-align: center">

这里写图片描述

这里写图片描述

这里写图片描述

@H_502_0@先导入资源:

nofollow" /
@H_502_0@html:

@H_502_0@下面是验证代码

BoxId:{ verbose: false,//代表验证按顺序验证。验证成功才会下一个(验证成功才会发最后一个remote远程验证) validators: { notEmpty: { message: '这是必填字段' },digits: { message: '值不是数字' },stringLength: { min: 16,message:'必须为16个数字' },remote: { type: 'POST',url: '/Box/unique',message: '此设备号已存在',delay: 2000 } } },onSuccess:function(){ //点击提交表单。表单所有都验证成功 } });
@H_502_0@后台返回

@H_502_0@效果图;

这里写图片描述

这里写图片描述

这里写图片描述

这里写图片描述

这里写图片描述

这里写图片描述

@H_502_0@以上所述是小编给大家介绍的Bootstrap 表单验证formValidation 实现远程验证功能。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持

原文链接:https://www.f2er.com/bootstrap/39224.html

猜你在找的Bootstrap相关文章