Asp.net MVC:上传多个图片文件?

时间:2014-09-10 18:04:28

标签: asp.net-mvc asp.net-mvc-4 file-upload image-uploading

有一个很好的例子,说明如何在asp.net mvc中上传多个图像文件?我知道我们可以使用HttpPostedFileBase上传一个文件。有没有办法通过单击一个按钮上传多个文件?

我之前在webform中的ajaxtoolbox中使用了文件上传,并且喜欢它的工作原理。在MVC中有类似的方式吗?或者,是否有现成的控制可以很好地做到这一点?自由控制更好,但即使花费一些钱也可以。

由于

4 个答案:

答案 0 :(得分:24)

您可以使用POST http动词实现一个动作,以接收HttpPostedFileBase的集合并保存所有文件,样本:

[HttpPost]
public ActionResult Upload(IEnumerable<HttpPostedFileBase> files) 
{
    foreach (var file in files)
    {
        file.SaveAs(Server.MapPath("~/Update/" + file.FileName));
    }

    return View();
}

或者,您可以阅读Request.Files并执行相同的工作,

[HttpPost]
public ActionResult Upload() 
{
    foreach (var file in Request.Files)
    {
        file.SaveAs(Server.MapPath("~/Update/" + file.FileName));
    }

    return View();
}

另见

答案 1 :(得分:5)

使用此jQuery plugin

只需包含插件js文件,创建标签:

<input type='file' multiple id='fileUpload' name="files[]" data-url="@Url.Action("Upload","Home")" />

(IE9除外,它不允许在选择对话框中选择多个文件)

添加一些JavaScript:

$(function () {
    $('#fileUpload').fileupload({
        dataType: 'json',
        done: function (e, data) {
            $.each(data.result.files, function (index, file) {
                $('<p/>').text(file.name).appendTo(document.body);
            });
        }
    });
});

在控制器操作中,只需检查Request.Files并执行任何操作。 这是一个很好的documentation

[HttpPost]
public JsonResult Upload() 
{
    foreach (var file in Request.Files)
    {
        if(file.ContentLength > 0)
        {
            file.SaveAs(Server.MapPath("~/Upload/" + file.FileName));
        }
    }

    return Json(new { result = true });
}

答案 2 :(得分:1)

我正在使用这个。 https://www.fyneworks.com/jquery/multiple-file-upload/

<input type="file" name="file" class="multiple" /> 

[HttpPost] 
public ActionResult Upload()  
{
    if (Request.Files.Count > 0)
    {
          foreach(var file in Request.Files) {  }
    }

    return View(); 
}

答案 3 :(得分:0)

文件上传所需的一些基本位

注意关键字:输入元素AND中的多个 表单元素

中的多部分

HTML Side

@using (Html.BeginForm("MyUpload", "MyController", FormMethod.Post, new { enctype = "multipart/form-data" })) { 
    <input type="file" name="myFiles" multiple />
    <button class="btn btn-default">Upload</button>   
}

控制器

[HttpPost]
public ActionResult MyUpload(IEnumerable<HttpPostedFileBase> myFiles)
{
    foreach (var file in myFiles)
    {
        if (file != null && file.ContentLength > 0)
        {
            //handle files;
        }
    }
    return View();
}