Asp.net 核心 3.1 - 通过 AJAX 调用使用列表 <object> 上传文件并将其发送到控制器

Question

public Class MainModel
{
    public IFormFile PDF { get; set; }

    public List<TempModel> List1{ get; set; }

    public List<TempModel1> List2 { get; set; }
}

public class TempModel
    {
        public string Prop1{ get; set; }
        public string Prop2{ get; set; }
    }
    public class TempModel1
    {
        public string Prop1{ get; set; }
        public string Prop2{ get; set; }
        public List<TempModel> list1 { get; set; }
    }

function AJAXCall()
{
var list1 = [{Prop1: "abcd",Prop2: "abcd1"},{Prop1: "abcd123",Prop2: "abcd456"}]

var list2 = [{Prop1: "abcd",Prop2: "abcd1",list1:list1 },{Prop1: "abcd123",Prop2: "abcd456",list1:list1}]
 formData.append("PDF", files[i]);
 formData.append("List1", list1);
 formData.append("List2", list2);
$.ajax({
            type: "POST",
            url: url,
            data: formData,
            processData: false,
            contentType: false,
            success: function (data) {
            }

        });
}

 public IActionResult Save([FromBody] MainModel model, IFormFile PDF)
{

}

我几乎什么都试过了。你能帮忙把这些细节发送到服务器端吗？在控制器中，我没有从 AJAX 调用中获得任何值。 URL 是正确的，它正在调用控制器操作方法，但值返回 null。

完成这个任务的正确方法是什么，因为我已经尝试了很多方法但都没有成功。

Answer 1

这是一个演示：

查看：

<input type="file" id="images" multiple />
<button onclick="AJAXCall()">ajax</button>
@section scripts{
    <script>
        function AJAXCall() {
            var formData = new FormData();
            var files = $("#images").get(0).files;
            formData.append('PDF', files[0]);
            
            var list1 = [{ Prop1: "abcd", Prop2: "abcd1" }, { Prop1: "abcd123", Prop2: "abcd456" }]

            var list2 = [{ Prop1: "abcd", Prop2: "abcd1", list1: list1 }, { Prop1: "abcd123", Prop2: "abcd456", list1: list1 }]
            for (var i = 0; i < list1.length; i++) {
                formData.append("List1[" + i + "].Prop1", list1[i].Prop1);
                formData.append("List1[" + i + "].Prop2", list1[i].Prop2);
            }
            for (var i = 0; i < list2.length; i++) {
                formData.append("List2[" + i + "].Prop1", list2[i].Prop1);
                formData.append("List2[" + i + "].Prop2", list2[i].Prop2);
                for (var j = 0; j < list1.length; j++) {
                    formData.append("List2[" + i + "].list1[" + j + "].Prop1", list1[j].Prop1);
                    formData.append("List2[" + i + "].list1[" + j + "].Prop2", list1[j].Prop2);
                }
            }
            $.ajax({
                type: "POST",
                url: "Save",
                data: formData,
                processData: false,
                contentType: false,
                success: function (data) {
                }

            });
        }
    </script>
}

控制器：

public IActionResult Save(MainModel model)
        {
            return Ok();
        }

结果：

Asp.net 核心 3.1 - 通过 AJAX 调用使用列表 <object> 上传文件并将其发送到控制器

Asp.net Core 3.1 - Upload File with List<object> via AJAX call & send it to Controller

ajax

asp.net-core

form-data

iformfile