Hi all,

I am just getting started with MVC so be gentle.

I am trying to redirect members to a different login page if the login from the navbar fails. I am using the login code snippet for a Partial View (with minor stylistic modifications)

@inherits Umbraco.Web.Mvc.UmbracoTemplatePage

@using System.Web.Mvc.Html
@using ClientDependency.Core.Mvc
@using Umbraco.Web
@using Umbraco.Web.Models
@using Umbraco.Web.Controllers

@{
    var loginModel = new LoginModel();

    Html.EnableClientValidation();
    Html.EnableUnobtrusiveJavaScript();
    Html.RequiresJs("/umbraco_client/ui/jquery.js");
    Html.RequiresJs("/umbraco_client/Application/JQuery/jquery.validate.min.js");
    Html.RequiresJs("/umbraco_client/Application/JQuery/jquery.validate.unobtrusive.min.js");
}

@using (Html.BeginUmbracoForm<UmbLoginController>("HandleLogin", null, new { id = "loginForm" }))
{
    <fieldset>
        @Html.ValidationSummary(true, "Oops! Invalid username or password.", new { @class = "text-danger" })

        <div class="input-group input-group-sm">
            <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span>
            @Html.TextBoxFor(m => loginModel.Username, new { @class = "form-control", placeholder = "Username", })
        </div>
        <div class="text-danger text-right small">
            @Html.ValidationMessageFor(m => loginModel.Username)
        </div>

        <div class="input-group input-group-sm">
            <span class="input-group-addon"><span class="glyphicon glyphicon-lock"></span></span>
            @Html.PasswordFor(m => loginModel.Password, new { @class = "form-control", placeholder = "Username", })
        </div>
        <div class="text-danger text-right small">
            @Html.ValidationMessageFor(m => loginModel.Password)
        </div>

        <br />
        <div class="ui-group-buttons ui-group-buttons-split-right" style="width:150px">
            <button class="btn btn-primary btn-sm">Login</button>
            <div class="split">
                <span class="glyphicon glyphicon-log-in"></span>
            </div>
            <a href="#" class="btn btn-primary btn-sm disabled"></a>
        </div>
    </fieldset>  
}

I have given the form an 'id' and I can hook into the jQuery invalid-form event as such

$('#loginForm').bind('invalid-form.validate', function (e) {
     e.preventDefault();
     window.location.href = "/login/"
});

and that works if one of the fields is invalid, but not for a failed login attempt. How do I listen for a failed login attempt and then redirect when that happens?

Thanks!