欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

bootstrapValidator自定义验证规则,修改触发事件

程序员文章站 2022-03-02 08:26:59
在使用bootstrap时,感觉界面还是不错的,一般在做表单验证的时候所使用的是bootstrap-validator,这个插件功能都比较强大,在开发的时候需要验证文本框的值改变的时候触发,发...

在使用bootstrap时,感觉界面还是不错的,一般在做表单验证的时候所使用的是bootstrap-validator,这个插件功能都比较强大,在开发的时候需要验证文本框的值改变的时候触发,发现源码中对一些验证做了屏蔽,所以想到修改源码。

1、bootstrapValidator.js封装的触发验证事件如下代码,一般是input事件:




var el = document.createElement('div');  
this._changeEvent = (ieVersion === 9 || !('oninput' in el)) ? 'keyup' : 'input';  





  修改后,比如要修改为change事件如下:



 var el = document.createElement('div');
        this._changeEvent = (ieVersion === 9 || !('onchange' in el)) ? 'keyup' : 'change';


当给input赋值时,可js触发change()时间,以达到触发控件验证。 


2、当需要验证隐藏域时,源码封装的是做了屏蔽的,我们需要修改源码配置


$("#addForm").bootstrapValidator({
    //excluded:[":hidden",":disabled",":not(visible)"] ,//bootstrapValidator的默认配置
    excluded:[":disabled"],//关键配置,表示只对于禁用域不进行验证,其他的表单元素都要验证
    fields: {
        productId: {
            validators: {
                notEmpty: {
                    message: '请选择一个产品'
                }
            }
        }
    }
});