Невозможно загрузить несколько файлов

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 Я получаю только один файл.

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, как вы можете прочитать здесь.

Вы можете изменить настройки кода клиента 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 + '%');
        });
});

и все должно работать как положено.