Asp.Net

Asp.Net Kayıt Ekleme ve Listeleme İşlemleri

Visual Studio’da Access Veri Tabanı ile Kayıt Ekleme ve Listeleme İşlemleri

Merhaba arkadaşlar. Microsoft Acces programını kullanarak  aşağıda resimdeki gibi üyeler ve haberler isminde  2 adet tablo oluşturuyoruz.

 

Bu dersimizde, haberler tablosuna kayıt ekleme işlemini ve eklediğimiz bu kayıtları çekip nasıl listeleyeceğiz onu işleyeceğiz.

Eğer üyeler tablosunun bulunduğu veri tabanına haberler tablosunu eklediyseniz haber ekle formunun tasarımına geçip komutlarımızı yazalım. Ben dersi anlatırken haberler tablosu üzerinden örnek verdim. Siz kendi projenize göre haberler tablosu yerine örneğin siteniz alış veriş sitesi ise ürünleri ekleyip listeleyeceğiniz urunler tablosu, kitap satış siteniz var ise kitapları ekleyip listeleme yapacağınız kitaplar tablosu, gibi farklı tablolar da kullanabilirsiniz. Buradaki amaç herhangi bir tabloya kayıt ekleyip, daha sonrada bu kayıtları listelemektir.

  1. İlk olarak visual studio programını açıp aşağıdaki gibi haber ekleme formunun tasarımını yapıyoruz.
    -Sayfamıza 6 satır 2 sütunlu tablo ekledik.
    -Başlık için 1 adet TextBox ekliyoruz ve ismini properties ekranındaki id kısmından baslik olarak değiştiriyoruz.
    -Sayfamıza Kategori için 1 adet DropDrowList ekleyip ismini properties ekranındaki id kısmından kategori olarak değiştiriyoruz. Kenarındaki ok’ a tıklayıp Edit Itemss seçeneğinden aşağıdaki gibi kategori seçeneklerini ekliyoruz.

    -İçerik alanı için 1 adet TextBox ekleyip ismini properties ekranından icerik olarak değiştiriyoruz. Ayrıca yine properties ekranından TextMode özelliğini MultiLine olarak değiştiriyoruz.
    -Haberimize resim eklemek için Toolbox ekranından FileUpload kontrolü ekliyoruz ve ismini properties ekranındaki Id seçeneğinden resim olarak değiştiriyoruz.
    -Sayfamıza 1 adet Button ekleyip Text özelliğini properties ten Haber Ekle olarak değiştiriyoruz.
    -Ve son olarak Kullanıcıya “Kayıt Başarılı” veya “Kayıt Ekleme Hatası şeklinde mesaj vermek için Haber Ekle düğmemizin altına Label kontrolü ekleyip properties ekranından Id sini mesaj olarak değiştiriyoruz.

    Haber Ekleme Formumuzun son hali aşağıdaki gibidir.

    Haber ekleme formunun tasarım işlemini bitirdik. Şimdi sırada kodlama kısmı var.

    Haber Ekle düğmemize çift tıklayıp kodlama kısmına geçebiliriz.

Haber Ekleme Formu Kodlama İşlemi

-İlk olarak kod ekramınızın üst kısmındaki kütüphane listesine;

using System.Data;

using System.Data.OleDb;

kütüphanelerini ekliyoruz.

-Kütüphane kodlarını ekledikten sonra veri tabanımızın yolunu belirtmemiz gerekiyor. Button1_Click olayının içerisine
OleDbConnection baglanti = new
OleDbConnection(“Provider=Microsoft.ACE.OLEDB.12.0;Data Source=” + Server.MapPath(“App_data\\proje.accdb”));

Komutunu ekliyoruz.

-Veri tabanı bağlantısını belirtikten sonra veri tabanımızı açıp kayıt ekleme kodlarını yazmamız gerekiyor. Bu işlemleri yaparken herhangi bir sorun olduğunda hata yakalamak için kodlarımızı try catch bloğu arasına yazıyoruz.

