通过 MVC4 中的表单发布 JSON 数据

Question

我正在尝试向我的 MVC 控制器发布一个 JSON 对象（一个 JSON 化的淘汰模型，如果有任何相关性），并让控制器返回一个新视图。为此，我使用表单发送数据。问题是我希望在控制器收到 JSON 时自动将其转换为模型。

如果我为此使用 AJAX 调用，

var actionModel = new Object();
actionModel.Controls = ko.toJS(self.controls());
var json = JSON.stringify(actionModel);
$.ajax({
    url: "MyController/Preview",
    type: "POST",
    contentType: 'application/json; charset=utf-8',
    cache: false,
    data: json,
    success: function (data) {
    }
});

...JSON 对象已成功反序列化并转换为我的模型类的实例。

public ActionResult Preview(ActionModel actionModel) { ... }
public class ActionModel
{
    public List<ControlModel> Controls { get; set; }
}

如果我想使用表单执行此操作，我知道我需要将 JSON 插入隐藏的输入字段，但这样做时我能做到的最好的方法是将数据作为序列化字符串接收：

@using (Html.BeginForm("Preview", "MyController", FormMethod.Post, new { id = "previewForm" }))
{
    <input type="hidden" id="hiddenFieldName" />
}

public ActionResult Preview(string hiddenFieldName) { ... }

我可以在之后反序列化它，但如果 MVC 可以为我转换它，我真的更喜欢它，就像使用 AJAX 调用一样。这可能吗？

谢谢。

Answer 1

假设您想使用表单而不是 XHR 发布编码为 json 的数据，我认为它不可能开箱即用。

表单不允许使用多种内容类型。 http://www.w3.org/TR/html401/interact/forms.html#form-content-type

如果您将 json 作为字符串发布，则可能会创建一个模型绑定器来查找看起来是 json 的字符串并在那里处理反序列化。不是最漂亮的东西，特别是如果这只是为了一些奇怪的情况。

Answer 2

您可以捕获表单发布事件并重建您自己的帖子，而不是手动反序列化，添加额外的 JSON 对象。这是一个使用来自this post 的serializeObject 方法的示例：

$(document).ready(function () {
    $('form').live('submit', function (e) {
        e.preventDefault();

        var dataToPost = $(this).serializeObject();
        dataToPost.hiddenFieldName = actionModel; //additional object here
        $.ajax({
            type: $(this).attr('method'),
            url: $(this).attr('action'),
            data: JSON.stringify(dataToPost),
            contentType: 'application/json; charset=utf-8',
            success: function (res) {
                //do something...
            }
        });
    });
});