bootstrap validate 验证插件

Posted 2022-04-26 luo1240465012

1、需要引入bootstrapValidator.min.js

2、在需要验证的控件中添加 class="form-control" 

3、js中写验证的方法

    $(‘#psasave‘).bootstrapValidator(
        message: ‘This value is not valid‘,
        feedbackIcons: /*输入框不同状态，显示图片的样式*/
            valid: ‘glyphicon glyphicon-ok‘,
            invalid: ‘glyphicon glyphicon-remove‘,
            validating: ‘glyphicon glyphicon-refresh‘
        ,
        fields: /*验证*/
            gysqc: /*键名username和input name值对应*/
                message: ‘供应商名称为必填项‘,
                validators: 
                    notEmpty: /*非空提示*/
                        message: ‘‘
                    
                
            ,
            gysdzyx: /*供应商地址邮编*/
                message:‘供应商地址不能为空‘,
                validators: 
                    notEmpty: /*非空提示*/
                        message: ‘‘
                    
                
             ,
            shmk: /*审核模块*/
                message:‘请选择审核模块‘,
                validators: 
                    notEmpty: /*非空提示*/
                        message: ‘请选择审核模块‘
                    
                
            ,
            cpmk: /*产品模块*/
                message:‘请选择产品模块‘,
                validators: 
                    notEmpty: /*非空提示*/
                        message: ‘请选择产品模块‘
                    
                
             ,
            shcp: /*审核产品*/
                message:‘审核产品不能为空‘,
                validators: 
                    notEmpty: /*非空提示*/
                        message: ‘审核产品不能为空‘
                    
                
             ,
            shrq: /*审核日期*/
                message:‘审核日期不能为空‘,
                validators: 
                    notEmpty: /*非空提示*/
                        message: ‘审核日期不能为空‘
                    
                
            ,
            shy: /*审核员姓名*/
                message:‘审核员姓名不能为空‘,
                validators: 
                    notEmpty: /*非空提示*/
                        message: ‘审核员姓名不能为空‘
                    
                
            ,
            shydh: /*审核员姓名*/
                message:‘审核人员电话、邮箱不能为空‘,
                validators: 
                    notEmpty: /*非空提示*/
                        message: ‘审核人员电话、邮箱不能为空‘
                    
                
            
        
    );

验证长度、格式那些方法也有，只是没有业务要求，因为电话可能有多个

4、触发验证：

 $("#psasave").data("bootstrapValidator").validate();

5、获取验证结果：（true/false）

var flag = $("#psasave").data("bootstrapValidator").isValid();

参考链接：

https://www.jb51.net/article/99381.htm