Ajax ile DropDownList'ten DataList'e veri aktarma

Yağız Gönüler tarafından yayınlanmıştır 13. Ağustos 2008 13:49
Bu makalemle birlikte, forumlarda en çok sorulan sorulardan birine cevap buluyoruz..

 

Ne zamandır bu makaleyi yazmak istiyordum zira her forumda mutlaka veritabanından dropdownliste, oradan da dataliste veri aktarımı işlemi daima sorulur çünkü daima böyle bir sisteme ihtiyaç duyulur. Bu tip sistemlere birkaç örnek vermek gerekirse; bazı sitelerin üyelik formlarında bulunan il ve ardından ile göre yüklenen ilçe seçim işlemi, bankaların il ve ardından ilçeye göre gelen şube seçimi ve alışveriş sitelerindeki kategori seçimlerini söyleyebiliriz.

 

Sayfayı tekrar yüklemeden daha hızlı veri alışverişi yapabilmenin en keyifli yolu elbette ki Ajax teknolojisinden faydalanmak. Bu uygulamada Asp.Net Ajax ve Microsoft Access’den faydalandım. Mutlaka işinize yarayacak bir makale olacaktır.

 

Öncelikle design sayfama Script Manager, Update Panel, 1 Label, 1 DropDownList, 1 DataList ve 2 AccessDataSource ekliyorum.

Amacım sayfa yüklenirken DropDownList’e makalelerimi getirmek ve daha sonra makale seçildiği zaman içeriği DataList’te görüntülemek.

Access veritabanımda MakaleID, MakaleBaslik ve Makale isimli 3 alanım var. Tüm bu hazırlıklardan sonra sayfa görüntüm şu şekilde olacak:

 



Label1’de Makale başlığı yazıyor. DropDownList’in adı DDGittigimYerler. AccessDataSource’ların isimleri ise yanlarında yazıyor. Şimdi html tarafındaki kodlamalara geçelim. Kodların sonunda açıklama yapacağım.

 

<asp:UpdatePanel ID="UpdatePanel1" runat="server">


<ContentTemplate>


<asp:Label ID="Label1" runat="server" Font-Bold="True" Font-Names="Verdana" Font-Size="Medium" Font-Underline="False" ForeColor="Crimson" Text="Makale Başlığı :"></asp:Label>


<asp:DropDownList ID="DDGittigimYerler" runat="server" AutoPostBack="True" DataSourceID="SQLDDGittimYerler" DataTextField="MakaleBaslik" DataValueField="MakaleID" Width="560px" Font-Bold="True" Font-Names="Verdana" Font-Size="Small" ForeColor="Black">


</asp:DropDownList>


<asp:DataList ID="DataList1" runat="server" BackColor="LightGoldenrodYellow" BorderColor="Tan" BorderWidth="1px" CellPadding="2" DataKeyField="MakaleID" DataSourceID="SQLListGittimYerler" Font-Names="Verdana" Font-Size="Small" ForeColor="Black">


<ItemTemplate>


<asp:Label ID="MakaleLabel" runat="server" Text='<%# Eval("Makale") %>'></asp:Label><br />


</ItemTemplate>


</asp:DataList>

 

<asp:AccessDataSource ID="SQLDDGittimYerler" runat="server" DataFile="~/contact.mdb" SelectCommand="SELECT [MakaleID], [MakaleBaslik] FROM [tbl_makale]"></asp:AccessDataSource>

 

<asp:AccessDataSource ID="SQLListGittimYerler" runat="server" DataFile="~/contact.mdb" SelectCommand="SELECT [Makale], [MakaleID], [MakaleBaslik] FROM [tbl_makale] WHERE ([MakaleID] = ?)">

 

<SelectParameters>

<asp:ControlParameter ControlID="DDGittigimYerler" Name="MakaleID" PropertyName="SelectedValue" Type="Int32" />

</SelectParameters>

</asp:AccessDataSource>


</ContentTemplate>


</asp:UpdatePanel>

Teker teker açıklamaları yapayım. Çok karmaşıkmış gibi görünsede aslında oldukça kolay bir düzenlemesi var kod bloklarının.

 

İlk olarak Label tagi var. Burada Makale Başlığı yazıyor.

Daha sonra DropDownList tagi var. Burada dikkat edilmesi gereken nokta; DataSourceID="SQLDDGittimYerler" DataTextField="MakaleBaslik" DataValueField="MakaleID" ayarlarıdır. Çünkü DropDownList ile DataList’in veri kaynakları farklıdır. DropDownList, MakaleBasligini ekrana getirirken, değerini MakaleID’den alıyor, ayrıca 1. AccesDataSource’a bağlı. Bunları belirttik.

 

