BootstrapValidator 解决多属性被同时校验问题
问题描述:在使用bootstrapValidator插件校验表单属性,当表单属性过多需要每行并列多个属性 ,会出现校验第一个属性,发现整行被校验的效果 ,这不是我们工作想要的效果。如图:
问题分析:因为bootstrapValidator默认情况是根据form-group样式验证提示,若我们代码中将同行显示属性放在一个form-group中,就会出现该问题,那么怎么解决呢 ,lz仔细阅读了该插件官网,发现存在group属性,其值默认为“.form-group”,该属性便是官方提供的在多个属性分组情况使用。
解决方案:首先html修改代码
<div class="form-group">
**<div class="rowGroup">**
<label class="col-md-2 control-label">供应商编号:</label>
<div class="col-md-2">
<input type="text" class="form-control" id="code" name="code" value = "" >
</div>
</div>
<div class="rowGroup">
<label class="col-md-2 control-label">供应商名称:</label>
<div class="col-md-2">
<input type="text" class="form-control" id="name" name="name" value="">
</div>
</div>
<div class="rowGroup">
<label class="col-md-2 control-label">供应商类型:</label>
<div class="col-md-2">
<select class="show-tick form-control" data-live-search="true" id="type" name="type">
</select>
</div>
</div>
</div>
JS修改代码
$('#supplierForm').bootstrapValidator({
container: 'tooltip',
group: '.rowGroup',
message : '数据错误',
excluded: ':disabled',
feedbackIcons: {
valid: 'fa fa-check',
invalid: 'fa fa-times',
validating: 'fa fa-refresh'
},
fields: {
code: {
validators: {
notEmpty: {
message: '供应商编号为空'
},
},
},
//其他属性略
},
submitHandler: function (validator, form, submitButton) {
validator.defaultSubmit();
}
});
结果图:

BootstrapValidator 解决多属性被同时校验问题的更多相关文章
- BootstrapValidator 解决多属性被同时校验问题《转》
问题描述:在使用bootstrapValidator插件校验表单属性,当表单属性过多需要每行并列多个属性 ,会出现校验第一个属性,发现整行被校验的效果 ,这不是我们工作想要的效果.如图: 问题分析:因 ...
- VS 错误解决(项目-属性-启用调试器)
我是先安装了VS2012, 之后由于需要安装了VS2008, 但在VS2012中可以运行程序但是不能调试, 即按Ctrl+F5可以运行, 但是按F5会提示错误. "尝试运行项目时出错:Unc ...
- Java使用序列化的私有方法巧妙解决部分属性持久化问题
部分属性持久化问题看似很简单,只要把不需要的持久化的属性加上瞬态关键字(transient关键字)即可,没错,这也是一种解决方案,但在有的时候行不通,例如在一个计税系统和人力系统对接的时候,计税系统需 ...
- 解决opacity属性在低版本IE浏览器下失效的方法
以前,一直都以为ie9以下的版本不支持opacity属性.所以就同时使用 opacity和ie独特的filter蒙版.但是有些时候需要一些动态的效果,就比如层的渐渐消失,隐藏,就需要使用动态变化的op ...
- 周记3——解决fixed属性在ios软键盘弹出后失效的bug
这周在做空间(“类似”qq空间)项目.首页是好友发表的说说,可以针对每条说说进行评论,评论框吸附固定在屏幕底部.此时,Bug来了...在ios上,软键盘弹出后fixed属性失效了.后来发现,ios绝大 ...
- 解决多字段联合逻辑校验问题【享学Spring MVC】
每篇一句 不要像祥林嫂一样,天天抱怨着生活,日日思考着辞职.得罪点说一句:"沦落"到要跟这样的人共事工作,难道自己身上就没有原因? 前言 本以为洋洋洒洒的把Java/Spring数 ...
- 如何解决Css属性text-overflow:ellipsis 不起作用(文本溢出显示省略号)
如何使text-overflow:elipsis起作用? 想要使用css属性text-overflow:elipsis起到作用,样式必须跟overflow:hidden; white-space:no ...
- 解决IE8placeholder属性问题
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...
- 解决inline-block属性带来的标签间间隙问题
1.给inline-block元素设置一个父元素. 设置父元素的font-size:0:.子元素font-size设置成合适大小,如果不设置子元素font-size,子元素会继承父元素的0: 2.给i ...
随机推荐
- Failed to resolve: com.android.support:appcompat-v7:28 问题解决
apply plugin: 'com.android.application' android { compileSdkVersion buildToolsVersion "28.0.2&q ...
- python对象初始化
当python对象被创建以后,需要将对象进行初始化.Python有一个构造函数和一个初始化函数: 1.构造函数__new__,只接受一个参数,即类本身(它会在对象被构造之前调用,所以这里也就没有sel ...
- puppeteer,新款headless chrome
puppeteer puppeteer是一种谷歌开发的Headless Chrome,因为puppeteer的出现,业内许多自动化测试库停止维护,比如PhantomJS,Selenium IDE fo ...
- Kafka技术内幕 读书笔记之(六) 存储层——服务端处理读写请求、分区与副本
如下图中分区到 日 志的虚线表示 : 业务逻辑层的一个分区对应物理存储层的一个日志 . 消息集到数据文件的虚线表示 : 客户端发送的消息集最终会写入日志分段对应的数据文件,存储到Kafka的消息代理节 ...
- layui(六)——upload组件常见用法总结
layui中提供了非常简单的文件上传组件,这里写了一个上传图片的栗子,上传成功后返回图片在服务器的路径,并设置为页面中img的src属性.因为上传十分简单,没什么可说的,就直接上代码了. html代码 ...
- Hadoop — Yarn原理解析
1. 概述 Yarn是一个资源调度平台,负责为运算程序提供服务器运算资源,相当于一个分布式的操作系统平台:而MapReduce等运算程序则相当运行于操作系统之上的应用程序. 2. YARN的重要概念 ...
- Django聚合与分组查询中value与annotate的顺序问题
在学习Django聚合与分组查询中,发现value与annotate的顺序不同时,查询结果大相径庭,经过一下午的研究,终于弄明白了,现在分享给大家,先上结论: 结论 value在annotate前面时 ...
- loj 10181 绿色通道 二分答案+单调队列DP
空题段长度即为单调队列长度区间 每次二分答案进行check即可 #include<bits/stdc++.h> using namespace std; ; const int inf=0 ...
- 多线程this逃逸
this逃逸, 是指在构造函数返回之前,其它线程就持有该对象的引用,调用尚未构造完全的对象的方法,可能引发令人疑惑的错误,应该避免this逃逸事件的发生. this逃逸经常发生在构造函数中启动线程或 ...
- My97DatePicker 只显示月份
<script src="../javascript/My97DatePicker/WdatePicker.js" type="text/javascript&qu ...