Question

EDIT

Ok, so I can login fine but when I enter false info I’m redirected to the login page, what I need is to stay on the same page and show the error message e.preventDefault(); doesn’t seem to work.

   $(function() { 
    $("#login-form").submit(function(e) { 
        $('.fail').hide();
        $.ajax({  
            url:"/login",
            type: "post",  
            data: $(this).serialize(),
            error:function(){
                $('.fail').show();
                e.preventDefault();
            },
            success: function(){ 
                document.location = '/'; 
                }
        });
        return false; 
    });
});

Answer 1

Your not actually doing anything with the form, ill try commenting your code to talk you through whats happening.

I’m guessing your using PHP server side for this code.

In PHP you want to check the user credentials and then tell the browser. If the login was successful send back "y", and if it failed "n".

<script type="text/javascript">
$(function() { 
    $("#login-form").submit(function() { 
        $('.fail').hide();
        $.ajax({  
            url:"/login",
            type: "post",  
            data: $(this).serialize(),
            error:function(){
                $('.fail').show();
            },
            success: function(data) {
                if (data == "y") {
                   //Login was successful. Redirect statement here?
                } else {
                   //Failed login message here
                }
            }
        });
        return false; 
    });
});
</script>

Edit

Try adding this in your success function. Please let me know what you get for a successful login and a failed login.

success: function(data) {
    console.log(data);
}

Edit 2

This is because your ajax call is successful, just that the login failed. This is why your success handler is called.

To sort this you’ll need to see what is being returned from the server, is it nothing? In which case try:

success: function(data) {
    if (data == "") {
        e.preventDefault();
    } else {
        //Login successful, redirect user.
    }
}