如何在不返回asp.net中的视图的情况下验证表单?

时间:2019-06-15 15:15:28

标签: c# asp.net-mvc asp.net-mvc-partialview

我创建了一个下拉菜单,用户可以从导航栏登录,而无需按下登录按钮并重定向到帐户/登录。这是在局部视图中完成的,并呈现在_layout.cshtml中的导航栏中。部分视图如下所示:



´´´
@using Microsoft.AspNet.Identity
@model Rent_a_Car.Models.LoginViewModel

@{

    if (Request.IsAuthenticated)
    {
        using (Html.BeginForm("LogOff", "Account", FormMethod.Post, new { id = "logoutForm", @class = "navbar-right" }))
        {
            @Html.AntiForgeryToken()

            <ul class="nav navbar-nav navbar-right">


                <div class="dropdown">
                    <a class="btn btn-secondary dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        @User.Identity.GetUserName()
                    </a>

                    <div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
                        @Html.ActionLink("My account", "Index", "Manage", routeValues: null, htmlAttributes: new { title = "Manage", @class = "dropdown-item" })
                        <a class="dropdown-item disabled" href="#">My orders</a>
                        <div class="dropdown-divider"></div>
                        <a class="dropdown-item" href="javascript:document.getElementById('logoutForm').submit()">Log off</a>

                    </div>
                </div>



                <li></li>
            </ul>
        }
    }
    else
    {
        <div class="dropleft">

            <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Log-In </button>
            <div class="dropdown-menu" aria-labelledby="dropdownMenuButton" style="width: 300px">

                @* form starting *@

                @using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
                {
                    @Html.AntiForgeryToken()

                    @Html.ValidationSummary(true, "", new { @class = "text-danger" })


                    <div class="col-lg-12">
                        <div class="text-center">
                            <h3><b>Log In</b></h3>
                        </div>
                        <form id="ajax-login-form" method="post" role="form" autocomplete="off">
                            <div class="form-group">
                                <label for="username">Username</label>
                                @Html.TextBoxFor(m => m.Email, new { @class = "form-control", @placeholder = "Email" })
                            </div>

                            <div class="form-group">
                                <label for="password">Password</label>
                                @Html.PasswordFor(m => m.Password, new { @class = "form-control", @placeholder = "Password" })
                            </div>

                            <div class="form-group">
                                <div class="col-xs-5">


                                    <input type="submit" name="Login" id="login-submit" tabindex="4" class="form-control btn btn-danger" value="Log In">
                                </div>
                            </div>


                            <div class="col-xs-5" align="Center">
                                @Html.CheckBoxFor(m => m.RememberMe)
                                <label for="remember"> Remember Me</label>
                            </div>


                            <div class="form-group">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="text-center">
                                            <a tabindex="5" class="forgot-password">Forgot Password?</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>

                }
                @*form ending*@

            </div>
        </div>
    }


}


@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")

}

´´´

这是控制器。如您所见,当验证失败时,我将返回模型,这是我不想要的。

 public async Task<ActionResult> Login(LoginViewModel model, string returnUrl)
        {
            if (!ModelState.IsValid)
            {
                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);
            }
        }

我只需要确认错误消息出现在下拉菜单上,而无需将我重定向到另一个页面。我怎么能做到这一点?

1 个答案:

答案 0 :(得分:0)

其他人问的最大问题是,为什么不使用javascript调用api进行登录,例如使用ajax post

$.post("your api here",
{
    userName: "",
    password: "",
    rememberMe: ""
},function(data, status){
     //show user what ever
});

此代码非常简单,但是,如果由于任何“我不知道”的原因而无法使用javascript,您将拥有下面的长代码以及现有控制器上的一些实现

我会解释

您将必须在表单中添加一个ReturnUrl,并将登录表单更改为此

@using Microsoft.AspNet.Identity
@model Rent_a_Car.Models.LoginViewModel
@{
if (Request.IsAuthenticated)
{
    using (Html.BeginForm("LogOff", "Account", new { returnUrl = Request.Url.PathAndQuery }, FormMethod.Post, new { id = "logoutForm", @class = "navbar-right" }))
    {
        @Html.AntiForgeryToken()            
        <ul class="nav navbar-nav navbar-right">
            <div class="dropdown">
                <a class="btn btn-secondary dropdown-toggle" href="#" role="button" id="dropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                    @User.Identity.GetUserName()
                </a>
                <div class="dropdown-menu" aria-labelledby="dropdownMenuLink">
                    @Html.ActionLink("My account", "Index", "Manage", routeValues: null, htmlAttributes: new { title = "Manage", @class = "dropdown-item" })
                    <a class="dropdown-item disabled" href="#">My orders</a>
                    <div class="dropdown-divider"></div>
                    <a class="dropdown-item" href="javascript:document.getElementById('logoutForm').submit()">Log off</a>
                </div>
            </div>
        </ul>
    }
}
else
{
    <div class="dropleft">
        <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Log-In </button>
        <div class="dropdown-menu" aria-labelledby="dropdownMenuButton" style="width: 300px">
            @* form starting *@
            @using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
            {
                @Html.AntiForgeryToken()
                <p>@ViewBag.error</p>@*Display the error here*@
                <div class="col-lg-12">
                    <div class="text-center">
                        <h3><b>Log In</b></h3>
                    </div>
                    <form id="ajax-login-form" method="post" role="form" autocomplete="off">
                        <div class="form-group">
                            <label for="username">Username</label>
                            @Html.TextBoxFor(m => m.Email, new { @class = "form-control", @placeholder = "Email" })
                        </div>
                        <div class="form-group">
                            <label for="password">Password</label>
                            @Html.PasswordFor(m => m.Password, new { @class = "form-control", @placeholder = "Password" })
                        </div>
                        <div class="form-group">
                            <div class="col-xs-5">
                                <input type="submit" name="Login" id="login-submit" tabindex="4" class="form-control btn btn-danger" value="Log In">
                            </div>
                        </div>
                        <div class="col-xs-5" align="Center">
                            @Html.CheckBoxFor(m => m.RememberMe)
                            <label for="remember"> Remember Me</label>
                        </div>
                        <div class="form-group">
                            <div class="row">
                                <div class="col-lg-12">
                                    <div class="text-center">
                                        <a tabindex="5" class="forgot-password">Forgot Password?</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            }
            @*form ending*@
        </div>
    </div>
}
@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

然后在您的Account Controller中,将重定向返回到用户当前所在的视图,因为它是重定向,所以您必须将模型放入TempData中,这就是{{1 }}和其他一些模型错误可能对您不起作用,因此您需要进行验证。

@Html.ValidationSummary(true, "", new { @class = "text-danger" })

现在这是您要做的事。

您需要转到用户可能首先按下的所有可能的控制器(我将为您提供所有控制器的建议),并获取public async Task<ActionResult> Login(LoginViewModel model, string returnUrl) { if (!ModelState.IsValid) { //here send back the error and the model with validation message to any view TempData["LoginModel"] = model; TempData["LoginError"] = "Incorrect details"; return Redirect(returnUrl); } 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: TempData["LoginModel"] = model; TempData["LoginError"] = "Invalid login attempt"; return Redirect(returnUrl); } } (模型)和错误。您的TempData的{​​{1}}方法例如:

Index