BootstrapValidator随笔

使用格式:

在提交表单的click事件中插入语句:

$("#inputForm").bootstrapValidator('validate');

 其中:inputForm是所要提交的表单的id

以上语句实现在点击按钮时进行表单的验证。

$("#inputForm").bootstrapValidator({
						message : "请录入一个有效值",
						feedbackIcons : {
							valid : "glyphicon glyphicon-ok",
							invalid : "glyphicon glyphicon-remove",
							validating : "glyphicon glyphicon-refresh"
						},
						fields : {
							width: {
								validators : {
									notEmpty : {
										message : "宽度不能为空"
									}
								}
							},
							height : {
								validators : {
									notEmpty : {
										message : "高度不能为空"
									}
								}
							}
						}
					}).on("success.form.bv",function(e) {
						editData();
					}); 

 以上为在输入表单时验证

1.布局错位改变的问题

每个(每行)需要验证的表单控件都要用<div class="form-group"></div>包围,form-group样式包裹的表单在显示提示的信息时可避免下一行的样式发生改变

2.自定义的表单认证

bootstrapValidator可以自定义表单认证

callback: {
				                         message: '宽度不能小于高度',
				                         callback: function(value, validator) {
				                             var reg =  /^\d{3}}$/;
				                             var r = $("#height").val().match(reg);     
				                             if(r==null)return true
				                             var items = $("#height").val();
				                             return value > items;
				                         }
				                     },

 callback中的 value代表当前表单的值,多个callback嵌套只有最有一个正常验证

3.ajax

bootstrapValidator中可通过ajax来访问后台数据,并返回布尔值

remote: {
				                         url: '/a/checkname',
				                         message: '用户名重复',//提示消息
				                         type: 'POST',//请求方式
// 				                         自定义提交数据,默认值提交当前input value
				                            data: function(validator) {
				                               return {
				                            	   width: $('[name="width"]').val(),
				                                   height: $('[name="height"]').val()
				                               };
				                            }
				                          
				                     }

返回{"valid",true or false}对象,如果是{"valid",true }则验证通过,如果是{"valid",false}则没有通过

ajax验证是每次change都执行

转载于:https://www.cnblogs.com/fengzhilingwu/p/5782319.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值