javascript - 对于 Controller 的 Ajax Post 方法，参数作为空值传入

Question

我有这段代码在点击时触发。当我在 SaveNewProduct 处设置断点时，所有值都为空。我试图创建一个输入对象，我试图手动添加每个属性，但没有任何效果。我可以得到任何提示或建议吗？

var input = {
    name: name,
    type: type,
    description: description,
    category: category,
    file: file.files[0],
    acronym: acronym
};

$.ajax({
    type: "POST",
    url: '/Admin/SaveNewProduct',

    processData: false,
    data: {
        name: name,
        type: type,
        description: description,
        category: category,
        file: file.files[0],
        acronym: acronym,
        input: input
    },
    success: function (response) {
        alert("saved okay");
    }
});

[HttpPost]
public async Task<ActionResult> SaveNewProduct(SaveNewProductInput input)
{
    ...
    //breakpoint here, input values are all null
    ...
}

保存新产品输入.cs

public class SaveNewProductInput
{
    public string Name { get; set; }
    public string Acronym { get; set; }
    public string Type { get; set; }
    public string Category { get; set; }
    public string Description { get; set; }
    public HttpPostedFileBase File { get; set; }
}

我也尝试删除 processData，但出现此错误 Uncaught TypeError: Illegal invocation

Answer 1

您需要使用 FormData 发送请求中的文件，并将 processData 和 contentType 设置为 false

var formData = new FormData();
formData.append("name", name);
formData.append("type", type);
formData.append("description", description);
formData.append("category", category);
formData.append("file", file.files[0]);
formData.append("acronym", acronym);

$.ajax({
    url: "/Admin/SaveNewProduct",
    type: "POST",
    data: formData,        
    processData: false,
    contentType: false,
    success: function (response) {
        alert("saved okay");
    }
});