Login Modal - How to handle incorrect password / credentials? I'm developing a site in Craft 2, using a modal to display the login form. The modal can be seen by clicking the Login button at top right. 

I'm essentially using the form as outlined in the Craft 2 docs here. But it's not set up to work properly with a modal behavior. Currently, if a user types the wrong password credentials, the form still executes, refreshing to the homepage. It's only when the user once again clicks the "login" button that the modal is once again revealed, now showing the error message.

How might I check whether the user's credentials are valid before submitting the form? If credentials are incorrect, I'd like to prevent execution of the form and keep the modal on screen for the user to try again.

Thanks
You may use some ajax to send your form so your modal will not validate and/or close and your page wont reload.

Here's a working example of what you will need to do in JS (this example use jQuery):

$('#yourFormId').submit( function (e ) {
      e.preventDefault();
      var data = $(this).serialize();
      $.ajax({
        method: 'POST',
        url: '/',
        data: data,
        headers: {'Content-Type': 'application/x-www-form-urlencoded'}
      })
    .success(function(data) {
          console.log('success', data);
    })
      .error(function(data) {
        console.log('error', data);
      });
    });


If validation errors happen, you will see that in the data object folowwing the .error.