jquery - 使用 ASP.NET MVC 6 中的文件进行 Ajax 表单提交

Question

我正在使用jquery-ajax-unobtrusive要添加到 previously existing tag helpers 的库用于快速创建通过 ajax 请求提交的表单。

这给了我这样的东西:

<form id="person-create" enctype="multipart/form-data" asp-controller="Person" asp-action="Create" asp-route-id="1" data-ajax="true" data-ajax-method="POST" role="form">
    <!-- There are other inputs for the other items. -->
    <input id="photo-upload" asp-for="Photo" type="file">
</form>

表单提交得很好，除了表单中的文件输入总是带有空值这一事实之外。作为测试，我将表单转回不使用 ajax，并且所有内容都正确提交。我还尝试通过直接调用 jQuery 的 .ajax 函数来手动执行提交，但是，这也遇到了与使用 jquery-ajax-unobtrusive 相同的问题。

我的 Controller 端点如下所示:

public async Task<IActionResult> Create(int id, PersonViewModel person)
{
  // Do stuff...
}

在 PersonViewModel 中，我有一个看起来像这样的类:

public class PersonViewModel
{
  public int PersonId { get; set; }
  public string Name { get; set; }
  public IFormFile Photo { get; set; }
}

我只是错过了一些明显的东西，还是通过 Ajax 表单提交提交文件时存在本质上的不同？

Answer 1

根据 Stephen 的评论，jquery.unobtrusive-ajax 不能用于提交文件。相反，应该使用 jQuery .ajax() 方法和 FormData 来实现此目的。

有关详细信息，请参阅 Stephen's answer on another question .