Search code examples
htmlasp.net-mvcbootstrap-4umbraco

display div on failed login in html, using Umbraco amd MVC


I have a div in which I want to display a login error message only when a failed login is attempted. The call to do the login is

[HttpPost]
        [ValidateAntiForgeryToken]
        public ActionResult HandleLoginSubmit(LoginModel model)
        {
            if (!ModelState.IsValid)
            {
                return CurrentUmbracoPage();
            }

            if (Membership.ValidateUser(model.Username, model.Password))
            {
                FormsAuthentication.SetAuthCookie(model.Username, createPersistentCookie: false);
                return Redirect(model.ReturnUrl ?? "/login");

            }
            else
            {

                ModelState.AddModelError(nameof(model.Username), "Incorrect UserName");
                ModelState.AddModelError(nameof(model.Password), "Incorrect password");
                return CurrentUmbracoPage();


            }
        }

and the div is

<div class="col-lg-10 alert alert-danger justify-content-around mt-2" style="margin-left:auto; margin-right:auto;">
            <div class="container">
                <div class="alert-icon">
                    <i class="material-icons">error_outline</i>
                </div>
                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                    <span aria-hidden="true"><i class="material-icons">clear</i></span>
                </button>
                <b>Error Alert: </b>
            </div>
        </div>

What should I return from the call if the login is successful, and how do I reference it in the html?


Solution

  • Seems like your version of Umbraco is 7.x. With the following controller name and the method name, for example:

    public class RecoverUserDataSurfaceController : SurfaceControllerBaseController
    { 
        [HttpPost]
        public ActionResult SubmitEmailForPasswordReset(UserModel model)
        {
            if (!ModelState.IsValid)
            {
                return CurrentUmbracoPage();
            }
    
            bool success = _recoverUnpwWorkflow.RecoverPasswordSubmitEmail(model);
            TempData.Add("Success", success);
    
            return RedirectToCurrentUmbracoPage();
        }
    }
    

    The html should be:

    <form method="post" id="form-lost-password">
    @using(Html.BeginUmbracoForm<UmbracoApp.Controllers.RecoverUserDataSurfaceController>("SubmitEmailForPasswordReset"))
    {
        <div class="text-field validate-email required">
            <label for="EmailAddress">Email Address</label>
            @Html.ValidationMessageFor(x => x.EmailAddress)
            @Html.TextBoxFor(x => x.EmailAddress, new { @placeholder = "name@domain.com" })
        </div>
        <div class="submit-field">
            <input type="submit" value="Submit" title="Submit" class="btn-default" />
        </div>
    }
    </form>
    

    Hope that helps.