Téléchargement de fichiers MVC 3 et liaison de modèles


91

J'ai un téléchargement de formulaire qui fonctionne mais je voudrais transmettre des informations de modèle pour ma base de données pour enregistrer le fichier sous un nom différent bien sûr.

Voici ma vue Razor:

@model CertispecWeb.Models.Container

@{
  ViewBag.Title = "AddDocuments";
}

<h2>AddDocuments</h2>

@Model.ContainerNo

@using (Html.BeginForm("Uploadfile", "Containers", FormMethod.Post, 
            new { enctype = "multipart/form-data" }))
{
    <input type='file' name='file' id='file' />
    <input type="submit" value="submit" />
}

Voici mon contrôleur:

[HttpPost]
public ActionResult Uploadfile(Container containers, HttpPostedFileBase file)
{
     if (file.ContentLength > 0)
     {
        var fileName = Path.GetFileName(file.FileName);
        var path = Path.Combine(Server.MapPath("~/App_Data/Uploads"),
                       containers.ContainerNo);
        file.SaveAs(path);
     }

     return RedirectToAction("Index");
}

Les informations du modèle ne sont pas transmises au contrôleur. J'ai lu que je pourrais avoir besoin de mettre à jour le modèle, comment dois-je procéder?


2
Reportez-vous à stackoverflow.com/questions/9411563/… pour un problème connexe
LCJ

Réponses:


123

