jQuery Ajax 帖子未传递参数答案

【问题标题】：jQuery Ajax post not passing parametersjQuery Ajax 帖子未传递参数
【发布时间】：2011-06-30 15:05:56
【问题描述】：

我正在尝试使用 jQuery 的 $.ajax() 函数将表单变量发布到 MVC 路由。问题是，当代码执行我的 MVC 操作时，所有参数都为空，即使数据正在传递给它们：

jQuery：

$(function () {
    $('#signupform').submit(function (e) {
        e.preventDefault();

        if ($(this).valid()) {
            var postData = '{name : "' + $("#Name").val() + '", email : "' + $("#Email").val() + '", message : "' + $("#Message").val() + '" }';

            $.ajax({
                url: "/api/contact-form-post",
                data: postData,
                type: "get"
            })
            .complete(function (data) {
                $("#formContainer").html($("#formThankYou").html());
            });
        }
    });
});

调用 alert(postData) 输出如下：

{name : "Scott Smith", email : "scott@smith.com", message : "test message" }

MVC 动作：

public JsonResult ContactFormPost(string email, string name = "" , string message = "")
        {
            AddEmailToMailingList(email);

            if (!String.IsNullOrEmpty(name) && !String.IsNullOrEmpty(message))
            {
                InsertContactMessage(email, name, message);
            }

            return Json(true);
        }

使用 FireBug 检查请求会发现这是被调用的 URL。显然url参数格式不正确，但我不知道为什么。

http://localhost:10637/api/contact-form-post?{name%20:%20%22Scott%20Smith%22,%20email%20:%20%22scott@smith.com%22,%20message%20:%20%22Test%20message%22 %20}

我是否在这里犯了任何明显的错误，导致我的 ContactFormPost 方法的参数始终为空？

【问题讨论】：

标签： c# jquery asp.net-mvc ajax json

【解决方案1】：

取消引用postData，将 $.ajax 传递给真正的 JS 对象。

var postData = {
    name: $("#Name").val(),
    email: $("#Email").val(),
    message: $("#Message").val()
};

【讨论】：

【解决方案2】：

Trinidad 关于取消引用该对象是正确的。您只需要使用 ASP.NET AJAX 服务来执行此操作，该服务期望数据以 JSON 字符串的形式出现。

另一个问题是您的 return 语句需要明确允许 GET 动词，因为您正在尝试使用它：

return Json(true, JsonRequestBehavior.AllowGet);

【讨论】：

【解决方案3】：

Trinidad 是对的，但如果您必须发布 JSON，则使用 POST 方法，而不是 GET。

【讨论】：

【解决方案4】：

我有一个类似的问题，它可以在我的桌面上完美地发布在 chrome 和 safari 中，但是当我在移动 safari 中尝试它时，当它们到达我的 web 服务时，所有值都将为空。

原来是我的网址有问题，因为我的网络服务上有一个过滤器，它将所有路径重定向到一个带有尾随反斜杠的路径。

这将不在移动 safari 中工作，但在其他情况下......

$.ajax({
    ...
    url: 'foo',
    dataType: 'json',
    type: 'POST',
    ...
});

似乎 safari 不喜欢我的过滤器造成的临时重定向，并剥离了数据。为了让它工作，我必须在我的 ajax 调用的 url 后面加上斜杠。：

$.ajax({
    ...
    url: 'foo/',  // note the trailing slash
    dataType: 'json',
    type: 'POST',
    ...
});

更新：原来这不仅限于 JS。基本表单帖子在移动 Safari 上具有相同的行为。这会将空值传递给我的服务：

<form action="foo" method="POST">
    <input type="text" name="pleaseDontBeNull" value="swearImNotNull"/>
</form>

这可以正常工作：

<form action="foo/" method="POST">  <!-- note the trailing slash -->
    <input type="text" name="pleaseDontBeNull" value="swearImNotNull"/>
</form>

【讨论】：