Sonraki tag Datalist ile ilgili. Malum 2 kontrol de altalta olduğu için kodlamaları peşpeşe oluyor. Burada da dikkat edilmesi gereken nokta; DataKeyField="MakaleID" DataSourceID="SQLListGittimYerler" ayarlarıdır. DataList kaynağını 2. AccessDataSource’dan alır.

ItemTemplate taginde Makale içeriğini ekrana yansıtacak olan Label ayarları yapılıyor. Burada Text='<%# Eval("Makale") %>' diyerek Makale isimli veritabanı kolonundan kaynağını alacağını belirtiyoruz.

 

Sonra 1.AccessDataSource’umuzu ayarlıyoruz. SelectCommand="SELECT [MakaleID], [MakaleBaslik] FROM [tbl_makale]" diyerek dropdownlist’e sadece makale başlığını aktarıyoruz.

 

Hemen ardından 2.AccessDataSource’umuzu ayarlıyoruz. Burada da SelectCommand="SELECT [Makale], [MakaleID], [MakaleBaslik] FROM [tbl_makale] WHERE ([MakaleID] = ?)" diyerek Makale içeriğini belli bir kritere göre dataliste aktaracağımız ayarları yapıyoruz. Kriteri ise bundan sonraki satırda belirtiyoruz.

 

SelectParameters taginde MakaleID isimli veritabanı alanının, DropDownList için geçerli ana kaynak olacağını belirtiyoruz. PropertyName="SelectedValue" Type="Int32" belirledikten sonra taglerimizi kapatıp işin çalışma kısmına geçiyoruz.

Ben DropDownList’in hemen altındaki Label yardımıyla toplam kaç adet makale bulunduğunu da kullanıcılarıma sunuyorum. Bunun içinde code behind’da kullandığım kodlar şu şekilde:

 

Protected Sub Form1_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Form1.Load

 

Dim con As New OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0;data source=" & Server.MapPath("veritabani.mdb"))

Dim com As New OleDbCommand("SELECT COUNT(*) FROM tbl_makale", con)

con.Open()

Dim toplam As String

toplam = com.ExecuteScalar

lblsayi.Text = toplam

con.Close()

 

End Sub




Yazılım Geliştirme’de profesyonelliğe doğru adım attığımda ilk zorlandığım konulardan biri buydu. İnsan farklı alanlarda bunu kullandıktan sonra uzmanlaşıyor elbette. Umarım siz de bu makale yardımıyla artık bu tarz sorunların kolayca üstesinden gelirsiniz.

4 kişi tarafından 3.0 olarak değerlendirildi

  • Currently 3/5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5

Etiketler: , ,

Makaleler | Yazılım Geliştirme | Web

Yorumlar



Bu site BlogEngine.NET 1.4.5.0 ile oluşturulmuştur. Türkçe çevirisi BlogEngine TR ekibi tarafından yapılmıştır.
Sitedeki kod ve tasarım değişiklikleri ise Yağız Gönüler tarafından geliştirilmiştir.
2008 © www.yagizgonuler.com

Paslaş

       

Anket

Mesleğinizden arta kalan zamanınızı nelere harcıyorsunuz?







Sonuçlar

Calendar

<<  Şubat 2012  >>
PaSaÇaPeCuCuPa
303112345
6789101112
13141516171819
20212223242526
2728291234
567891011

Yazıları geniş takvimde göster

Ne(ler) Okuyorum?


Ne Dinliyorum?

Bob Marley & The Wailers - Lively Up Yourself (3 saat önce)
Bob Marley & The Wailers - Jamming (3 saat önce)
Bob Marley & The Wailers - Is This Love (3 saat önce)
Bob Marley & The Wailers - Iron Lion Zion (3 saat önce)
Bob Marley & The Wailers - I Shot The Sheriff (3 saat önce)
Bob Marley & The Wailers - Get up,stand up (3 saat önce)
Bob Marley & The Wailers - Exodus (3 saat önce)
Bob Marley & The Wailers - Could You Be Loved (3 saat önce)
Bob Marley & The Wailers - Buffalo Soldier (3 saat önce)
Bob Marley & The Wailers - Africa Unite (3 saat önce)

İstanbul'da Hava

ISTANBUL

Ziyaretçi Sayısı