Cara menulis "Html.BeginForm" di Razor


133

Jika saya menulis seperti ini:

form action = "Images" method = "post" enctype = "multipart / form-data"

berhasil.

Tapi di Razor dengan '@' itu tidak berhasil. Apakah saya melakukan kesalahan?

@using (Html.BeginForm("Upload", "Upload", FormMethod.Post, 
                             new { enctype = "multipart/form-data" }))
{
    @Html.ValidationSummary(true)

    <fieldset>

        Select a file <input type="file" name="file" />
        <input type="submit" value="Upload" />

    </fieldset>
}

Kontroler saya terlihat seperti ini:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Upload() 
{
    foreach (string file in Request.Files)
    {
        var uploadedFile = Request.Files[file];
        uploadedFile.SaveAs(Server.MapPath("~/content/pics") + 
                                      Path.GetFileName(uploadedFile.FileName));
    }

    return RedirectToAction ("Upload");
}

Apakah tindakan itu sebenarnya "gambar" atau apakah itu "Unggah / Unggah"?
J. Steen

sebenarnya saya punya dua pengendali. pengontrol gambar dengan aksi 'gambar' .. dan pengontrol unggah 'dengan aksi unggah ..
kk-dev11

Jawaban:


200

Kode berikut berfungsi dengan baik:

@using (Html.BeginForm("Upload", "Upload", FormMethod.Post, 
                                      new { enctype = "multipart/form-data" }))
{
    @Html.ValidationSummary(true)
    <fieldset>
        Select a file <input type="file" name="file" />
        <input type="submit" value="Upload" />
    </fieldset>
}

dan menghasilkan seperti yang diharapkan:

<form action="/Upload/Upload" enctype="multipart/form-data" method="post">    
    <fieldset>
        Select a file <input type="file" name="file" />
        <input type="submit" value="Upload" />
    </fieldset>
</form>

Di sisi lain jika Anda menulis kode ini dalam konteks konstruksi sisi server lain seperti ifatau foreachAnda harus menghapus @sebelum using. Sebagai contoh:

@if (SomeCondition)
{
    using (Html.BeginForm("Upload", "Upload", FormMethod.Post, 
                                      new { enctype = "multipart/form-data" }))
    {
        @Html.ValidationSummary(true)
        <fieldset>
            Select a file <input type="file" name="file" />
            <input type="submit" value="Upload" />
        </fieldset>
    }
}

Sejauh menyangkut kode sisi server Anda, inilah cara untuk melanjutkan :

[HttpPost]
public ActionResult Upload(HttpPostedFileBase file) 
{
    if (file != null && file.ContentLength > 0) 
    {
        var fileName = Path.GetFileName(file.FileName);
        var path = Path.Combine(Server.MapPath("~/content/pics"), fileName);
        file.SaveAs(path);
    }
    return RedirectToAction("Upload");
}

1
Terima kasih. Lihatlah controller yang saya perbarui dalam pertanyaan saya. Itu tidak bekerja dengan kode Razor ..
kk-dev11

2
@ user1076915, apa artinya itu tidak berhasil ? Bisakah Anda sedikit lebih spesifik. Saya telah memperbarui jawaban saya dengan kode contoh tentang bagaimana tindakan pengontrol Anda dapat terlihat. Jika Anda tidak dapat mendapatkan file yang diunggah dalam tindakan pengontrol yang bisa berarti bahwa Anda memiliki <form>tag bersarang (yang tidak diizinkan dalam HTML) atau Anda mungkin menggunakan beberapa javascript yang membajak pengiriman formulir normal dan melakukan permintaan AJAX yang tidak t bekerja dengan unggahan file.
Darin Dimitrov

Saya menggunakan aksi pengontrol Anda dan pisau cukur '@using' .. tetapi ini menampilkan -> Keterangan: HTTP 404. Sumber daya yang Anda cari (atau salah satu dari dependensinya) dapat dihapus, seandainya namanya diubah, atau tidak tersedia untuk sementara. Harap tinjau URL berikut dan pastikan bahwa itu dieja dengan benar.
kk-dev11

@ user1076915, kapan Anda mendapatkan pesan kesalahan ini? Kapan Anda ingin merender formulir unggahan atau ketika Anda mengirimkan formulir? Dalam kasus pertama memastikan bahwa Anda memiliki GETtindakan Upload yang akan melayani Upload.cshtmlpandangan yang berisi kode ini: public ActionResult Upload() { return View(); }. Jadi, pastikan Anda memiliki pengontrol yang disebut UploadControllerberisi dua tindakan Unggah: satu untuk melayani formulir dan yang lainnya untuk memproses pengiriman.
Darin Dimitrov

2
Berhasil, tetapi dalam konteks POST, saya sarankan untuk menambahkan: @ Html.AntiForgeryToken ();
Frédéric De Lène Mirouze
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.