无法上传多个文件

Question

我正在使用ASP.NET MVC 5,jquery最新版本。 我正尝试使用jquery fileupload上传多个文件，但我无法接收多个文件。

查看：

<input id="fileupload" type="file" multiple="multiple" name="files[]" > 

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('#fileupload').fileupload({ 
      dataType: 'json', 
      url: '/Media/UploadFiles', 
      autoUpload: true, 
      done: function (e, data) { 

      } 
     }).on('fileuploadprogressall', function (e, data) { 
      var progress = parseInt(data.loaded/data.total * 100, 10); 
      $('.progress .progress-bar').css('width', progress + '%'); 
     }); 
    }); 
</script> 

控制器：

[HttpPost] 
     public ContentResult UploadFiles() 
     { 

      foreach (string file in Request.Files) 
      { } 
     } 

在这里，在Request.Files我recieving只有一个文件。

Answer 1

您上传的文件实际上是一个接一个发送的。

您可以更改服务代码

[HttpPost] 
public JsonResult UploadFiles() 
{ 
    IList<string> filesSaved = new List<string>(); 

    foreach (string file in Request.Files) 
    { 
    HttpPostedFileBase hpf = Request.Files[file]; 
    if (hpf.ContentLength > 0) 
    { 
     var fileName = hpf.FileName; 
     filesSaved.Add(fileName); 
    } 
    } 

    return Json(new {files = filesSaved}, JsonRequestBehavior.DenyGet); 
} 

，并插入一个断点，你会看到，请求经过一次为每个文件要发送。

问题出在您的客户端代码中。该插件singleFileUploads中有一个选项，默认为true，因为您可以阅读here。

你可以改变你的客户端代码中设置singleFileUploads: false：

$(document).ready(function() { 
     $('#fileupload').fileupload({ 
      dataType: 'json', 
      url: '/Media/UploadFiles', 
      autoUpload: true, 
      singleFileUploads: false, 
      done: function (e, data) { 

      } 
     }).on('fileuploadprogressall', function (e, data) { 
      var progress = parseInt(data.loaded/data.total * 100, 10); 
      $('.progress .progress-bar').css('width', progress + '%'); 
     }); 
}); 

，并如预期正常工作了。