kayıt ekleme işlemine geçmeden önce kullanıcının seçtiği resmi resimler klasörümüze ekleyip resim yolunu resimyolu isminde değişkene alacağız. Veri tabanına bu resim yolunu kaydedeceğiz. Eğer yapmadıysanız projenize proje isminin üzerinde sağ tıklayıp add seçeneğinden new folder seçerek projenize resimler isminde klasör ekleyiniz.

Resimler klasörünü ekledikten sonra kod ile kullanıcının formdaki resim kısmından seçtiği resmi bu klasörün içine kopyalayacağız . Ve resmin bağlantı yolunu alıp bu yolu haberler tablosundaki resim alanına ekleyeceğiz. Bunun için aşağıdaki kodları kullanacağız. Resim işlemleri için kütüphanemize

using System.IO; eklememiş gerekiyor.

if (resim.HasFile)

{


if (resim.PostedFile.ContentType == “image/jpeg” && resim.PostedFile.ContentLength < 102400)

{


string dosyaismi = Path.GetFileName(resim.FileName);

resim.SaveAs(Server.MapPath(“~/resimler/”) + dosyaismi);

}

}

Komutları ile önceklikle if (resim.HasFile) komutu ile kullanıcının resim seçip seçmediğini kontrol ettik. Eğer kullanıcı resim seçtiyse

if (resim.PostedFile.ContentType == “image/jpeg” && resim.PostedFile.ContentLength < 102400) komutu ile seçilen dosyanın tipimim jpeg dosyası olup olmadığını ve 102400 (Bu değer byte değeri )ilede dosyanın boyunun 102 kb tan küçük olmasını kontrol ediyoruz. Kullanıcıya maksimim 102 kb lık dosya yükleme izni veriyoruz. Örneğin siz maksimum 1 mb resim dosyası yüklenmesine izin vermek istiyorsanız oradaki değeri 1024000 değerini yazmanız gerekiyor.

string dosyaismi = Path.GetFileName(resim.FileName);

komutu ile seçilen dosyanın ismini dosya isminde string değişkene aktarıyoruz. Bu ismin haberler tablomuzdaki resim alanına ekleyeceğiz.

resim.SaveAs(Server.MapPath(“~/resimler/”) + dosyaismi);

komutu ile de seçilen resmi projemizde oluşturduğumuz resimler klasörün içine yüklüyoruz.

-resim yükleme işimiz bittikten sonra artık verilerimizi tabloya ekleme işlemine geçebiliriz.

baglanti.Open();//bağlantımızı açtık
komutu ile veri tabanı bağlantımızı açtık.

OleDbCommand kayiteklesorgu = new
OleDbCommand(“insert into haberler (baslik,kategori,icerik,resim,tarih)values (@baslik,@kategori,@icerik,@resim,@tarih)”,baglanti);

Komutu ile haberler tablomuza kayıt ekleme işlemi gerçekleştiren sorgumuzu yazıyoruz.

kayiteklesorgu.Parameters.AddWithValue(“@baslik”, baslik.Text);

kayiteklesorgu.Parameters.AddWithValue(“@kategori”, kategori.Text);

kayiteklesorgu.Parameters.AddWithValue(“@icerik”, icerik.Text);

kayiteklesorgu.Parameters.AddWithValue(“@resim”, dosyaismi);

kayiteklesorgu.Parameters.AddWithValue(“@tarih”, DateTime.Now.ToString(“dd.MM.yyyy”));

komutları ile parametre olarak girilen @baslik,@kategori,@icerik,@resim ve @tarih alanlarına değerlerini aktardık. DateTime.Now.ToString(“dd.MM.yyyy”) komutu ile bu günnü tarihini gün.ay.yıl şeklinde aldık. Örneğin 29.03.2020 şeklinde tarihi alır.

kayiteklesorgu.ExecuteNonQuery();

Komutu ile sorgumuzu çalıştırdık.

