在 asp.net mvc 身份中按下登录按钮时如何防止页面刷新（重新加载）？

Question

伙计们，我刚刚创建了一个 _Login 部分视图而不是 Login 视图，并在我的 _Layout 中呈现了该部分视图。部分视图显示在 Modal 中，直到一切看起来都正常！但是每当我单击“登录”（登录）按钮时，页面都会重新加载并且没有任何反应，尽管我预计会出现诸如电子邮件字段不能为空或用户不存在之类的错误，但令人惊讶的是没有任何反应并且页面会刷新。这是 _Login 部分的代码。

@model Hire.af.WebUI.Models.LoginViewModel

<div class="modal-body">
    <!--Social Media Login Links-->
    <div class="form-group row login-socical">
        <div class="col-sm-9 col-sm-offset-3">
            <div class="button_socical fb">
                <i class="fa fa-facebook-square"> </i>
                <em class="fa-facebook-square">Login with Facebook</em>
            </div>
            <div class="button_socical gg">
                <i class="fa fa-google-plus"> </i>
                <em class="fa-google-plus">Login with Google</em>
            </div>
            <div class="button_socical linkedin">
                <i class="fa fa-linkedin-square"> </i>
                <em class="fa-linkedin-square">Login with LinkedIn</em>
            </div>
        </div>
    </div>

    <!--Login Form-->
    <form class="noo-ajax-login-form form-horizontal">

        @using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
        {
            @Html.AntiForgeryToken()
            <hr />
            @Html.ValidationSummary(true, "", new { @class = "col-sm-3" })
            <div class="form-group row">
                @Html.LabelFor(m => m.Email, new { @class = "col-sm-3 control-label" })
                <div class="col-sm-9">
                    @Html.TextBoxFor(m => m.Email, new { @class = "log form-control", @placeholder="Email OR Username" })
                    @Html.ValidationMessageFor(m => m.Email, "", new { @class = "text-danger" })
                </div>
            </div>
            <div class="form-group row">
                @Html.LabelFor(m => m.Password, new { @class = "col-sm-3 control-label" })
                <div class="col-sm-9">
                    @Html.PasswordFor(m => m.Password, new { @class = "pwd form-control", @placeholder="Password" })
                    @Html.ValidationMessageFor(m => m.Password, "", new { @class = "text-danger" })
                </div>
            </div>
            <div class="form-group">
                <div class="col-md-offset-2 col-md-10">
                    <div class="checkbox">
                        @Html.CheckBoxFor(m => m.RememberMe)
                        @Html.LabelFor(m => m.RememberMe)
                    </div>
                </div>
            </div>

             <!--Remember Me Checkbox-->
                <div class="form-actions form-group text-center">
                    <button type="submit" class="btn btn-primary">Sign In</button>
                    <div class="login-form-links">
                        <span><a href="#"><i class="fa fa-question-circle"></i> Forgot Password?</a></span>
                        <span>
                            Don't have an account yet?
                            <a href="#" class="member-register-link" data-rel="registerModal">
                                @Html.ActionLink("Register Now", "Register") <i class="fa fa-long-arrow-right"></i>
                            </a>
                        </span>
                    </div>
                </div>

            @* Enable this once you have account confirmation enabled for password reset functionality
            <p>
                @Html.ActionLink("Forgot your password?", "ForgotPassword")
            </p>*@
        }


    </form>
</div>

下面是我如何在我的 _Layout 中渲染这个部分。

<div class="memberModalLogin modal fade" id="userloginModal" tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-member">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h4 class="modal-title">Login</h4>
                </div>
                <!--Login Partial Goes Here-->
                @Html.Partial("_Login")
            </div>
        </div>
    </div>

如有任何帮助，我们将不胜感激。

Answer 1

您的嵌套表单无效 html 且不受支持。从局部视图中删除外部形式

<form class="noo-ajax-login-form form-horizontal"> // remove this and its closing tag
    @using (Html.BeginForm(....

在 asp.net mvc 身份中按下登录按钮时如何防止页面刷新（重新加载）？

How can i prevent page refresh (reload) while pressing login button in asp.net mvc identity?

asp.net-mvc

identity

modal-dialog