ajax - asp.net mvc 部分 View 重定向或显示错误

Question

我有一个登录小部件，它是一个部分 View ，当出现问题时，我希望用模型验证错误来更新它，否则应该重新加载页面。

我有以下内容

LogOn.cshtml

@{
    var ajaxOpts = new AjaxOptions {OnSuccess = "success"};
}

<div id="login">
    @Html.ValidationSummary(excludePropertyErrors: true)

    <h2>Start by Logging in</h2>

    @using (Ajax.BeginForm("LogOn", "Account", ajaxOpts))
    {
        @Html.Hidden("returnUrl", Request.Url.PathAndQuery)

        <table width="100%" border="0" cellspacing="0" cellpadding="5">
            <tr>
                <td>
                    <span class="bluey">Username:</span><br />
                    @Html.TextBoxFor(m => m.UserName, new {tabindex = "1", Class = "field"})
                    @Html.ValidationMessageFor(m => m.UserName, "*")
                </td>
                <td>
                    <span class="bluey">Password:</span><br />
                    @Html.TextBoxFor(m => m.Password, new {tabindex = "2", Class = "field"})
                    @Html.ValidationMessageFor(m => m.Password, "*")
                </td>
            </tr>
            <tr>
                <td>
                    <input name="login" type="submit" value="Submit" class="input_btn" tabindex="3" />
                </td>
                <td>@Html.CheckBoxFor(m => m.RememberMe) @Html.LabelFor(m => m.RememberMe) <span class="bluey">&nbsp; | &nbsp;</span> @Html.ActionLink("Forgot Password?", "Password", "User")</td>
            </tr>
        </table>
    }
</div>

<script>
    function success(context) {
        //var returnUrl = context.get_data().returnUrl;
        //if (returnUrl) {
        //    window.location.href = returnUrl;
        //} else {
            $("#login").replaceWith(context);
        //}

    }

</script>

被调用的操作是

    [HttpPost]
    public ActionResult LogOn(LogOnModel userDetails, string returnUrl)
    {
        if (ModelState.IsValid)
        {
            if (Membership.ValidateUser(userDetails.UserName, userDetails.Password))
            {
                FormsAuthentication.SetAuthCookie(userDetails.UserName, userDetails.RememberMe);

                return Redirect(returnUrl);
            }
            ModelState.AddModelError("", "The username or password provided was incorrect");
        }

        return PartialView(userDetails);
    }

我让它工作，这样当数据不正确时，部分 View 会重新显示错误，但是只有当我注释掉成功(上下文)中用户成功登录时存在的其他 JavaScript 行时，此部分才有效该页面应该被重定向。

有更好的方法吗？

我确实尝试使用 Json() 返回具有状态属性和 returnUrl 或 Html 的匿名对象，但是我无法弄清楚如何将 PartialView(userDetails) 生成的 html 获取到 Json() 中打电话，无论如何，这似乎都是错误的处理方式。

Answer 1

您无法在 AJAX 调用中重定向。您可以从服务器返回一个指向要重定向的 url 的 JSON 对象，然后在成功回调中执行实际的重定向。

function success(result) {
    if (result.returnUrl) {
        // the controller action returned JSON
        window.location.href = returnUrl;
    } else {
        // the controller action returned a partial
        $('#login').html(result);
    }
}

现在，在您的 Controller 操作中，如果成功，只需返回返回网址而不是重定向:

return Json(new { returnUrl = returnUrl });

顺便说一句，您似乎已经在 View 中获得了返回 URL:Request.Url.PathAndQuery。我不认为将其传输到服务器并返回有什么意义。您可以简单地返回一些指示成功的 JSON bool 值，并在成功回调中执行到 url 的重定向。