I have a login form
inside a #myModal
body. The logging in functionality is fine except that if the incorrect username and password are entered, it does not redirect to the #myModal
with the respective error messages. It instead redirects to the default login
page. I don't know how to redirect to the modal
instead of the default login
page.
Modal
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">Modal title</h4>
</div>
<div class="modal-body">
<section id="loginForm">
@using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
{
@Html.AntiForgeryToken()
<h4>Use a local account to log in.</h4>
<hr />
@Html.ValidationSummary(true, "", new { @class = "text-danger" })
<div class="form-group">
@Html.Label("E-mail", new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.TextBox("email", "", new { @class = "form-control", @placeholder = "Email" })
</div>
</div>
<div class="form-group">
@Html.Label("Password", new { @class = "col-md-2 control-label" })
<div class="col-md-10">
@Html.Password("Password", "", new { @class = "form-control", @placeholder = "Password" })
</div>
</div>
<div class="form-group">
<div class="col-md-offset-2 col-md-10">
<input type="submit" value="Log in" class="btn btn-success" />
</div>
</div>
}
</section>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
Login Controller method
[HttpPost]
[AllowAnonymous]
[ValidateAntiForgeryToken]
public async Task<ActionResult> Login(LoginViewModel model, string returnUrl)
{
if (!ModelState.IsValid)
{
//how do I redirect back to the login modal if modelstate is invalid?
return View(model);
}
// This doesn't count login failures towards account lockout
// To enable password failures to trigger account lockout, change to shouldLockout: true
var result = await SignInManager.PasswordSignInAsync(model.Email, model.Password, model.RememberMe, shouldLockout: false);
switch (result)
{
case SignInStatus.Success:
return RedirectToLocal(returnUrl);
case SignInStatus.LockedOut:
return View("Lockout");
case SignInStatus.RequiresVerification:
return RedirectToAction("SendCode", new { ReturnUrl = returnUrl, RememberMe = model.RememberMe });
case SignInStatus.Failure:
default:
ModelState.AddModelError("", "Invalid login attempt.");
return View(model);
//how do I redirect back to the login modal?
}
}
Unfortunately you can't redirect a modal. A modal is part of the page/view. Even though you are clicking on the login button inside the modal, that button performs a POST, which will cause a redirect of the entire page. You will either need to do a POST to your login controller via ajax, or work a redirect into your application flow.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.