我正在尝试添加发送到我的服务器的 POST 请求的一些额外数据。最初，我只发送了几种形式的信息:

$.ajax({
    url: 'SaveAllDetails',
    type: 'POST',
    data: $('form').serialize(),
    dataType: 'json'
});

和 MVC Controller 方法:

[HttpPost]
public ActionResult SaveAllDetails([Bind(Prefix = "order")]ExistingOrderDetailsModel existingOrderDetailsModel, 
    [Bind(Prefix = "task")]ExistingTaskDetailsModel existingTaskDetailsModel, [Bind(Prefix = "device")]DeviceDetailsModel deviceDetailsModel)
{
    ....
}

这很好用。 MVC 的模型绑定(bind)器能够正确反序列化 URL 编码的字符串。

现在，要求发生了变化。我需要连同我的三个表单一起发送一组额外的数据。此数据数组不保存在表单中，也没有绑定(bind)前缀。我需要在同一个 Controller 方法中完成这一切，因为所有验证都需要在单个事务内执行。

所以，我现在有:

var subcomponentsGridRows = JSON.stringify(subcomponentsDetailsView.getAllGridData());
var existingOrderDetailsFormData = $('form#existingOrderDetailsForm').serialize();
var existingTaskDetailsFormData = $('form#existingTaskDetailsForm').serialize();
var deviceDetailsFormData = $('form#existingDeviceDetailsForm').serialize()

$.ajax({
    url: 'SaveAllDetails',
    type: 'POST',
    data: {
        existingOrderDetailsModel: existingOrderDetailsFormData,
        existingTaskDetailsModel: existingTaskDetailsFormData,
        deviceDetailsModel: deviceDetailsFormData,
        subcomponentsGridRows: subcomponentsGridRows
    },
    dataType: 'json'
});

这至少有一个原因行不通。每个表单都表示为 URL 编码的字符串。 subcomponentsGridRows 是一个 JSON 结构。据我所知，MVC 模型绑定(bind)器无法一次性破译这两种类型的信息。

解决这个问题的好方法是什么？

最佳答案

您可能会找到 following plugin有用。

以下是它可能对您有用的地方。让我们首先通过定义 View 模型来清理 Controller 操作:

public class MyViewModel
{
    public ExistingOrderDetailsModel Order { get; set; }
    public ExistingTaskDetailsModel Task  { get; set; }
    public DeviceDetailsModel Device  { get; set; }

    public AdditionalRowsViewModel[] AdditionalRows { get; set; }
}

在此示例中，AdditionalRowsViewModel 显然会保存您尝试传递给 Controller ​​操作的附加信息。

然后您的 Controller 操作将变为:

[HttpPost]
public ActionResult SaveAllDetails(MyViewModel model)
{
    ....
}

好吧，这一步是绝对必要的，只是当我看到一个 Controller Action 采用超过 1 个参数时，我只是定义了一个 View 模型。

最后让我们调整我们的 AJAX 调用:

$.ajax({
    url: 'SaveAllDetails',
    type: 'POST',
    contentType: 'application/json',
    data: JSON.stringify({
        order: $('form#existingOrderDetailsForm').serializeObject(),
        task: $('form#existingTaskDetailsForm').serializeObject(),
        device: $('form#existingDeviceDetailsForm').serializeObject(),
        additionalRows: subcomponentsDetailsView.getAllGridData()
    }),
    success: function(result) {
        // do something with the result of the AJAX call here
    }
});

注意事项:

1. 在您的 AJAX 请求中删除此 dataType: 'json' 参数。您正在使用 ASP.NET MVC，并且希望您正在从 Controller 操作返回一个 Jsonresult，该操作已成功将 Content-Type 响应 header 设置为正确的值。 jQuery 足够智能，可以使用此响应 header 的值并预处理将传递给 AJAX 请求的 success 回调的 result 变量。所以在这种情况下，您将已经获得一个 javascript 对象
2. 由于您在 AJAX 请求中将 JSON 发送到服务器，因此您需要正确指定 contentType: application/json 参数。否则，您如何期望 ASP.NET MVC 知道客户端正在发送 JSON 并应用正确的模型绑定(bind)器？顺便说一句，jQuery 将发送的默认 Content-Type 请求 header 是 application/x-www-form-urlencoded，因此如果您在 POST 请求中发送 JSON 负载，那将是冲突和违规协议(protocol)。

关于c# - 将序列化表单数据和附加数据发布到 MVC Controller ？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21766348/