web-dev-qa-db-fra.com

Télécharger plusieurs fichiers en un seul formulaire MVC4

J'essaie de télécharger plusieurs images sur un seul formulaire

@using (Html.BeginForm("Create", "AdminRestaurants", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
<div class="form-group">
    <label for="logoFile" class="col-sm-2 control-label">Logo:</label>
    <div class="col-sm-6">
        <input type="file" multiple="" name="logoFile" id="logoFile" />
    </div>
</div>
<div class="form-group">
    <label for="fohFile" class="col-sm-2 control-label">FOH Logo:</label>
    <div class="col-sm-6">
        <input type="file" multiple="" name="fohFile" id="fohFile" />
    </div>
</div>
<div class="form-group">
    <label for="bohFile" class="col-sm-2 control-label">BOH Logo:</label>
    <div class="col-sm-6">
        <input type="file" multiple="" name="bohFile" id="bohFile" />
    </div>
</div>
<div class="form-group">
    <label for="mgmFile" class="col-sm-2 control-label">MGM Logo:</label>
    <div class="col-sm-6">
        <input type="file" multiple="" name="mgmFile" id="mgmFile" />
    </div>
</div>

J'essaie de traiter le formulaire sur le contrôleur avec cette

public ActionResult Create(IEnumerable<HttpPostedFileBase> files, RestaurantModel collection)
{
    if (ViewData.ModelState.IsValid)
    {
    }
}

Actuellement, rien ne s'affiche dans la signature files sur le contrôleur. Cela semble bien fonctionner quand on ne travaille qu'avec un seul fichier

public ActionResult Create(HttpPostedFileBase file, EventsModel collection)

Est-ce que quelqu'un peut me diriger dans la direction pour permettre à plusieurs fichiers d'être téléchargés avec un seul formulaire de soumission?

c#asp.net-mvcasp.net-mvc-4file-upload
10
Jon Harding

Votre problème est que votre formulaire crée une demande de publication avec des informations que le classeur de modèle peut lier, car la convention de dénomination n'est pas correcte.

vous voyez, vous avez 4 champs de fichier avec chacun un nom différent, pour que le classeur de modèle les lie correctement, la signature de votre action contrôleur doit ressembler à ceci:

public ActionResult Create(HttpPostedFileBase mgmFile, 
                           HttpPostedFileBase logoFile, 
                           HttpPostedFileBase fohFile ,
                           HttpPostedFileBase bohFile)

Suivre le modèle de conception MCV La meilleure option serait d’utiliser un ViewModel contenant un IEnumerable<HttpPostedFileBase> Et de créer un modèle d’éditeur personnalisé pour un IEnumerable<HttpPostedFileBase>.

afin que vous puissiez l'utiliser comme ça:

Html.EditorFor(m=>Model.filesUploaded)

et votre action de contrôleur ressemblerait à ceci:

public ActionResult Create(MyViewModel i_InputModel)
{
    i_InputModel.filesUploade; //Use the files here to upload them.
}

Les autres options sont les suivantes: Utilisez l'attribut HTML5 multiple dans le champ de saisie du fichier, comme suit:

<label for="mgmFile" class="col-sm-2 control-label">Files:</label>
<div class="col-sm-6">
    <input type="file" multiple="multiple" name="files" id="files" />
</div>

et une action de contrôleur comme celle-ci:

public ActionResult Create(HttpPostedFileBase files)

ou utiliser plusieurs champs de fichier mais les indexer dans leur nom:

<input type="file" multiple="multiple" name="files[0]" id="files_1" />
<input type="file" multiple="multiple" name="files[1]" id="files_2" />
<input type="file" multiple="multiple" name="files[2]" id="files_3" />
<input type="file" multiple="multiple" name="files[3]" id="files_4" />

et alors vous pourriez utiliser une action de contrôleur comme ceci:

public ActionResult Create(IEnumerable<HttpPostedFileBase> files)
18
Mortalus

Cela ne fonctionnerait que si vos entrées de fichier avaient des noms indexés comme files[0], files[1], files[2], ... 

Afin de comprendre comment la liaison de modèle à une liste fonctionne dans asp.net mvc, je vous recommande de lire ce message: Liaison de modèle à une liste

Vous n'avez même pas besoin d'utiliser la liaison de modèle pour obtenir les fichiers. Utilisez Request.Files dans votre action pour les obtenir.

public ActionResult Create(EventsModel collection)
{
    var files = Request.Files;
    // rest of the code...
}
3
ataravati
<td>
      <input type="file" name="files" id="files" multiple="multiple" />
      </td>

Comme ici, je montre avec un exemple simple: http://www.infinetsoft.com/Post/How-to-create-multiple-fileUpload-using-asp-net-MVC-4/1229#.V0J-yfl97IU

0
Thivan Mydeen