jQuery check if BootstrapValidator passed

Question

I want my Laravel's login page to show a spinning circle and a message "You're being logged in" inside the "Login" button after it was pressed. OK so far, however, I'd need to validate first whether bootstrap validator passes all input. This is my JS:

$("#loginSubmit").click(function() { $("#button_login_content").replaceWith("You're being logged in &nbsp;<i class=\"fas fa-spinner fa-spin\"></i>"); $("#loginSubmit").prop("disabled", true); $("#authentication").submit(); });

loginSubmit is the submit button's id. button_login_content is a div inside the button which then is altered by $("#button_login_content").replaceWith("You're being logged in &nbsp;<i class=\"fas fa-spinner fa-spin\"></i>");. authentication is the form's name. So far, it does what I want. However, entering nothing or invalid data and hitting submit leads to red warnings shown beneath the input fields (which is also what I want) but doesn't prevent the button from changing its content and so on. This is why I thought that I needed to check something like this [pseudocode]:

if(!bootstrapValidator.checked()) return;

before actually running the rest of $("#loginSubmit").click(). I actually googled and didn't find anything. I tried myself various things such as the code above. Is there a way to check this? This is my validator:

$("#authentication").bootstrapValidator({
        fields: {
            username: {
                validators: {
                    notEmpty: {
                        message: 'The email address is required'
                    },
                    regexp: {
                        regexp: /^\S+@\S{1,}\.\S{1,}$/,
                        message: 'Please enter valid email format'
                    }
                }
            },
            password: {
                validators: {
                    notEmpty: {
                        message: 'Password is required'
                    }

                }
            }

        }
    });

Answer 1

This is the solution:

var validator = $("#authentication").data("bootstrapValidator"); validator.validate(); if(!validator.isValid()) { return; }