bootstrapValidator 验证

1,添加相关js和css

<script src="~/js/jquery/jquery.min.js"></script>
<script src="~/js/bootstrap/bootstrap.min.js"></script>
<link href="~/css/bootstrap.min.css" rel="stylesheet" />

<script src="~/js/bootstrapvalidator/bootstrapValidator.min.js"></script>
<script src="~/js/bootstrapvalidator/zh_CN.js"></script>
<link href="~/css/bootstrapValidator.min.css" rel="stylesheet" />

2,初始化验证规则

 $("#formAppointment").bootstrapValidator({
        message: '输入值不合法',
        excluded: [":disabled"],
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {
            appointmentName: {
                message: '主访人不合法',
                validators: {
                    notEmpty: {
                        message: '主访人不能为空'
                    },
                    stringLength: {
                        min: 3,
                        max: 30,
                        message: '请输入3到30个字符'
                    },
                    regexp: {
                        regexp: /^[a-zA-Z0-9_\. \u4e00-\u9fa5 ]+$/,
                        message: '用户名只能由字母、数字、点、下划线和汉字组成 '
                    }
                }
            }, sid: {
                validators: {
                    notEmpty: {
                        message: '身份证不能为空'
                    }, regexp: {
                        regexp: /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/,
                        message: '身份证号码格式不正确,为15位和18位身份证号码!'
                    }
                }
            }, phone: {
                validators: {
                    notEmpty: {
                        message: '手机号不能为空'
                    },
                    regexp: {
                        regexp: /^1[34578]\d{9}$/,
                        message: '请输入完整手机号码!'
                    }
                }
            }, Img: {
                trigger:"change",
                validators: {
                    notEmpty: {
                        message: '请拍摄照片'
                    }
                }
            }, content: {
                validators: {
                    notEmpty: {
                        message: '访问内容不能为空'
                    },
                    stringLength: {
                        min: 6,
                        max: 500,
                        message: '请输入6到500个字符'
                    }
                }
            }
            , department: {
                validators: {
                    notEmpty: {
                        message: '受访部门不能为空'
                    },
                    callback: {
                        message: '请选择受访部门',
                        callback: function (value, validator) {

                            if (value == -1) {
                                return false;
                            } else {
                                return true;
                            }

                        }
                    }
                }
            }
        }
    });

3,提交时触发验证

  $("#okBtn").on('click',function () {
       
        $("#formAppointment").bootstrapValidator('validate');//提交验证,手动对表单进行校检

        if ($("#formAppointment").data('bootstrapValidator').isValid()) {

            //判断校检是否通过
        }
        
    });

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值