Question

我正在尝试使用jquery AJAX发布具有List<IFormFile>的嵌套视图模型，但是IFormFile属性在模型上始终为空。

这是我的嵌套模型（IFormFile在ChildModel内部）：

public class ParentViewModel
{
   public string ParentName{ get; set; }

   public ChildModel Child{ get; set; }
}

ChildModel类：

public class ChildModel 
{
   public string ChildName{ get; set; }

   public IList<IFormFile> Images{ get; set; }
}

控制器方法：

[HttpPost]
public async Task<bool> CompleteAppointment(ParentViewModel viewModel)
{
// save logic
return true;
}

视图（这是局部视图。此处没有表格，需要在ajax调用中传递文档）：

    @model SomeOtherViewModel
    
    <div class="row">
     //controls using SomeOtherViewModel
    </div>

    <div class="row">
      <div class="col-md-6">
          <div>
             <span class="font-weight-bold">Child Name</span><br />
             <div class="pt-2 pb-2"><input id="name" type="text" class="form-control" /></div>
             <input type="file" id="images" multiple />
           </div>
       </div>
    </div>

JavaScript代码：

function save(){

    var formData = new FormData();
    formData.append("ParentName", "Anne");
    formData.append("Child[ChildName]", "Sam");

    var files = $("#images").get(0).files;

    for (var i= 0; i< files.length; i++) {
        formData.append("Child[Images]", files[i]);
    }

    $.ajax({
            url: "FamilyController/Save",
            type: "POST",
            data: formData,
            processData: false,
            contentType: false,
            success: function (data) {}
     );
}

viewModel.ChildModel.Images始终为null。我尝试过formData.append("Child[Images][i]", files[i]);，将IFormFile添加到包装器类中，然后在子级中使用它，以及其他一些选择。但是没有一个。

但是，有线连接是，如果我将public IList<IFormFile> Images{ get; set; }添加到ParentViewModel并附加为formData.append("Images", files[i]);，则文件将在控制器中可用。

我在这里想念什么？非常感谢您的帮助。

Answer 1

这是一个演示作品：

控制器：

public IActionResult ModalPartial() {
            return View();
        }
        public IActionResult Save(ParentViewModel pdata) {
            return View();
        }

ModalPartial.cshtml：

<div class="row">
    <div class="col-md-6">
        <div>
            <span class="font-weight-bold">Child Name</span><br />
            <div class="pt-2 pb-2"><input id="name" type="text" class="form-control" /></div>
            <input type="file" id="images" multiple />
        </div>
        <button onclick="save()">save</button>
    </div>
</div>
@section scripts{
    <script type="text/javascript">
        function save(){
            var pdata = new FormData();
            pdata.append('ParentName', 'Anne');
            pdata.append('Child.ChildName', 'Sam');
           
                var files = $("#images").get(0).files;
            for (var i = 0; i < files.length; i++) {
                pdata.append('Child.Images', files[i]);
            }
            
          

            $.ajax({
                url: "Save",
                type: "POST",
                data: pdata ,
                processData: false,
                
                contentType: false,
                success: function (data) { }
            });
    }
    </script>
}

结果：

ASP.NET Core嵌套的IFormFile列表始终为null

1 个答案: