<script type="text/javascript">
    $(document).ready(function(){
        $('#loginSubmit').click(function () {
            //start the ajax
            var f = $("#loginForm");
            request = $.ajax({
                //this is the php file that processes the data
                url: "app/index.php",
                type: "POST",
                data: f.serialize(),
                dataType:"json",
                cache: false
            });
            request.done(function (response, textStatus, jqXHR){
                // log a message to the console
                console.log("Hooray, it worked!");
                // callback handler that will be called on failure
                request.fail(function (jqXHR, textStatus, errorThrown){
                    // log the error to the console
                    console.error(
                        "The following error occured: "+
                        textStatus, errorThrown
                    );
                    alert("fail")
                });
                // callback handler that will be called regardless
                // if the request failed or succeeded
                request.always(function () {
                    // reenable the inputs
                    alert("ok")
                });
            });
        });
    });
</script>

<form id="loginForm" action="" method="post" name="loginForm">
    <h1>Login Form</h1>
    <div>
        <input type="text" placeholder="Email" required="" id="email" name="userEmail" />
    </div>
    <div>
        <input type="password" placeholder="Password" required="" id="userPassword" name="userPassword" />
    </div>
    <div>
        <input type="hidden" value="login" id="tag" name="tag" />
        <input type="submit" value="Log in" id="loginSubmit" name="loginSubmit" />
        <a href="#">Lost your password?</a>
    </div>
</form>

$('#loginform').submit(function(event){
    event.preventDefault();

    $.ajax({
        //this is the php file that processes the data
        url: $(this).attr("action"),
        type: "POST",
        data: $(this).serialize(),
        dataType:"json",
        cache: false
    })
        .done(function (response, textStatus, jqXHR){
            // log a message to the console
            console.log("Hooray, it worked!");
        })
        .fail(function (jqXHR, textStatus, errorThrown){
            // log the error to the console
            console.error(
                "The following error occured: " + textStatus,
                errorThrown
            );
            alert("fail");
        })
        .always(function () {
            // callback handler that will be called regardless
            // if the request failed or succeeded
            // reenable the inputs
            alert("ok");
        });
});

$('#loginSubmit').click(function (e) {
    e.preventDefault();
    ...
});

$('#loginSubmit').click(function () {
    ...
    return false;
});