如何防止 Bootstrap 验证在表单提交前显示错误信息？

Question

我正在使用 Bootstrap 4 验证，我有一些条件字段出现在单选按钮更改时。现在，当我更改选项卡时，它会向我显示验证消息，即使它没有 class has-warning

这是我的 js:

    $('#register_form')
    .find('[name="cms_frontuserbundle_frontuser[usertype]"]')
    .change(function (e) {
        var usertype = $(this).val();
        if (usertype == "institution") {
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[companyName]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[contactName]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryContactName]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[position]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryPosition]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryCountrydialcode]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryContactNumber]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryEmail]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[companyType]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[dateOfBirth]', false);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[companyName]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[contactName]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[secondaryEmail]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[secondaryContactName]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[secondaryCountrydialcode]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[secondaryContactNumber]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[position]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[secondaryPosition]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[secondaryEmail]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[companyType]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[firstname]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[lastname]', false);
        } else {
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[dateOfBirth]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[firstname]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[lastname]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[firstname]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[lastname]', true);
            $('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[dateOfBirth]', true);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[companyName]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[contactName]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryEmail]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryContactName]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryCountrydialcode]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryContactNumber]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[position]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[secondaryPosition]', false);
            $('#register_form').formValidation('enableFieldValidators', 'cms_frontuserbundle_frontuser[companyType]', false);

        }
    })
    .end()
    .formValidation({
        framework: 'bootstrap4',
        excluded: ':disabled',
        icon: {
            valid: '',
            invalid: '',
            validating: ''
        },
        fields: {
            'cms_frontuserbundle_frontuser[usertype]': {
                enabled: false,
                validators: {
                    notEmpty: {message: 'This field should not be blank.'},
                    // regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[companyName]': {
                enabled: false,
                validators: {
                    stringLength: {min: 10, max: 50, message: 'Company Name should be at least 10 characters long.'},
                    notEmpty: {message: 'This field should not be blank.'},
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[contactName]': {
                enabled: false,
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    stringLength: {
                        message: 'Contact Name should be at least 3 characters long.',
                        min: 3,
                        max: 50
                    },
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[secondaryContactName]': {
                enabled: false,
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    stringLength: {
                        message: 'Contact Name should be at least 3 characters long.',
                        min: 3,
                        max: 50
                    },
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[position]': {
                enabled: false,
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    stringLength: {
                        message: 'Position should be at least 3 characters long.',
                        min: 3,
                        max: 50
                    },
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[secondaryPosition]': {
                enabled: false,
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    stringLength: {
                        message: 'Position should be at least 3 characters long.',
                        min: 3,
                        max: 50
                    },
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[companyType]': {
                enabled: false,
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    stringLength: {
                        message: 'Company Type should be at least 3 characters long.',
                        min: 3,
                        max: 50
                    },
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[email]': {

                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    emailAddress: {
                        message: 'Email should be valid.'
                    },
                    stringLength: {
                        message: 'Email should be at least 3 characters long.',
                        min: 3,
                        max: 50
                    },
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[secondaryEmail]': {
                enabled: false,
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    emailAddress: {
                        message: 'Email should be valid'
                    },
                    stringLength: {
                        message: 'Email should be at least 3 characters long.',
                        min: 3,
                        max: 50
                    },
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[country]': {
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[countrydialcode]': {
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[secondaryCountrydialcode]': {
                enabled: false,
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[cityname]': {
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    stringLength: {
                        message: 'City Name should be at least 3 characters long.',
                        min: 3,
                        max: 25
                    },
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[firstname]': {

                validators: {
                    stringLength: {
                        message: 'First Name should be at least 3 characters long.',
                        min: 3,
                        max: 25
                    },
                    notEmpty: {message: 'This field should not be blank.'},
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[lastname]': {
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    stringLength: {
                        message: 'Last Name should be at least 3 characters long.',
                        min: 3,
                        max: 25
                    },
                    regexp: {regexp: onlyLetters, message: 'Only Letters allowed.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[contactNumber]': {
                validators: {
                    stringLength: {max: 25, message: 'Contact Number should be max 25 characters long.'},
                    notEmpty: {message: 'This field should not be blank.'},
                    regexp: {regexp: onlyNumbers, message: 'Contact Number is not valid.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[secondaryContactNumber]': {
                enabled: false,
                validators: {
                    stringLength: {max: 25, message: 'Contact Number should be max 25 characters long.'},
                    notEmpty: {message: 'This field should not be blank.'},
                    regexp: {regexp: onlyNumbers, message: 'Contact Number is not valid.'},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[plainPassword][first]': {
                validators: {
                    stringLength: {min: 8, message: 'Contact Number should be atleast 8 characters long.'},
                    notEmpty: {message: 'This field should not be blank.'},
                    securePassword: {
                        message: ' '
                    }
                }
            },
            'cms_frontuserbundle_frontuser[plainPassword][second]': {
                validators: {
                    identical: {
                        field: 'cms_frontuserbundle_frontuser[plainPassword][first]',
                        message: '<br>The password and confirm password are not the same.'
                    },
                    notEmpty: {message: ' '},
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[dateOfBirth]': {
                enabled: false,
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    blank: {}
                }
            },
            'cms_frontuserbundle_frontuser[terms]': {
                validators: {
                    notEmpty: {
                        message: 'This field should not be blank.'
                    },
                    choice: {
                        min: 1,
                        max: 1,
                        message: ' '
                    }
                }
            },

        }
    })
    .on('success.form.fv', function (e) {
        e.preventDefault();
        var grecaptcharesponse = $('#g-recaptcha-response').val();

        var $form = $(e.target),
            formId = '#' + $form[0].id;

        var valid = googleRecaptchaVerification();
        if (!valid) {
            $(formId).find('button[type=submit]').removeAttr('disabled').removeClass('disabled');
            return false;
        }
         $('#g-recaptcha-response').val(grecaptcharesponse);
        $form.hide();
        $(".login_loader").show();
        $.ajax({
            type: 'post',
            url: '',
            data: $(formId).serialize(),
            dataType: 'json',
            success: function (response) {
                $(".login_loader").hide();
                var fv = $(formId).data('formValidation');

                if (response.status == true) {

                    $form.hide();

                    var register_thanks_msg = $('.register_thanks_msg');

                    // Then reset the form
                    $('.alert-success').addClass('in');
                    //*********************
                    register_thanks_msg.show();
                    $('html, body').animate({
                        scrollTop: register_thanks_msg.offset().top
                    }, 800);
                    setTimeout(function () {
                        window.location = response.redirect_url;
                    }, 5000);

                } else {
                    $form.show();
                    $('.login_loader').hide();
                    if (response.message != '') {
                        $('.errors').html('<li>' + response.message + '</li>')
                    }
                    for (var field in response.errors) {
                        fv.updateMessage(field, 'blank', response.errors[field])
                            .updateStatus(field, 'INVALID', 'blank');
                    }
                    animateToError(response.errors);
                }
            }
        });
    });

这是我的表格图片：

当我点击机构时，它以黑色显示验证消息，在我点击提交按钮之前不会出现。

Answer 1

通过删除

修复了它

$('#register_form').formValidation('revalidateField', 'cms_frontuserbundle_frontuser[companyName]', true);

验证中的重新验证事件。

如何防止 Bootstrap 验证在表单提交前显示错误信息？

How to prevent Bootstrap validation to show error messages before form submit?

forms

jquery

bootstrapvalidator