jQuery allways Post null to Action in MVC 4

Question

我有一个问题，我不知道是什么问题。
我正在构建一个 Json 对象，我想用$.ajax 将其发回。问题是我的 Action 总是为 null。
这是 Ajax 部分：

            $("input[type=button]#ajax-editor-save").click(function() {

            var hotelPropertyAssignModel = new Object();
            hotelPropertyAssignModel.Hotel_Id = 1;
            hotelPropertyAssignModel.HotelProperties = new Array();

            $("input.ajax-editor[data-edited=true]").each(function() {
                var hotelPropertyValue = new Object();
                hotelPropertyValue.HotelProperty_Id = $(this).attr("data-hotelPropertyId");
                hotelPropertyValue.Language = $(this).attr("data-lang");
                hotelPropertyValue.Value = $(this).attr("value");
                hotelPropertyAssignModel.HotelProperties.push(hotelPropertyValue);
            });

            $.ajax({
                url: '@Url.Action( "SetProperties" )',
                type: 'POST',
                dataType: 'json',
                data: JSON.stringify(hotelPropertyAssignModel)
            });
        });

这是行动：

[AcceptVerbs( HttpVerbs.Post )]
[HttpPost]
public void SetProperties ( string hotelPropertyAssignModel )
{

}

我将参数更改为字符串以验证 json 是如何出现的。当我用正确的模型替换它时，我也得到了 null！ 有人可以帮忙吗？

Answer 1

确保您设置了正确的 contentType：

$.ajax({
    url: '@Url.Action( "SetProperties" )',
    type: 'POST',
    contentType: 'application/json; charset=utf-8',
    data: JSON.stringify(hotelPropertyAssignModel)
});

您使用的dataType 参数表示响应类型，而不是请求类型。如果您的控制器操作正确设置 Content-Type 响应标头，则您不需要它，如果您返回例如 JsonResult，它通常会这样做。

但据我所知，您的控制器操作被声明为 void，这显然是错误的。控制器动作必须返回动作结果。如果您不关心内容，只需使用EmptyResult：

[AcceptVerbs( HttpVerbs.Post )]
[HttpPost]
public ActionResult SetProperties ( string hotelPropertyAssignModel )
{
    ...
    return new EmptyResult();
}

您的控制器操作还有另一个非常严重的问题。它采用字符串参数而不是视图模型！！！我不知道您如何期望将 JSON 请求绑定到某个字符串。

所以，立即定义一个与您愿意发送的 JSON 结构相匹配的视图模型：

public class HotelAssignmentViewModel
{
    public int Hotel_Id { get; set; } 
    public HotelPropertyViewModel[] HotelProperties { get; set; }
}

public class HotelPropertyViewModel
{
    public int HotelProperty_Id { get; set; }
    public string Language { get; set; }
    public string Value  { get; set; }
}

然后让您的控制器操作将此视图模型作为参数：

[AcceptVerbs( HttpVerbs.Post )]
[HttpPost]
public ActionResult SetProperties ( HotelAssignmentViewModel model )
{
    ...
    return new EmptyResult();
}

我还注意到您的代码存在另一个问题。您似乎订阅了某个 DOM 元素的 click 事件以触发 AJAX 请求，但您从未通过从该事件返回 false 来取消默认操作。因此，例如，如果这是一个提交按钮或一个锚点，它只会将浏览器重定向到远离页面的位置，让您的 AJAX 请求没有时间执行。因此，请确保通过单击处理程序返回 false 来取消此默认操作：

$("input[type=button]#ajax-editor-save").click(function() {
    ...
    return false;
});