当字段有效时,Bootstrapvalidation不会隐藏错误消息

时间:2018-06-12 09:52:36

标签: jquery bootstrapvalidator

我正在使用bootstrapvalidator插件,我知道这是一个不再受支持的旧版本,新版本称为FormValidation(http://formvalidation.io/),但现在需要付款,所以我正在寻找快速修复我的问题。

错误是即使在验证成功后,将鼠标悬停在绿色勾号上仍会显示错误消息。因此,例如,当两个密码相同时,将显示消息“新密码及其确认不相同”。

jQuery代码如下:

$('#newPasswordForm')
    .bootstrapValidator({
        container: 'tooltip',
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        fields: {

            password: {
                validators: {
                    regexp: {
                        regexp: /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-.~]).{8,}$/,
                        message: 'Password must use a combination of at least 8 upper and lower case letters, numbers and symbols.'
                    },
                    notEmpty: {
                        message: 'You must enter your new password'
                    },
                    stringLength: {
                        min: 8,
                        message: 'Password must be at least 8 characters in length'
                    },
                    identical: {
                        field: 'password_confirmation',
                        message: 'The new password and its confirm are not the same'
                    }
                }
            },

            password_confirmation: {
                validMessage: '',
                validators: {
                    notEmpty: {
                        message: 'You must confirm your new password'
                    },
                    identical: {
                        field: 'password',
                        message: 'The new password and its confirm are not the same'
                    }
                }
            }

        }
    })

表格HTML如下:

   <form id="newPasswordForm" class="form-horizontal" role="form" method="POST" action="">
        <div class="form-group">
            <label for="email" class="col-sm-2 control-label">Email</label>
            <div class="col-sm-6">
                <input id="email" type="email" class="form-control" name="email" value="{{$email}}" required autofocus>
            </div>
        </div>

        <div class="form-group">
            <label for="password" class="col-sm-2 control-label">New Password</label>
            <div class="col-sm-6">
                <input type="password" class="form-control" id="password" name="password" placeholder="New Password">
            </div>
        </div>
        <div class="form-group">
            <label for="password_confirmation" class="col-sm-2 control-label">Confirm Password</label>
            <div class="col-sm-6">
                <input type="password" class="form-control" id="password_confirmation" name="password_confirmation" placeholder="Confirm Password">
            </div>
        </div>
        <div class="form-group">
            <div class="col-sm-offset-2 col-sm-6">
                <button type="submit" class="btn btn-primary" id="resetBtn">Set password</button>
            </div>
        </div>
    </form>

1 个答案:

答案 0 :(得分:1)

我创建了演示,并且在悬停绿色勾号时没有显示错误消息:

https://codepen.io/creativedev/pen/bKWgPz

我使用的Bootstrapvalidator版本是:

https://cdnjs.cloudflare.com/ajax/libs/jquery.bootstrapvalidator/0.5.3/js/bootstrapValidator.js