return jsonresult 与 jquery post 的行为异常答案

【问题标题】：return jsonresult behaves unexpextedly with jquery postreturn jsonresult 与 jquery post 的行为异常
【发布时间】：2010-12-21 21:58:21
【问题描述】：

好的，请帮忙，我对这个问题感到很沮丧。

当用户点击提交按钮时，我需要设置错误值或执行重定向。（它是一个标准的登录表单）。我需要用 ajax 来做。

我认为它几乎可以正常工作，但是当用户单击提交时，页面只会显示： {"redirect":"/Home/Index"}

或 {"error":"提供的用户名或密码不正确。"}

它没有重定向/显示我想要的错误。

一些背景 - 表单是一个登录表单，它被放置在一个模态弹出对话框中。(jqueryui)

这是我的 jquery：

$("#submit").click(function () {
            $.post({
                url: "Account/LogOn",
                dataType: "json",
                success: function (data) {
                    if (data.redirect) {
                        // data.redirect contains the string URL to redirect to
                        window.location.href = data.redirect;
                    }
                    else {
                        // data.form contains the HTML for the replacement form
                        $("#error").replaceWith(data.error);
                    }
                }
            });
            return false;
        });

这是我的 Action 方法：

[HttpPost]
    public JsonResult LogOn(LogOnModel model, string returnUrl)
    {
        if (ModelState.IsValid)
        {
            if (MembershipService.ValidateUser(model.UserName, model.Password))
            {
                FormsService.SignIn(model.UserName, model.RememberMe);
                if (Url.IsLocalUrl(returnUrl))
                {
                    return Json(new { redirect = returnUrl });
                }
                else
                {
                    return Json(new { redirect = "/Home/Index" });
                }
            }

        }
        return Json(new { error = "The user name or password provided is incorrect." });
    }

这是我的表格：

@using (Html.BeginForm("LogOn", "Account"))
{

    <div>
        <fieldset>
            <legend>Account Information</legend>

            <div class="editor-label">
                @Html.LabelFor(m => m.UserName)
            </div>
            <div class="editor-field">
                @Html.TextBoxFor(m => m.UserName)
                @Html.ValidationMessageFor(m => m.UserName)
            </div>

            <div class="editor-label">
                @Html.LabelFor(m => m.Password)
            </div>
            <div class="editor-field">
                @Html.PasswordFor(m => m.Password)
                @Html.ValidationMessageFor(m => m.Password)
            </div>

            <div class="editor-label">
                @Html.CheckBoxFor(m => m.RememberMe)
                @Html.LabelFor(m => m.RememberMe)
            </div>

            <p>
                <input id="submit" type="submit" value="Log On" />
            </p>
        </fieldset>
    </div>
}

【问题讨论】：

为什么不能从控制器HttpPost 进行重定向？（例如RedirectToAction - 这也满足 PRG 模式）。为什么需要返回 JSON 然后在客户端做呢？
也许我可以做重定向，但我还需要涵盖通过 ajax 显示错误的情况。在这种情况下，我无法重定向到另一个页面，因为登录表单位于模式对话框中
您确定您的点击功能正在运行吗？关于您的描述，听起来表格是以通常的方式提交的。在函数底部使用api.jquery.com/event.preventDefault。
对不起，当然在函数顶部^^
我也很好奇 json 返回值的“值”。它如何在更大的计划中发挥作用？纯粹是为了处理错误部分吗？如果是这样，我会很想用标准的局部视图（加上重定向操作）来做到这一点，而不是使管道复杂化。也就是说，我很可能遗漏了一些微妙的东西。

标签： c# jquery asp.net-mvc

【解决方案1】：

哎呀，整个 $.post() 调用都是错误的。

使用这个：

$("#submit").click(function (e) {e.preventDefault();
            $.post( "Account/LogOn",
                    $(this.form).serialize(),
                    function (data) 
                    {
                      if (data.redirect) 
                      {
                        // data.redirect contains the string URL to redirect to
                        window.location.href = data.redirect;
                      }
                      else 
                      {
                        // data.form contains the HTML for the replacement form
                        $("#error").replaceWith(data.error);
                      }
                    },
                    'json'
            );
            return false;
        });

您已经使用了 $.ajax() 中预期的参数表示法，但在 $.post() 中却不同。

【讨论】：