Yükleniyor...

16 Mart 2018

ASP.NET MVC Çoklu Resim Yükleme

Asp.Net MVC’de birden fazla resimleri klasöre kaydetmek ve aynı zamanda resimleri veri tabanındaki tabloya eklemek için kolay ve kullanışlı bir yöntem var.

 <input type=”file” class=”multi” name=”ChosenFiles” />    //Birden Çok Resim Seçmek İçin

Input sayesinde istediğimiz kadar resim seçebiliriz. Resimleri seçtikten sonra input’un altında resimlerin adları gelmektedir. Daha sonra bu verileri Html.BeginForm veya başka bir metot aracılığıyla (Ajax ile olabilir)  Controller’a göndermemiz gerekmektir.

Şimdi Controller kısmına gelelim.

Dikkat edilmesi gereken bir husus var. ActionResult’a gelen parametrenin ismi ( örn: ChosenFiles ) input’un name değeri ile aynı olması gerekmektedir.

Bir Foreach döngüsü sayesinde sırasıyla resimleri klasöre kaydedip ve aynı zamanda resimlerin isimlerini veri tabanındaki tabloya kaydediyoruz.

 

Posted in Asp.net MVC, BilişimTaggs:
17 Comments
  • Veysel BASKANİ

    Selamın aleyküm bu islemleri yaptım fakat bi yerde olmuyor nasil yardimci olabilirsiniz

    20:29 25 Nisan 2018 Cevapla
    • smldgn

      aleyküm selam, tabiki yardımcı olurum seve seve fakat nerede hata alıyorsunuz veri tabanına eklerken mi yoksa farklı bir yerde mi ? Screenshot atabilir misiniz ?

      00:32 26 Nisan 2018 Cevapla
  • IlanListele sayfasında foreachle o resimleri görebilmem için neyi dönmem lazım?

    13:36 27 Temmuz 2018 Cevapla
    • smldgn

      Eğer resimleri başarıyla veritabanına yüklediyseniz;
      İlana göre resimleri getirmeniz gerekir, Resimler tablosu açarsınız veritabanında kolonlar şu şekilde olur ;
      resim_id , resim_url , ilan_id (tabi ilan_id yabancı anahtar olacak.)

      IlanDetay veya IlanListele controller’ında IlanID’si 1 olanın ilan fotoğrafları gelsin return View(db.Ilanlar.Include(“Resimler).Where(x=>x.ilan_id==1).Tolist();

      View kısmında ise Ilanları çağırmanız yeterli yani şöyle
      foreach( var item in Model.Ilanlar)
      {
      @foreach (var photo in item.Ilanlar)
      {
      /Content/images/@photo.photo_url”> //Burası örnek

      }
      }
      Bu şekilde yaparsanız çok güzel olur, buradan detaylı olarak anlamadıysanız Mail yardımıyla çok daha detaylı anlatabilirim isterseniz. Geri dönüşünüzü heyecanla bekliyorum

      16:04 28 Temmuz 2018 Cevapla
  • ertugrul

    kardeş detaylarda yazı aralarında çoklu resimi nasıl getirebilirim ???
    https://i.hizliresim.com/y6DoMM.jpg

    02:16 10 Mart 2019 Cevapla
    • smldgn

      Merhaba, MakaleResimler adında yeni bir tablo açalım.
      MakaleResimID
      MakaleResimIsmi
      MakaleID

      Tablonun gerekli alanları bu şekilde olması gerekiyor. Ayrıca MakaleID yabancı anahtar olması gerekiyor, Makaleler tablosundaki MakaleID PrimaryKey olacak.
      Daha sonra resimleri bu MakaleResimler adlı tabloya kaydedeceğiz.
      Yazı aralarında çoklu resimleri getirmek için ise yapılacak işlemler oldukça basit.

      MakaleDetayı controllerda
      db.Makaleler.Include(x=>x.MakaleResimler).Where(x=>x.MakaleID==id).FirstOrDefault()

      Makale Detay sayfasında ise önce Makale Detay yazılarını getirip daha sonra bir foreach döngüsü ile makale resimlerini getirebiliriz.


      @model Makaleler
      @item.MakaleGelisme
      @item.MakaleGelisme2
      @foreach(var item in Model.MakaleResimler)
      {
      img src="~/MakaleResimler/@item.MakaleResimIsmi"
      }
      @item.MakaleGelisme3

      Bu şekilde yazı aralarında istediğiniz resimleri getirebilirsiniz.

      16:01 10 Mart 2019 Cevapla
  • Buğra

    Selam, emlak proje ödevim var bunu yapmaya çalışıyorum.
    foreach içinde kullandığımız db.savechange(); hata veriyor.
    foreach döngüsü dışına aldığımda hata kesiliyor fakat bir adet resimi db ye kayıt ediyor. Upload işleminde problem yok, resimleri upload ediyor ama bir adet resimi dbye kayıt ediyor.

    00:47 2 Mayıs 2019 Cevapla
    • smldgn

      Merhaba, hatayı anlamış bulunmaktayım. Photos pd = new Photos(); kod satırını foreach içine alabilir misiniz ? Foreach döngüsünün içinde en başta olması gerekmektedir. Bu şekilde her bir fotoğraf için veritabanına her bir resim kaydedilecektir. Aklıma gelen ilk çözüm budur.


      foreach(var item in ChosenFiles)
      {
      Photos pd = new Photos();
      .
      .
      }

      şeklinde. Bir deneyelim olmazsa tekrardan iletişim haline geçelim Buğra Bey. Saygılarımla

      01:14 2 Mayıs 2019 Cevapla
      • Buğra

        Teşekkür ederim İsmail Bey, şu an kayıt etti ve detaylar sayfasında @foreach(var item in Model.MakaleResimler)
        {
        img src=”~/MakaleResimler/@item.MakaleResimIsmi”
        }

        şu kod sayesinde listeme yaptı fakat linkler bozuk yani linkler şu şekilde geliyor, “http://localhost:56893/Content/Images/System.Collections.Generic.HashSet%601[sozlukuygulamasi.Models.resimler]”

        benim kullandığım resimler veritabanı detaylarda kullandığım veritabanında değil

        @model sozlukuygulamasi.Models.sozluk

        bunun içerisinde resimler farklı bir model onu ekliyorum hata veriyor linkler gelmiyor öyle diyiyim.

        13:26 2 Mayıs 2019 Cevapla
  • Dark

    Merhaba İsmail Bey, yönlendirmeleriniz sayesinde Create kısmında çoklu resim yükleme olayını hallettim fakat edit kısmında takılıyorum, eğer edit yaparken boş geçersem hata alıyorum eklerken resim eklemeye devam ediyor edit kısmında ne yapmalıyız bitaz açar mısınız?

    12:03 4 Mayıs 2019 Cevapla
  • Çok Yardımcı oldu Teşekkürler.

    09:22 11 Temmuz 2019 Cevapla
    • smldgn

      rica ederim, yardımcı olabildiysem ne mutlu 🙂

      09:55 11 Temmuz 2019 Cevapla
  • Baran Bulut

    Merhaba,
    Ben blog sayfası yapıyorum da şöyle bir sorum olacak. BlogController’da yeni gönderi oluştururken birden fazla resim seçip öyle veritabanına kayıt etmek istiyorum. Ve kayıt ettiğim bu gönderiyi de Home Index’te açmak istiyorum. Fakat bayadır uğraşıyorum ama hala çözemedim. Bir yardım ederseniz çok sevinirim.

    11:45 31 Temmuz 2019 Cevapla
    • Baran Bulut

      Sizin yukarıda yaptığınız kodlarla denedim fakat sadece server’a kayıt işlemi gerçekleşiyor. Server’dan geri çekemiyorum.

      11:47 31 Temmuz 2019 Cevapla
      • smldgn

        Server’dan çekmek için aslında veritabanına resimlerinizi kaydederken eklediğiniz resmin direk url’sini değilde sadece resimlerin isimlerini db’ye kaydederseniz daha sağlıklı olur. Örneğin; ornek.png diye db’ye kaydettiniz, ve bunu çekerken

        View sayfasında şu şekilde resimlerinizi çekebilirsiniz
        (foreach kullandığınızı varsayıyorum)
        (img url=”~/Resimler/@item.ImageUrl) diyerek resimlerinizi çekebilirsiniz.
        Dediğim gibi server’den bu şekilde bir yapıyla resimlerinizi kolayca çekebilirsiniz. Birde server’a okuma yazma yetkiniz olmayabilir bazen bu sebeplede resimler gelmeyebilir.

        Controller tarafında ise yani aslında veri tabanında, oluşturduğunuz yapıyı bilmiyorum ama kendi fikrim örneğin MakaleResimler adlı tablo açarak resimlerini oraya koymanız, MakaleID ile de bir foreign key sayesinde Makale tablonuzla ilişkilendirirsiniz. Bu sadece bir örnek.

        Aynı hata devam ederse bana mail atmaktan çekinmeyin. Dönüşünüzü beklemekteyim.

        Mail adresim: idogan@nuevo.com.tr

        12:04 31 Temmuz 2019 Cevapla
  • merhaba ben birden fazla resim seçemiyorum yüklerken? tek sorunum o galiba

    15:35 16 Ekim 2019 Cevapla
    • smldgn

      Merhabalar,
       input type="file" class="multi" name="ChosenFiles" /   
      bu şekilde kullandığınıza emin misiniz ?

      15:42 16 Ekim 2019 Cevapla

smldgn için bir cevap yazın Cevabı iptal et

%d blogcu bunu beğendi: