return httppost 之后的部分视图 asp.net mvc

Question

我正在 asp.net mvc

创建网络应用程序

我有一个重设密码的部分视图，它在 bootstrap 模式中打开，

现在 HttpPost 我有一个如下所示的 if 条件

if (string.IsNullOrEmpty(model.NewPassword))
{
    TempData["PMessage"] = CustomHelper.Translate("Please Enter new Password");
    return PartialView(model);
}

但我的主要 url 正在更改为如下所示的局部视图

http://localhost:8080/User/ResetPassword

这里ResetPassword是我的局部视图名称

我的部分视图如下所示

@(Html.BeginForm("ResetPassword", "User", FormMethod.Post))
{
<div class="modal-dialog modal-sm">
    <!-- Modal data-->
</div>
}

我完整的post方法

[HttpPost]

public ActionResult ResetPassword(ResetPasswordModel model)
{
    if (string.IsNullOrEmpty(model.NewPassword))
    {
        TempData["PMessage"] = "Please Enter new Password";
        return PartialView(model);
    }
    //if success
    return RedirectToAction("Index");
}

我怎样才能避免这种情况，我只想加载模态而不是整个页面，

这里可以修复什么？

或者我应该进行客户端验证吗？

页面流详细

这是我的页面的样子

如果用户点击重置密码，下面的 bootstrap 模态出现

如果用户单击“确定”，无需输入任何数据，post 方法已被调用并且页面被重定向到 resetpassword.cshtml，因为我返回如下

return PartialView(model);

如果我只想刷新modal/partial控制器验证视图，我需要做什么

Answer 1

您正在发出正常的 HTTP 请求，它用于处理常规浏览器调用（如表单提交）和 return 完整的 HTML 页面给客户端。

在您的情况下，您必须发出 ajax 请求来处理 ResetPassword post 方法以避免重定向。

<!-- modal placeholder-->
<div id='myModal' class='modal fade in'>
    <div class="modal-dialog">
        <div class="modal-content">
            <div id='myModalContent'></div>
        </div>
    </div>
</div>

此 url return 您的重置表单并将其加载到 modalcontent

<a href="@Url.Action("Reset", "Account", new { class = "resetpassword" })" ></a>


$(function () {
            $(document).on("click", "a.resetpassword", function (e) {
                $('#myModalContent').load(this.href, function () {
                    $('#myModal').modal({
                        /*backdrop: 'static',*/
                        keyboard: true
                    }, 'show');
                    bindForm(this);
                });
                return false;
            });
        });

        function bindForm(dialog) {
            $('form', dialog).submit(function (e) {
                e.preventDefault();
                if ($('#resetFormId').valid()) {
                    $.ajax({
                        url: this.action,
                        type: this.method,
                        data: $(this).serialize(),
                        success: function (result) {
                            if (result.success) {
                                $('#myModal').modal('hide');
                            } else {
                                $('#myModalContent').html(result);
                                bindForm(dialog);
                            }
                        }
                    });
                }
                return false;
            });
        }

return httppost 之后的部分视图 asp.net mvc

return partialview after httppost asp.net mvc

asp.net-mvc

bootstrap-modal

partial-views