我们如何通过 Jquery 从 MVC 中的 FormData 映射一个 c# 复杂列表对象

Question

我的控制器中有一个列表对象。我需要将此 List 对象与在来自 FormData 的 Ajax 调用中传递给控制器的数据进行映射。我使用 FormData 的原因是，我需要在同一 ajax 调用中从视图中获取一些文件。

请在下面找到我的代码

 public class AdModel
{
    public PartsAd PartsAdModel { get; set; }
    public List<HttpPostedFileBase> AdImages { get; set; }
}
public class PartsAd
{
    public List<Vehicle> VehicleList { get; set; }
}
public class Vehicle
{
    public string VehicleBrand { get; set; }
}

下面是我在控制器中的操作方法

 public ActionResult AjaxPostAd(AdModel adModel)
    {
    }

下面是我的Jquery代码

var applicableVehicleBrands = $('#multiSelectApplicableVehicleBrand option:selected');
    var selectedBrand = 0;
    $(applicableVehicleBrands).each(function () {
        data.append("adModel[PartsAdModel.VehicleList[" + selectedBrand + "].VehicleBrand]", $(this).val())
        selectedBrand = selectedBrand + 1;
    });
 $.ajax({
    cache: false,
    type: "post",
    async: true,
    url: "" + ajaxPostURL + "",
    data: data,
    contentType: false,
    processData: false,
    success: function (data) {});

但是在我的控制器中，当我寻找 adModel.PartsAdModel.VehicleList 时，它是空的

有人可以帮我吗？

Answer 1

要使模型绑定起作用，您的表单数据应该具有同名的属性

PartsAdModel.VehicleList[{n}].VehicleBrand

其中 {n} 是您要发送的车辆项目数组的从零开始的索引。

您不需要在表单数据项名称中使用 adModel 前缀，因为模型绑定器不会关心您在 HttpPost 操作方法中使用的参数名称。

下面的代码应该可以工作。我只是为 VehicleList 属性硬编码了 2 个项目。您可以更新它，以便它根据您的 DOM 输入动态添加项目（在循环中）。

var data = new FormData();

data.append("PartsAdModel.VehicleList[0].VehicleBrand", "Honda");
data.append("PartsAdModel.VehicleList[1].VehicleBrand", "Toyota");

// Add the uploaded file
// Assuming you have a file input with name="AdImages"
$('input[name="AdImages"]').each(function(a, b) {
    var fileInput = $('input[name="AdImages"]')[a];
    if (fileInput.files.length > 0) {
        var file = fileInput.files[0];
        data.append("AdImages", file);
    }
});


$.ajax({
    type: "post",
    url: '@Url.Action("AjaxPostAd")',
    data: data,
    contentType: false,
    processData: false
}).done(function(r) {
    console.log('ajax call done');
});

我们如何通过 Jquery 从 MVC 中的 FormData 映射一个 c# 复杂列表对象

How can we map a c# complex list object from FormData in MVC through Jquery

ajax

asp.net-mvc

jquery

multipartform-data

form-data