Uploader Multi Fichier Blueimp avec ASP.NET MVC 3

Question

J'essaie d'ajouter Fichier Blueimp Télécharger sur une application MVC et je 'm Avoir des problèmes avec la réception des fichiers dans la post-action (im aller à la fonctionnalité de téléchargement de fichiers multiples)

À mon avis, j'ai le code suivant:

<form id="file_upload" enctype="multipart/form-data" action="Home/SaveFile" method="post">    
   <input type="file" name="file" multiple="true"/>
   <button>Upload</button>
   <div>Upload files</div>        
</form>
<br />
###############################
<table id="files">
</table>

<button id="start_uploads">Start uploads</button>
<button id="cancel_uploads">Cancel uploads</button>

Le code JQuery pour le téléchargement de fichier Blueimp est le suivant:

$(document).ready(function () {

        $('#file_upload').fileUploadUI({
            uploadTable: $('#files'),
            downloadTable: $('#files'),
            buildUploadRow: function (files, index) {
                return $('<tr><td class="file_upload_preview"><\/td>' +
                        '<td>' + files[index].name + '<\/td>' +
                        '<td class="file_upload_progress"><div><\/div><\/td>' +
                        '<td class="file_upload_start">' +
                        '<button class="ui-state-default ui-corner-all" title="Start Upload">' +
                        '<span class="ui-icon ui-icon-circle-arrow-e">Start Upload<\/span>' +
                        '<\/button><\/td>' +
                        '<td class="file_upload_cancel">' +
                        '<button class="ui-state-default ui-corner-all" title="Cancel">' +
                        '<span class="ui-icon ui-icon-cancel">Cancel<\/span>' +
                        '<\/button><\/td><\/tr>');
            },
            buildDownloadRow: function (file) {
                return $('<tr><td>' + file.name + '<\/td><\/tr>');
            },
            beforeSend: function (event, files, index, xhr, handler, callBack) {
                handler.uploadRow.find('.file_upload_start button').click(callBack);
            }
        });
        $('#start_uploads').click(function () {
            $('.file_upload_start button').click();
        });
        $('#cancel_uploads').click(function () {
            $('.file_upload_cancel button').click();
        });
    });

et à l'intérieur du contrôleur la méthode d'action suivante:

[AcceptVerbs(HttpVerbs.Post)]
    public ActionResult SaveFile(IEnumerable<HttpPostedFileBase> files)
    {
        foreach (HttpPostedFileBase file in files)
        {
            //some file upload magic                
        }
        return View("MyView");
    }

J'utilise MVC 3.

Dans la méthode d'action, si l'argument est de type IEnumerable, il reçoit NULL et si l'argument est de type httppostedfilebase, il reçoit les fichiers de manière étrange et la méthode d'action ne fonctionne pas comment elle est supposée.

Tout type d'aide est très apprécié, merci.

acclamations!

Answer 1

The SaveFile controller action will be called for each file. So it should look like this:

[HttpPost]
public ActionResult SaveFile(HttpPostedFileBase file)
{
    //some file upload magic

    // return JSON
    return Json(new
    {
        name = "picture.jpg",
        type = "image/jpeg",
        size = 123456789
    });
}

And if you want to handle multiple upload files in the same request you may take a look at the respective section of the documentation.

Answer 2

To get the files you could use,

foreach (string inputTagName in Request.Files)
{                
    HttpPostedFileBase file = Request.Files[inputTagName];
}

Answer 3

I know that this is an old issue, but just to point in here. In addition to Darin Dimitrov post - returned json should be in format compatible with jQuery File Upload - which expects array even if one file is transmitted. For example:

        return Json(
            new
            {
                files = new[]{
                                new { 
                                        name = "www.png",
                                        size = "1234567"
                                    }
                              }
            }
        );