Mengunggah file MVC 3 dan mengikat model


91

Saya memiliki unggahan formulir yang berfungsi tetapi saya ingin meneruskan informasi model ke database saya untuk menyimpan file dengan nama yang berbeda tentunya.

Inilah tampilan Razor saya:

@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" />
}

Ini Controller saya:

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

Informasi model tidak diteruskan ke pengontrol. Saya telah membaca bahwa saya mungkin perlu memperbarui model, bagaimana saya melakukannya?


2
Lihat stackoverflow.com/questions/9411563/… untuk masalah terkait
LCJ

Jawaban:


123

Formulir Anda tidak berisi tag input apa pun selain file sehingga dalam tindakan pengontrol Anda, Anda tidak dapat mengharapkan apa pun selain file yang diunggah (hanya itu yang dikirim ke server). Salah satu cara untuk mencapai ini adalah dengan memasukkan tag tersembunyi yang berisi id model yang akan memungkinkan Anda untuk mengambilnya dari datastore Anda di dalam tindakan pengontrol yang Anda posting (gunakan ini jika pengguna tidak seharusnya memodifikasi model tetapi cukup lampirkan file):

@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" />
}

dan kemudian dalam tindakan pengontrol Anda:

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

Di sisi lain, jika Anda ingin mengizinkan pengguna untuk memodifikasi model ini, maka Anda perlu menyertakan bidang masukan yang tepat untuk setiap bidang model Anda yang ingin Anda kirim ke server:

@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" />
}

dan kemudian Anda akan memiliki pengikat model default untuk merekonstruksi model ini dari permintaan:

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

1
Saya mendapatkan filesebagai nulldan Request.Files.Countadalah 0 juga, apakah akan ada perbedaan jika formadalah AjaxFormdan ada routeValuesjuga?
bjan

8

Terpecahkan

Model

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

Kontroler

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

Dan Lihat

@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" />
}

Perhatikan judul parameter dari action controller harus sesuai dengan nama elemen input IEnumerable<HttpPostedFileBase> fileUpload->name="fileUpload[0]"

fileUpload harus cocok


2
Solusi ini adalah satu-satunya solusi yang saya temukan untuk banyak file. Terima kasih telah membagikan kode Anda.
Rojan Gh.

6

Jika Anda tidak selalu memiliki gambar yang diposting untuk tindakan Anda, Anda dapat melakukan sesuatu seperti ini:

[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

Untuk banyak file; perhatikan " multiple atribut " untuk masukan:

Bentuk:

@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"  />
}

Pengontrol:

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

1

Pertama unduh file jquery.form.js dari url di bawah ini

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

Tulis kode di bawah ini di 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>

Metode tindakan: -

 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)
            {

            }
        }
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.