JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.12.0/jquery.validate.js"></script>
<div class="formContainer">
    <form class="form" id="loginForm" method="post">
        <div class="form-group">
            <label>Login</label>
        </div>
        <div class="form-group">
            <label for="loginForm-email">Email address</label>
            <input type="email" class="form-control" id="loginForm-email" name="loginForm-email" placeholder="Enter email">
        </div>
        <div class="form-group">
            <label for="loginForm-password">Password</label>
            <input type="password" class="form-control" id="loginForm-password" name="loginForm-password" placeholder="Password">
        </div>
        <button type="submit" class="btn btn-primary">Submit</button>
    </form>
</div>

JavaScript

$(document).ready(function () {
    $("#loginForm").validate({
        rules: {
            "loginForm-email": {
                required: true,
                email: true
            },
                "loginForm-password": {
                required: true,
                minlength: 5
            }
        },
        submitHandler: function () {
            console.log("inside valid");
            window.location.reload(true);
            window.location.href = '../html/userPage.html';
            // this.submit()
        },
        invalidHandler: function (event, validator) {
            // 'this' refers to the form
            console.log("Please fill the form");
        }


    });

});