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=" ...
随机推荐
- ACM-ICPC 2018 南京赛区网络预赛 G Lpl and Energy-saving Lamps(模拟+线段树)
https://nanti.jisuanke.com/t/30996 题意 每天增加m个灯泡,n个房间,能一次性换就换,模拟换灯泡过程.询问第几天的状态 分析 离线做,按题意模拟.比赛时线段树写挫了. ...
- oldboy s21day02
1.猜数字,设定一个理想数字比如:66,让用户输入数字,如果比66大,则显示猜测的结果大了:如果比66小,则显示猜测的结果小了;只有等于66,显示猜测结果正确,然后退出循环.while 1: num ...
- threading.local学习
多线程抢占问题 import time import threading obj = 5 def task(arg): global obj obj = arg time.sleep(1) print ...
- MySQL的一些基本命令笔记(1)
关系型数据库的建模构建块: 1.数据是以行和列的形式存储数据. 2.这一系列的行和列称为表(关系) 3.表中的每一行表示一条记录(元组) 4.表中的每一列表示记录的一个属性 5.一组表组成了数据库 6 ...
- 三十六、Linux 线程——线程基本概念及线程的创建和终止
36.1 线程介绍 36.1.1 线程的基本概念 进程是资源管理的最小单位,线程是程序执行的最小单位 每个进程都有自己的数据段.代码段和堆栈段. 线程通常叫做轻型的进程,它包含独立的栈和 CPU 寄存 ...
- luogu 4377 Talent show 01分数规划+背包dp
01分数规划+背包dp 将分式下面的部分向右边挪过去,通过二分答案验证, 注意二分答案中如果验证的mid是int那么l=mid+1,r=mid-1,double类型中r=mid,l=mid; 背包dp ...
- PHP cURL实现模拟登录与采集使用方法详解教程
来源:http://www.zjmainstay.cn/php-curl 本文将通过案例,整合浏览器工具与PHP程序,教你如何让数据 唾手可得 . 对于做过数据采集的人来说,cURL一定不会陌生.虽然 ...
- win7, ubuntu双系统,重装win7后,修复引导
参考: http://blog.csdn.net/abcsunl/article/details/72875983 http://blog.csdn.net/davied9/article/detai ...
- 阿里云CentOS7.2卸载CDH5.12
#####################删除前最好将之前的下载的rpm包和parcels包备份一下##################### 1.停止serviceservice cloudera- ...
- react组件之间的组合方式
组合方式: 1/直接嵌套的方式 2/组件以变量的形式放置 3/可以通过props值,以变量的形式相当于作为参数传递父组件,然后进行组合 import React,{Component} from 'r ...