Mvc Ajax ile Dosya Yükleme

Selam AJAX ile dosya yükleme işlemi yapalım.
Boş bir MVC projesi açtım ve Jquery nuget tan yükledim.
Resimlerin veya Excelin Vs düzenli bir yerde olması için öncelikle FileUpload metodu içinde files diye klasör olup oladığının kontrolu yapılır ve yoksa oluşturulur.


Controller Tarafı


public class HomeController : Controller
    {
        // GET: Home
        public ActionResult Index()
        {
            return View();
        }

        [HttpPost]
        public JsonResult FileUpload(HttpPostedFileBase file)
        {
            if (file !=null)
            {
                if (Directory.Exists(Server.MapPath("~/files"))==false)
                {
                    Directory.CreateDirectory(Server.MapPath("~/files"));
                }
                file.SaveAs(Path.Combine(Server.MapPath("~/files"),file.FileName));
                return Json(new { hasError = false,message="Dosya Yüklendi..." });
            }
            return Json(new { hasError = true, message = "Dosya NULL geldi..." });

        }


    }


View  Tarafı  

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    <link href="~/Content/bootstrap.min.css" rel="stylesheet" />
    <script src="~/scripts/jquery-3.0.0.min.js"></script>
</head>
<body>
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <h2>
                    AJAX ile Dosya Yükleme
                </h2>
                <hr />
            </div>
        </div>

        <div class="row">
            <div class="col-md-12">
              @using (Html.BeginForm("Index","Home",FormMethod.Post,new { enctype="multipart/form-data"}))
              {
                  <input type="file" id="file" name="file" class="form-control" />
                  <input type="button" id="btnSendFile" class="btn btn-success" value="Send File" />
              }


                <script>
                    $("#btnSendFile").click(function () {
                        var formdata = new FormData($("form").get(0));                   
                     
                        $.ajax({
                            method: "POST",
                            url: '@Url.Action("FileUpload","Home")',
                            data: formdata,
                            processData: false,
                            contentType: false,
                        }).done(function (result) {
                            if (result.hasError == false) {
                                console.log(result);
                                alert(result.message);
                            }
                            else {
                                alert("Resim NULL geldi");
                            }
                        })

                    })
                </script>
               
            </div>
        </div>


    </div>
</body>

</html>

Hiç yorum yok:

Yorum Gönder