web-dev-qa-db-ja.com

Asp.net MVC:複数の画像ファイルをアップロードしますか?

asp.net mvcに複数の画像ファイルをアップロードする方法の良い例はありますか? HttpPostedFileBaseを使用して1つのファイルをアップロードできることを知っています。 1つのボタンをクリックして複数のファイルをアップロードする方法はありますか?

以前、webformのajaxtoolboxでファイルのアップロードを使用し、その仕組みが好きでした。 MVCに同様の方法はありますか?または、これをうまく行える既存のコントロールはありますか?自由に制御できる方が良いですが、多少の費用がかかりますが大丈夫です。

ありがとう

17
urlreader

これを使用してください jQueryプラグイン

プラグイン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をチェックして、必要な操作を実行します。良い ドキュメント

[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 });
}
5
aleha

サンプルとして、POSTのコレクションを受け取るHttpPostedFileBase http動詞を使用してアクションを実装し、すべてのファイルを保存できます。

[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();
}

こちらもご覧ください

24
Felipe Oriani

私はこれを使用しています。 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(); 
}
1
Kadir

ファイルのアップロードに必要な基本的なビットの一部

注意キーワード:複数入力要素AND マルチパートフォーム要素

HTML側

@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();
}
0
Moji