Votre formulaire ne contient aucune balise d'entrée autre que le fichier, donc dans l'action de votre contrôleur, vous ne pouvez pas vous attendre à obtenir autre chose que le fichier téléchargé (c'est tout ce qui est envoyé au serveur). Une façon d'y parvenir serait d'inclure une balise cachée contenant l'id du modèle qui vous permettra de le récupérer à partir de votre banque de données à l'intérieur de l'action du contrôleur sur laquelle vous publiez (utilisez ceci si l'utilisateur n'est pas censé modifier le modèle mais joindre simplement un fichier):

@using (Html.BeginForm("Uploadfile", "Containers", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.HiddenFor(x => x.Id)
    <input type="file" name="file" id="file" />
    <input type="submit" value="submit" />
}

puis dans l'action de votre contrôleur:

[HttpPost]
public ActionResult Uploadfile(int id, HttpPostedFileBase file)
{
    Containers containers = Repository.GetContainers(id);
    ...
}

Par contre, si vous souhaitez autoriser l'utilisateur à modifier ce modèle, vous devrez inclure les champs de saisie appropriés pour chaque champ de votre modèle que vous souhaitez envoyer au serveur:

@using (Html.BeginForm("Uploadfile", "Containers", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    @Html.TextBoxFor(x => x.Prop1)
    @Html.TextBoxFor(x => x.Prop2)
    @Html.TextBoxFor(x => x.Prop3)
    <input type="file" name="file" id="file" />
    <input type="submit" value="submit" />
}

puis vous aurez le classeur de modèle par défaut reconstruire ce modèle à partir de la demande:

[HttpPost]
public ActionResult Uploadfile(Container containers, HttpPostedFileBase file)
{
    ...
}

1
Je reçois fileaussi nullet Request.Files.Countest 0, y aurait-il une différence si le formest un AjaxFormet il y routeValuesen a aussi?
bjan

8

Résolu

Modèle

public class Book
{
public string Title {get;set;}
public string Author {get;set;}
}

Manette

public class BookController : Controller
{
     [HttpPost]
     public ActionResult Create(Book model, IEnumerable<HttpPostedFileBase> fileUpload)
     {
         throw new NotImplementedException();
     }
}

Et vue

@using (Html.BeginForm("Create", "Book", FormMethod.Post, new { enctype = "multipart/form-data" }))
{      
     @Html.EditorFor(m => m)

     <input type="file" name="fileUpload[0]" /><br />      
     <input type="file" name="fileUpload[1]" /><br />      
     <input type="file" name="fileUpload[2]" /><br />      

     <input type="submit" name="Submit" id="SubmitMultiply" value="Upload" />
}

Notez que le titre du paramètre de l'action du contrôleur doit correspondre au nom des éléments d'entrée IEnumerable<HttpPostedFileBase> fileUpload->name="fileUpload[0]"

fileUpload doit correspondre


2
Cette solution est la seule solution que j'ai trouvée pour plusieurs fichiers. Merci d'avoir partagé votre code.
Rojan Gh.

6

Si vous n'avez pas toujours des images postées à votre action, vous pouvez faire quelque chose comme ceci:

[HttpPost]
public ActionResult Uploadfile(Container container, HttpPostedFileBase file) 
{
    //do container stuff

    if (Request.Files != null)
    {
        foreach (string requestFile in Request.Files)
        {
            HttpPostedFileBase file = Request.Files[requestFile]; 
            if (file.ContentLength > 0)
            {
                string fileName = Path.GetFileName(file.FileName);
                string directory = Server.MapPath("~/App_Data/uploads/");
                if (!Directory.Exists(directory))
                {
                    Directory.CreateDirectory(directory);
                }
                string path = Path.Combine(directory, fileName);
                file.SaveAs(path);
            }
        }
    }

} 

1

Pour plusieurs fichiers; notez le nouvel attribut " multiple " pour l'entrée:

Forme:

@using (Html.BeginForm("FileImport","Import",FormMethod.Post, new {enctype = "multipart/form-data"}))
{
    <label for="files">Filename:</label>
    <input type="file" name="files" multiple="true" id="files" />
    <input type="submit"  />
}

Manette:

[HttpPost]
public ActionResult FileImport(IEnumerable<HttpPostedFileBase> files)
{
    return View();
}

1

1er téléchargement du fichier jquery.form.js à partir de l'url ci-dessous

http://plugins.jquery.com/form/

Écrivez ci-dessous le code en cshtml

@using (Html.BeginForm("Upload", "Home", FormMethod.Post, new { enctype = "multipart/form-data", id = "frmTemplateUpload" }))
{
    <div id="uploadTemplate">

        <input type="text" value="Asif" id="txtname" name="txtName" />


        <div id="dvAddTemplate">
            Add Template
            <br />
            <input type="file" name="file" id="file" tabindex="2" />
            <br />
            <input type="submit" value="Submit" />
            <input type="button" id="btnAttachFileCancel" tabindex="3" value="Cancel" />
        </div>

        <div id="TemplateTree" style="overflow-x: auto;"></div>
    </div>

    <div id="progressBarDiv" style="display: none;">
        <img id="loading-image" src="~/Images/progress-loader.gif" />
    </div>

}


<script type="text/javascript">

    $(document).ready(function () {
        debugger;
        alert('sample');
        var status = $('#status');
        $('#frmTemplateUpload').ajaxForm({
            beforeSend: function () {
                if ($("#file").val() != "") {
                    //$("#uploadTemplate").hide();
                    $("#btnAction").hide();
                    $("#progressBarDiv").show();
                    //progress_run_id = setInterval(progress, 300);
                }
                status.empty();
            },
            success: function () {
                showTemplateManager();
            },
            complete: function (xhr) {
                if ($("#file").val() != "") {
                    var millisecondsToWait = 500;
                    setTimeout(function () {
                        //clearInterval(progress_run_id);
                        $("#uploadTemplate").show();
                        $("#btnAction").show();
                        $("#progressBarDiv").hide();
                    }, millisecondsToWait);
                }
                status.html(xhr.responseText);
            }
        });

    });


</script>

Méthode d'action: -

 public ActionResult Index()
        {
            ViewBag.Message = "Modify this template to jump-start your ASP.NET MVC application.";

            return View();
        }

 public void Upload(HttpPostedFileBase file, string txtname )
        {

            try
            {
                string attachmentFilePath = file.FileName;
                string fileName = attachmentFilePath.Substring(attachmentFilePath.LastIndexOf("\\") + 1);

           }
            catch (Exception ex)
            {

            }
        }
En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.