接触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. jsp虚拟路径与虚拟主机

    配置虚拟路径 方式一: 在Tomcat根目录下的webapps就是一个虚拟路径,conf目录下的server.xml文件里配置 //默认的虚拟路径 <Engine name="Cata ...

  2. IDEA 和 Webstorm JAR包方式破解

    IDEA 和 Webstorm JAR包方式破解 IDEA 我是用的IDEA版本是 18.3,更新版本的IDEA很多激活码都不能用了,或者不好激活了. 首先下载相应的 软件版本 和破解 jar包. 下 ...

  3. ASP.NET简介及网页基础知识

    ASP:Active Server Page. asp.net属于.NET Framework的一部分,命名空间是System.Web,主要用于网络程序的开发. .net版本演化(asp.net和.n ...

  4. KC开发组官方网站

    KC开发组,简称KC,又叫KC Team,是Kong Che Team(空车开发组)的缩写 是由ordosyz(某乡村小学)的CSP2019退役OIer(信息学奥林匹克竞赛选手) 于2020年2月23 ...

  5. PDF体检报告

    //Title: 个人健康管理分析报告 using System; using System.Collections.Generic; using System.Linq; using System. ...

  6. ECMAScript基本语法——⑤运算符 算数运算符

    +-*/%

  7. 对one hot 编码的理解,sklearn. preprocessing.OneHotEncoder()如何进行fit()的?

    查阅了很多资料,逐渐知道了one hot 的编码,但是始终没理解sklearn. preprocessing.OneHotEncoder()如何进行fit()的?自己琢磨了一下,后来终于明白是怎么回事 ...

  8. 51Nod 1449 砝码称重 (二进制思想)

    现在有好多种砝码,他们的重量是 w0,w1,w2,...  每种各一个.问用这些砝码能不能表示一个重量为m的东西. 样例解释:可以将重物和3放到一个托盘中,9和1放到另外一个托盘中. Input 单组 ...

  9. Java期末考试冲刺总结

    经过长达将近三个小时的冲刺,我感觉身心俱疲,但它无法掩盖我敲代码的欲望! 三个小时我只实现了公文流转系统的的部分功能. 我深刻的意识到建民老师说的这套关系之复杂,它真的是太复杂了!!!没有系统的梳理, ...

  10. Vue中封装axios

    参考: https://www.jianshu.com/p/7a9fbcbb1114 https://www.cnblogs.com/dreamcc/p/10752604.html 一.安装axios ...