baglanti.Close();

Komutu ile bağlantımızı kapatıyoruz.

mesaj.Text = “Kayıt Eklendi”;

Komutu ile de kayıt ekleme işleminin başarılı olduğunu göstermek için mesaj labelımıza “Kayıt Eklendi Mesajı verdik.

Buton1 in Click olayına yazdığımız kodların son hali aşağıdaki gibidir.



Bu işlemlerden sonra kayıt ekleme işlemini tamamlamış bulunuyoruz. Aşağıda tarayıca görüntüsünü görebilirsiniz.

Kayıt ekleme işlemi başarılı mesajı aldıktan sonra

Solution Explorer ekranını yeniledikten sonra baktığımızdad haber için eklediğimiz ibrahimovic.jpg dosyasının resimler klasörünün altına eklendiğini görebilirsiniz.

Asp.Net Access Veri Tabanı Listeleme İşlemi

Kayıt ekleme işlemini bitirdikten sonra şimdi de eklenen kayıtları listeleme işlemi yapacağız . Listelemeyi css komutlarını kullanarak istediğiniz görsel tasarımda yapabilirsiniz.

-Listeleme işlemi için öncelikle yeni bir haberlisteleme.aspx isminde yeni bir web form oluşturuyoruz.

Proje ismimizin üzerinde sağ tıklayıp Add seçeneğinden Add New Item diyoruz. Açılan ekrandan Web form seçip dosya ismini haberlisteleme.aspx olarak ayarlıyoruz.

-Sayfamızı projemize ekledikten sonra öncelikle tasarımı yapalım. Sayfamıza bir adet label etiketi alıp properties ekranından text özelliğini “Haberler” yapıp font bölümünden size ayarını 30px olarak ayarlıyoruz.

-Haberler başlığının altına ToolBox ekranından Literal kontrolü ekliyoruz. Ve properties ekranından id sini icerikveri olarak değiştiriyoruz. Listeleme işleminde div ler kullanacağız ve bu div etiketlerini Literal nesnesini kullanarak ekranda göstereceğiz. (*Literal nesnesinin özelliği içerisinde html etiketlerini kullanabilmenizdir. )

-Tasarım bu kadar J biraz kafanız karıştı dimi. Bu nasıl tasarım diye, ama merak etmeyin işin esas can alıcı kısmını kodlar ile yapacağız . Bu arada Css kullanacağız. Css için projenizde style isminde klasör oluşturup içerisine style.css dosyası eklemeniz gerekiyor. Bu css dosyasını haberlisteleme.aspx sayfasının head kısmına eklemeyi unutmayın.

-Hazırmısınız kodlamaya geçiyoruz.

-Hocam Button koymadık kodları nereye yazacağız diye sorular geliyor kulağıma. Onuda açıklayayım. Kodlarımızı sayfanın Page_Load olayına yazacağız. Haydaaaaa bu olayda ne, şimdi nerden çıktı diyebilirsiniz. Page_Load olayı sayfa tarayıcıda yüklendiğinde kullanıcı herhangi bir işlem yapmadan yani butona felan tıklamadan, sayfa yüklenir yüklenmez, çalıştıracağınız kodları yazdığınız bölümdür. Bizim listeleme örneğimizde de sayfa yüklendiğinde veri tabanına eklenen haberleri alıp sayfa yüklenirken ekranda listelemeniz gerekiyor. Bunun için kodlarımızı sayfanın Page_Load olayına yazacağız. Peki nasıl gireceğim bu Page_Load olayına. Durun acele etmeyin geliyoruz.

Dizayn ekranında iken sayfanın boş bir yerine çift tıkladığımızda sayfanın Page_Load olayına girmiş olursunuz. Aşağıda bu olaya ait kod bloğunu görebilirsiniz.

-Eğer buraya girdiyseniz kodlarımızı yazmaya başlayalım. Öncelikle veri tabanına bağlanıp verileri çekeceğimiz için kütüphanemize yani using kısmına (bazıları namespace te diyor)

