Coder

25 Nisan 2013

Dropdownlist ve Gridview uygulaması

Asp.net ile geliştirilen web uygulamaların da dropdownlist ve gridview bir arada her zaman ihtiyaç duyularak kullanılmıştır. Bu kontrollerin yer aldığı dropdownlist’in gridview ile bağlantılı bir uygulama yapalım.

dropdownlist-gridview-uygulamasi

Örneğimizdeki senaryo şöyle olsun; üniversitenin kampüslerindeki bölümler ve o bölümlerde derslerin kredilerini görebileceği, veritabanı kısmında okul-bölüm-ders ilişkisinde geçen, kullanıcının dropdownlist de seçeceği okulun tekrar dropdownlist ile seçeceği bölümündeki ders kredilerinigridview de görebileceği mini rapor ekran yapısını uygulayalım.

İlk önce veritabanı tarafında 3 tane tablo oluşturalım. Tablolarımız isim ve sırasıyla tblOkul, tblOkulBolum, tblBolumDers.

Tablo yapısı ve kolon özellikleri

tablo-yapisi

Resimdeki gibi tabloları; değişken tiplerini, isimlerini ve primary key olan id kolanlarının Identity Column özelliğini id olarak atayarak oluşturun.

Oluşturulan tabloları aşağıdaki diyagram resmindeki gibi ilişkilendirin. tblOkul tablsundaki id ile tblOkulBolum tablosundaki okulu kolonu, tblOkulBolum tablsundaki id ile tblBolumDers tablosundaki bolumu kolonu ilişkilendirilmiş. Resim üzerinde de anlaşılması için mavi oklu kolonlar ile kırmızı oklu kolonlar ilişkilendirilmiş.

İlişkilendirilmiş tablolar diyagram ekranı
tablo-iliskilendirmesi

İlişkilendirme de yaptıktan sonra kolonlara veri girişi yapabiliriz. Hayali olarak kampüs ve ilgili bölümlerini aşağıdaki resimdeki gibi doldurdum. Tabloları sırasıyla tblOkul, tblOkulBolum, tblBolumDers şeklinde doldurun.(Tablolardaki id ler otomatik artacağından o kısma isteseniz de veri girişi yapamazsınız.)

Veritabanındaki tablo içeriği
tablo-icerigi-girilmesi
Tablolarımız birbirleri ile ilişkilendirildiği için okulu ve bölümü kolonlarını sadece ilgili tablosundaki numarasını yazıyoruz. (Yeni başlayanlar için önerim, resimdeki ve yazdığım tablo isimleri gibi birebir giriş yaptıklarında kod tarafında da fazla bir şey değiştirmeden hata almadan örneği çalıştırabilir.)

Veritabanı tarafını yaptıktan sonra Asp.net tarafına geçebiliriz. Yeni proje oluşturduktan sonra ilk önce web.config dosyamıza veritabanı bağlantımızı alttaki gibi belirlenen kod blogu aralığına yazalım. Burada kendi veritabanınızı kullanacağınız için, veritabanı ismi ve diğer kısımlara takılmamanızı ümit ediyorum.(Local de kod isimini verdiğim veritabanımı kullanıyorum)

Web.config dosya içerği

webconfig-connectionstring

Tasarım kısmında görseldeki gibi ekran hazırlayalım. Kullandıklarım, 2 adet dropdownlist , 1 buton, 1 gridview. Dropdownlist kontrollerinin AutoPostBack özelliğini true yapmayı unutmayın !

Asp.net tasarım ekranı

aspnet-sayfa-duzeni

Tasarım kısmını da bitirdikten sonra kod kısmına geçebiliriz. İlk önce sayfanın  Page_Load kısmından sayfa ilk açıldığında veritabanındaki okul isimlerinin başlangıçta 1. dropdownlist temize gelmesini istiyoruz. Diğer açıklamaları da kod kısmında bulabilirsiniz.

Eklemeyi unutmayın !
[cc lang='csharp' ]using System.Configuration;
using System.Data.SqlClient;
using System.Data;[/cc]

[cc lang='csharp' ]
string constr = ConfigurationManager.ConnectionStrings["LocalSqlServer"].ConnectionString; // Bağlantı satırını global tanıplayıp tekrar tekrar yazma ihtiyacı duymuyoruz.
protected void Page_Load(object sender, EventArgs e)
{
// Dropdownlist kontrol isimlerini ddOkul ve ddBolum olarak atadım !
// Sayfa açılır açılmaz tblOkul tablomuzdaki okul isimlerini ddOkul(dropdownlist) kontrolümüze veritabanımızdan çekiyoruz.
if (!IsPostBack)
{

SqlConnection sql = new SqlConnection(constr);
SqlCommand com = new SqlCommand(“Select id, okul from tblOkul”, sql);

try
{
sql.Open();
SqlDataReader reader = com.ExecuteReader();

ddOkul.DataSource = reader;
ddOkul.DataValueField = “id”;
ddOkul.DataTextField = “okul”;
ddOkul.DataBind();
reader.Close();
}

catch
{
Response.Write(“Bir hata oluştu”);
}

sql.Close();
}
}

protected void ddOkul_SelectedIndexChanged(object sender, EventArgs e)
{

// Seçilen okul karşılığında önceden veritabanımız da kayıtlı bulunan okuldaki bölümler, ddBolum(dropdownlist) kontrolümüz de listelenencek.
SqlConnection sql = new SqlConnection(constr);
SqlCommand com = new SqlCommand(“Select id, bolum from tblOkulBolum where okulu=’” + ddOkul.SelectedItem.Value +”‘”, sql);

try
{
sql.Open();

SqlDataReader reader = com.ExecuteReader();

ddBolum.DataSource = reader;
ddBolum.DataValueField = “id”;
ddBolum.DataTextField = “bolum”;
ddBolum.DataBind();
reader.Close();
}

catch
{
Response.Write(“Bir hata oluştu”);
}

sql.Close();

}

protected void btnListele_Click(object sender, EventArgs e)
{

SqlConnection sql = new SqlConnection(constr);
SqlCommand com = new SqlCommand(“Select dersler, kredi from tblBolumDersler where bolumu=’” + ddBolum.SelectedItem.Value + “‘”, sql);

try
{
sql.Open();

SqlDataReader reader = com.ExecuteReader();

DataTable tablo = new DataTable();
tablo.Load(reader);
GridView1.DataSource = tablo.DefaultView;
GridView1.DataBind();

reader.Close();
}

catch
{
Response.Write(“Bir hata oluştu”);
}

sql.Close();
}[/cc]
Burada bazı bölümlerin dersleri gridview kontrolünde göstermeyebilir. Sadece Maltepe MYO okulundaki Bilgisayar ve Muhasebe derslerini verirabanımıza kayıt ettiğimiz için örneğimizde sadece 2 bölümün dersleri göstermekte.

Powered by WordPress