Merhaba Arkadaşlar,
MVC projelerinde boyut, tür kontrolünden geçirdiğimiz bir resmi kayıt etme işlemini anlatacağım.
Resmin seçimi ve gösterimine ilişkin ihtiyaç duyacağımız tagler aşağıdaki gibidir.
<form method="post" enctype="multipart/form-data"> <input type='file' id="dosya" name="dosya" onchange="kontrol(this);" /> <img id="resmim" src="" style="max-width:180px;" /> <input type="submit"/> </form>
Dosyanın controllerda post kısmına gönderilmesi için önemli olan kısım enctype tanımıdır.
Sayfada yüklenecek resmin boyut ve tür kontrolünün yapılması ve uygun olması durumunda ekranda görüntülenmesi işlemini javascript ile yapmaktayız.
<script> function kontrol(input) { if (input.files && input.files[0]) { if (input.files[0].size > 1024 * 1000) {//boyut kontrolü alert("Boyut Büyük"); document.getElementById("dosya").value = ""; } else { if (input.files[0].type != "image/jpeg") {//tür kontrolü alert("Format uygun değil"); document.getElementById("dosya").value = ""; } else { var resim = new FileReader(); resim.onload = function (e) {//resmin img taginde gösterilmesi $('#resmim') .attr('src', e.target.result); }; resim.readAsDataURL(input.files[0]); } } } } </script>
Bu haliyle html sayfamız hazır artık kaydet butonuna tıklandığında post kısmında karşılama ve dosyanın klasöre kayıt edilmesi gerekiyor. Bunun için controller kısmında yapacağımız işlem;
[HttpPost] public ActionResult Index(HttpPostedFileBase dosya) { var dosyaadi = Path.GetFileName(dosya.FileName); var uzanti = Path.GetExtension(dosya.FileName); string adi = Path.GetFileNameWithoutExtension(dosyaadi); var yol = Path.Combine(Server.MapPath("~/resimler"), dosyaadi+uzanti); dosya.SaveAs(yol); return View(); }
Herkese kolaylıklar.
Jquery Ajax ile Post edildiğinde , HttpPostedFileBase dosya neden null döner...
null dönmemesi lazım name adını kontrol edin.