using System.Data;

using System.Data.OleDb;

kütüphanelerini eklemeniz gerekiyor. Kütüphane kodlarını ekledikten sonra

Page_Load olayının içerisine

OleDbConnection baglanti = new
OleDbConnection(“Provider=Microsoft.ACE.OLEDB.12.0;Data Source=”+ Server.MapPath(“App_data\\proje.accdb”));

Komutunu yazmamız gerekiyor. Bu kodu artık biliyorsunuz. App_data klasörü içindeki proje.accdb veri tabanımıza bağlantı sağlayan komut.

-Veri tabanına bağlantı sırasında veya verileri çekerken hata durumunda sitemizin çökmemesi için kodlarımızı

try
{

}

catch
{

}

Blokları arasına yazacağız.

baglanti.Open();

komutu ile veri tabanımıza bağlantımızı yaptık


OleDbCommand db_komut = new
OleDbCommand(“Select * from haberler”, baglanti);

Komutu ile haberler tablosundaki tüm kayıtları çektik. “Select * from haberler” ifadesi bir sql sorgusudur. Bu sorgu veri tabanında istenilen kayıtları çekmemizi sağlar. “Select” Sql cümlesi ile ilgili ayrıntılı bilgilere (https://www.algoritmaornekleri.com/sql/sql-select-komutu-ve-ornekleri/ ) adresinden ulaşabilirisiniz.

OleDbDataReader alinan_veri;

alinan_veri = db_komut.ExecuteReader();
Komutları ile üstte yazdığımı SQL komutunu çalıştırdık.

if (alinan_veri.HasRows)

{

}
komutu ile veri tabanındadaki haberler tablosunda kayıt var mı kontrolü yapıyoruz.

İf kontrolü yaptıktan sonra while döngüsü ile haberler tabloundaki kayıtları çekip literal içinde <div> etiketi ile kutu oluşturup içerisine tablodan çektiğimiz verileri yazdırdık.

alinan_veri[“icerik”].ToString().Substring(1,100) komutundaki Substing komutu haber içeriğine eklediğimiz değerin ilk 100 karekterini alıyor. Haberin hepsini bu ekranda göstermiyoruz. Özetini gösteceğiz. Ayrıntılı haberi bir sonraki dersimizde yapacağımız haberdetay.aspx sayfasında gösteceğiz. Substring komutunu kullanmanız için sayfanın üstündeki kütüphane kısmına using System.Text.RegularExpressions; komutunu eklemeniz gerekiyor.

Listemizi aldıktan sonra baglanti.Close(); komutu ile bağlantıyı kapattık.

catch

{

icerikveri.Text = “Bağlantı da bir problem var”;

}

Komutu ile eğer veri tabanına bağlantı sorunu olduğunda veya tabloda kayıt olmadığında hata mesajımızı verdirdik.

Son olarak ta style.css dosyamıza aşağıdaki komutları yazıyoruz.

#kutu {
width: 28%;
height: 300px;
float: left;
background: #b6ff00;
border:3px dashed #ff0000;
border-bottom-left-radius:10px;
padding:10px;
margin:10px;
}


#kutu img {
width: 40%;
height: 150px;
float:left;
margin:10px;
}

Asp.net ile listeleme işlemi bu kadar. Css komutlarına müdahale ederek istediğiniz gibi listeleme işlemini özelleştirebilirsiniz. Page_Load taki kodların tamamı aşağıdaki şekildedir.



Kodlarımızı yazdıktan sonra F5 tuşu ile çalıştırdığımızda aşağıdaki görüntüyü elde ediyoruz.


Bir sonraki derste bu listedeki herhangi bir habere tıkladığımızda tıklanan haberi haberdetay.aspx ismindeki sayfamızda göstereceğiz. Şimdilik hoşçakalın.

Etiketler

Bir cevap yazın

Başa dön tuşu
Kapalı
Kapalı