码迷,mamicode.com
首页 > 其他好文 > 详细

bootstrap validate 验证插件

时间:2019-07-19 19:11:16      阅读:140      评论:0      收藏:0      [点我收藏+]

标签:地址   orm   样式   article   不同   put   mes   业务   feedback   

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

bootstrap validate 验证插件

标签:地址   orm   样式   article   不同   put   mes   业务   feedback   

原文地址:https://www.cnblogs.com/luo1240465012/p/11215032.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!