ASP.net MVC 4 Razor Hochladen Bild Im Pop-Up-Fenster

Ich bin ein Neuling in asp.net mvc 4. Ich entwickle eine Website mit mvc 4 und ich will hochladen Bild im pop-up-Fenster. Auf dieser Website gibt es einen blog. Ich will hochladen 3 4 Bilder pro post. Aber Wenn ich verwenden Standard-html-Datei-upload-Kontrolle, poste ich eine Aktion für die erste Bild-link. Wenn ich nach einer Aktion für die erste Bild-link, Seite nochmal geladen und blog-Inhalte verschwunden war. Deshalb will ich hochladen, Bild in Popup-Fenster und in diesem pop-up gibt Bild-link zum Benutzer. Wie kann ich dies tun ?

InformationsquelleAutor Melih Mucuk | 2013-11-17

  1. 1

    Controller: 

        [HttpPost]
    public ActionResult Index(HttpPostedFileBase file)
    {
    if (file != null && file.ContentLength > 0) 
    {
            int len =file.ContentLength;

            var myData = new byte[len];

            file.InputStream.Read(myData, 0, len);

            var fileId = SaveOrWriteToDb(file.FileName, file.ContentType, ref myData);
            if(fileId > 0)
            {
                return RedirectToAction("Index", "Home");
            }

    }

    Anzeigen(javascript ist entnommen aus Wie kann ich Dateien hochladen asynchron?)

    <div id="popup">
    @using (Html.BeginForm("Index", "File", FormMethod.Post, new { enctype =   "multipart/form-data" }))
    {
        <input class="file" type="file" name="file" />
        <input class="file" type="file" name="file2" />
        <input class="file" type="file" name="file3" />
        <input id="ok" type="button" value="OK" />
    }
</div>
<script>
$(document).ready(function() {
     $("#ok").click(function () {
        $.each($('.file'),function(){

           var filename = $(this).val();
           $.ajax({
              type: "POST",
              url: '@Html.Action("Index","File")',
              enctype: 'multipart/form-data',
              data: {
                file: filename
              },
              success: function () {
                alert("Data Uploaded:");
                //return image link to user here...
              }
          });
        });
      });
 });

    Leider nicht testen, ich hoffe es funktioniert :).
    Es ist schnell Beispiel gibt es viel, was Sie tun sollten.

    InformationsquelleAutor TGR

Schreibe einen Kommentar