接触bootstrapvalidator时间不久,最近需要多个字段共同验证,网上查了一下未找到,查阅api文档,发现确实可以实现。

先看dom

<div class="form-group">
<label class="col-sm-3 control-label">起止年限:</label> <div class="col-sm-9 row">
<div class="col-xs-5">
<div class="input-group">
<input type="text" name="beginYear" class="form-control "/>
<span class="input-group-addon">年</span>
</div>
</div>
<div class="col-xs-1" style="line-height:36px;"> 至</div>
<div class="col-xs-5">
<div class="input-group">
<input type="text" name="endYear" class="form-control"/>
<span class="input-group-addon">年</span>
</div>
</div>
</div>
</div

  在这个表单中,我们往往需要开始年份不能晚于结束年份,及beginYear<=endYear,此时,验证我们可以这样写

fields: {
beginYear: {
validators: {
integer: {},
callback: {
message: '开始日期不能大于结束日期',
callback:function(value, validator,$field,options){
var begin = $('#pro_info').find("input[name='endYear']").val();
return parseInt(value)<=parseInt(begin);
}
}
}
},
endYear: {
validators: {
integer: {},
callback: {
message: '结束日期不能小于开始日期',
callback:function(value, validator,$field){
var begin = $('#pro_info').find("input[name='beginYear']").val();
$('#pro_info').find("input[name='beginYear']").keypress();
validator.updateStatus('beginYear', 'VALID');
return parseInt(value)>=parseInt(begin);
}
}
}
}
}
});

  

主要是利用callback函数,传入参数validator验证器,利用验证器更新指定字段的状态。这样就可以实现多字段联合验证,当然,三个字段、四个字段也是如此。

转载请注明出处,博客园:http://www.cnblogs.com/dreamowneryong/p/5000206.html;如有疑问,欢迎前往原创评论,共同探讨。

bootstrap联动校验(转载)的更多相关文章

  1. Bootstrap 栅格系统(转载)

    源地址:http://www.cnblogs.com/linjiqin/p/3559800.html Bootstrap 栅格系统 目录1.简介2.栅格选项3.列偏移4.嵌套列5.列排序 1.简介Bo ...

  2. vue day3 bootstrap 联动下拉

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta ht ...

  3. bootstrap重置校验方法

    $(function (){ $("select").change(function(){ $('#DepartForm').bootstrapValidator('resetFo ...

  4. 翻译:使用 ASP.NET MVC 4, EF, Knockoutjs and Bootstrap 设计和开发站点 - 1

    原文地址:http://ddmvc4.codeplex.com/ 原文名称:Design and Develop a website using ASP.NET MVC 4, EF, Knockout ...

  5. SilverlightMVVM模式中的数据校验

    silverlight的数据校验大体分成3种类型: 数据是非必填的但是需要满足相应数据格式的 数据是必填的且可能需要进行数据格式校验的 其他(如数据的联动校验) 以下的数据校验方式针对第二种: 在相应 ...

  6. Traveller项目技术资料

    Spring Spring PecClinic:Spring官方的宠物医院项目 it.zhaozhao.info/archives/63818:SPRING JPA入门 Spring Data RES ...

  7. MVVM1

    silverlight的数据校验大体分成3种类型: 数据是非必填的但是需要满足相应数据格式的 数据是必填的且可能需要进行数据格式校验的 其他(如数据的联动校验) 以下的数据校验方式针对第二种: 在相应 ...

  8. AngularJS系列-翻译官网

    公司之前一直用的Web前台框架是Knockout,我们通常直接叫ko,有看过汤姆大叔的KO系列,也有在用,发现有时候用得不太顺手.本人是会WPF的,所以MVVM也是比较熟悉的,学ko也是很快就把汤姆大 ...

  9. jquery.validate和jquery.form配合实现验证表单后AJAX提交

    基础代码其实很简单,之后一点一点扩充.最终代码写在最后. 表单: <form action="@Url.Action("AddColumns","Cont ...

随机推荐

  1. id、css命名规范

    main热点:hot新闻:news下载:download子导航:subnav菜单:menu子菜单:submenu搜索:search友情链接:friendlink页脚:footer版权:copyrigh ...

  2. NOI Online能力测试游记:退役选手的自娱自乐

    2020年2月17日早上8点,CCF发布了关于举办NOI Online能力测试的通知. 为给选手提供一个锻炼的机会,CCF拟举办一场NOI Online能力测试.测试分为入门组和提高组,每组限额报名3 ...

  3. 在W10系统中配置Java环境变量后,cmd命令提示符找不到java

    java环境变量配置在W10系统上和以前有所区别,可能是W10版本导致也可能是W10一开始就出问题. 问题的表现就是你在环境变量里已经配置完JAVA_HOME,CLASSPATH,path之后在控制台 ...

  4. Qt Gui 第八章

    一.QGradient 该类是渐变画刷相关的类,有三个子类,分别是QConicalGradient.QRadialGradient和QLinearGradient 1.QConicalGradient ...

  5. 论文阅读笔记(七)【TIP2018】:Video-Based Person Re-Identification by Simultaneously Learning Intra-Video and Inter-Video Distance Metrics

    是由一篇 IJCAI2016 扩的期刊. 该篇会议论文的阅读笔记[传送门] 期刊扩充的部分:P-SI2DL 1.问题描述: 在会议论文中介绍的SI2DL方法采用了视频三元组作为视频关系(是否匹配)的逻 ...

  6. 【Python】画一个心形

    #!/usr/bin/env python # -*- coding:utf-8 -*- import turtle import time # 画心形圆弧 def hart_arc(): for i ...

  7. 论文阅读笔记(四)【TIP2017】:Video-Based Pedestrian Re-Identification by Adaptive Spatio-Temporal Appearance Model

    Introduction (1)背景知识: ① 人脸识别是具有高可靠性的生物识别技术,但在低解析度(resolution)和姿态变化下效果很差. ② 步态(gait)是全身行为的生物识别特征,大部分步 ...

  8. yii2表单提交CSRF验证

    Yii2表单提交默认需要验证CSRF,如果CSRF验证不通过,则表单提交失败,解决方法如下: 第一种解决办法是关闭Csrf public $enableCsrfValidation = false; ...

  9. VSCode配置Go插件和第三方拓展包

    前言 VSCode现在已经发展的相当完善,很多语言都比较推荐使用其来编写,Go语言也一样,前提你电脑已经有了Go环境和最新版本的VSCode 插件安装 直接在拓展插件中搜索Go,就可以安装Go插件 安 ...

  10. asp.net mvc获取http body中的json

    今天遇到一个对方直接post 一共json对象字符串过来的场景.按照以前的旧方案方法可以直接在request.inputstream里面读取,然后反序列化即可.(当然估计ASP.NET MVC应该有更 ...