bootstrapValidator使用总结
1.根据条件动态增删检查条件
参考文章:https://blog.csdn.net/sxlzs_/article/details/78211928
#去除某字段的验证
$("#formResource").bootstrapValidator('removeField', 'permission');
#增加某字段的验证
$("#formResource").bootstrapValidator("addField", "permission", {
validators : {
notEmpty : {
message : '数据标识不能为空'
}
}
});
2.select等值会发生变化时处理
sjklx : {
trigger : 'change',
validators : {
notEmpty : {
message : '数据库类型不能为空'
}
}
}
3.输入字符长度控制,添加正则校验
以输入密码为例:
pass: {
validators: {
stringLength: {
min: 6,
max: 18,
message: '密码长度至少6位'
},
regexp: {
regexp: /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,18}$/,
message: '必须含有大写字母,小写字母和数字'
}
}
}
4.两次密码校验
pass: {
validators: {
stringLength: {
min: 6,
max: 18,
message: '密码长度至少6位'
},
regexp: {
regexp: /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,18}$/,
message: '必须含有大写字母,小写字母和数字'
}
}
},
// 密码确认
passConfirm: {
message: '密码确认验证失败',
validators: {
identical: {
field: 'pass',
message: '两次密码不相同'
}
}
}
4.ip 校验
ip: {
validators: {
ip: {
message: '请输入正确的IP地址'
}
}
}
5. emailAddress校验
mail: {
validators: {
emailAddress: {
message: '请输入正确的Email地址'
}
}
}
6. between:值范围校验
level: {
validators: {
between: {
message: '输入值必须在1到10之间'
}
}
}
7.base64校验
base64Test: {
validators: {
base64: {
message: '不是合法的base64编码'
}
}
},
7.身份证校验
creditCardTest: {
validators: {
creditCard: {
message: '不是合法的身份证'
}
}
},
8.date日期校验
dateTest: {
validators: {
date: {
message: '不是合法的日期'
}
}
}
9.numeric校验
numericTest: {
validators: {
numeric: {
message: '不是合法的数字'
}
}
}
9.uri校验
dateTest: {
validators: {
uri: {
message: '不是合法的URI'
}
}
}
10.电话号码校验
phoneTest: {
validators: {
phone: {
message: '不是合法的电话'
}
}
}
11.校验范围:隐藏域(:hidden)、禁用域(:disabled)、那啥域(:not(visible))
bootstrap默认不对上述三种类型进行校验,如果需要改变,见下:
$('#form').bootstrapValidator({
message: '您的输入有误',
excluded: [":disabled"],
fields: {
zjxh: {
validators: {
notEmpty: {
message: '闸机型号不能为空'
}
}
}
}
});
12.input=file校验
zp : {
trigger : 'change',
validators : {
notEmpty : {
message : '照片不能为空'
},
regexp : {
regexp : /jpg$/,
message : '格式必须为.jpg'
}
}
}
bootstrapValidator使用总结的更多相关文章
- bootstrapvalidator+bootstrap-select select无法校验问题解决方法
$("#form_user_input") .bootstrapValidator( { message : 'This value is not valid', excluded ...
- Bootstrap表单验证插件bootstrapValidator使用方法整理
插件介绍 先上一个图: 下载地址:https://github.com/nghuuphuoc/bootstrapvalidator 使用方法:http://www.cnblogs.com/huangc ...
- JS组件系列——Form表单验证神器: BootstrapValidator
前言:做Web开发的我们,表单验证是再常见不过的需求了.友好的错误提示能增加用户体验.博主搜索bootstrap表单验证,搜到的结果大部分都是文中的主题:bootstrapvalidator.今天就来 ...
- bootstrapvalidator校验、校验清除重置
//保存 function saveAdmin(){ //开启验证 $('#saveadmin_form').data('bootstrapValidator').validate(); if(!$( ...
- bootstrapValidator.js,最好用的bootstrap表单验证插件
前言:做Web开发的我们,表单验证是再常见不过的需求了.友好的错误提示能增加用户体验.博主搜索bootstrap表单验证,搜到的结果大部分都是文中的主题:bootstrapvalidator.今天就来 ...
- jQuery 实现bootstrapValidator下的全局验证
前置: 引入jQuery.bootstrap.bootstrapValidator 问题描述: 项目中要求所有的表单输入框中都不能输入&符号.没有在bootstrap中找到有方法可用,只能自己 ...
- bootstrapValidator.js 做表单验证
有这样的一个场景,我们在提交form表单的时候 可能要做一些验证,比如判断是不是为空,电话的格式验证,邮箱的格式验证等等,手写起来也是可以得. 但是今天我介绍一个bootstrap插件简化开发.就是b ...
- 【bootstrapValidator 不验证】使用bootstrapValidator 验证效果不起作用
虽然在页面ready的时候 就绑定了验证表单 ,但是在点击提交按钮之后 依旧没有验证的效果 . 那就在提交按钮的点击事件中 添加一句话: $(document).ready( function () ...
- bootstrap-validator验证问题总结
bootstrap-validator是一个优秀的验证器,使用中遇到如下问题,总结如下: 1.<button type="submit" name="submit2 ...
- BootstrapValidator验证表单用法
引入文件 <link rel="stylesheet" href="css/bootstrap.css"/> <link rel=" ...
随机推荐
- LeetCode(194.Transpose File)(awk进阶)
194. Transpose File Given a text file file.txt, transpose its content. You may assume that each row ...
- java中的日志打印
java中的日志打印: 日志工具类: #获取日志 INFO:表示获取日志的等级 A1:表示日志存器,可以自定义名称 #===DEBUG INFO log4j.rootLogger=DEBUG,A1,A ...
- iOS下如何阻止橡皮筋效果
$(document).ready(function(){ var stopScrolling = function(event) { event.preventDefault(); } docume ...
- 十三、u-boot 调试-- NOR FLASH 支持
13.1 问题现象 在烧写进去的u-boot 中 Flash 并没有显示实际大小,需要进行修改. 13.2 问题定位过程 13.2.1 关键字搜索 Flash: 此关键字在 Board_r.c (co ...
- Filter 快速开始 异步Servlet 异步请求 AsyncContext 异步线程 异步派发 过滤器拦截
[web.xml] <filter> <filter-name>normalFilter</filter-name> <filter-class>net ...
- solr集群SolrCloud(solr+zookeeper)windows搭建
SolrCloud是什么 参考 solrCloud官网介绍 http://lucene.apache.org/solr/guide/6_6/solrcloud.html Apache Solr 可以设 ...
- springboot 02-PropertiesFile 自定义配置属性,多环境配置
application.properties: # 自定义配置 test.hello.world = HelloWorld test.person.name = 哈哈 test.person.sex ...
- spring和mybatis的整合开发(传统Dao开发方式)
spring和mybatis整合开发有三种整合方式1.传统DAO方式的开发整合(现在基本上不会用这种方式了,不推荐使用这种方式),2.mapper接口方式的开发整合(基于MapperFactoryBe ...
- JQuery之Attr()与Prop()方法
一.Prop()的由来 JQuery 1.6开始 新增方法prop() prop()解决:表单元素中checked,selected,disabled等属性在方法attr()中可能会出现的不一致问题( ...
- 第25月第5天 Hands-on Machine Learning with Scikit-Learn and TensorFlow
1.apachecn视频(机器学习实战) https://github.com/apachecn/AiLearning https://space.bilibili.com/97678687/#/ch ...