DataList (Veri Listeleme) Kontrolü

Eyl 06, 2013

DataList, ASP.Net uygulamalarında kullanılan 3 ana veri bağlama (data binding) aracından biridir. Bu kontrol ile veri tabanı, XML dosyası ve benzeri şekilde bilgi saklanabilen herhangi bir kaynağın içerisinde tutulan bilgileri listelemek, seçmek ve güncellemek mümkündür.

DataList kontrolünün en temel özelliği, verinin sunumunu akış veya tablo biçiminde belirleyebilmeye imkan sağlamasıdır. DataList ile hücre aralıkları, dikey hizalama, verilerin sunum tekrarlama yönü gibi özellikler ve verilerin akış yönü yatay veya dikey olarak tablo gösteriminde düzenlenebilmektedir.

DataList kontrolü şablonlar (template) aracılığıyla sağlanır. Bu şablonlar 7 tanedir ve kısaca şu şekilde açıklanabilir:

  • ItemTemplate (Öge Şablonu): Veri kaynağından gelen verinin her bir kaydının nasıl görüntüleneceğini belirlemek için kullanılır. ItemTemplate olmazsa veriler görüntülenemez. Bu şablon, her veri satırı için bir çoğaltılır.
  • AlternatingItemTemplate (Alternatif Şablon): Veri tabanından çekilen verilerin, birbirinden ayrıştırılabilmesi amacıyla, verileri birbirinden ayrı görünüme kavuşturabilmek için kullanılır.
  • SelectedItemTemplate (Seçili Öge Şablonu): Seçilmiş olan veriyi, diğer verilerden ayırt etmek için kullanılır. DataList kontrolü, bir veri listesindeki herhangi bir elemanı seçmek için kullanıcıya otomatik bir seçme imkanı tanımaz; fakat DataList kontrolünün SelectedIndex özelliği ayarlanarak herhangi bir liste içinde istenilen elemanın seçilmesine izin verir. Bu özelliğin 0 (sıfır) olarak ayarlanması sonucu liste içindeki ilk eleman seçilmiş olur. Bu özelliğin 1 (bir) olarak seçilmesi liste içindeki ikinci elemanının seçilmesini sağlar ve bu şekilde ilerleyerek devam eder.
  • EditItemTemplate (Öge Düzenleme Şablonu): Verileri düzenlemek için kullanılır.
  • HeaderTemplate (Başlık Şablonu): Veri listesinden önce bir defa görüntülenecek olan başlığı düzenlemek için kullanılır.
  • FooterTemplate (Alt bilgi Şablonu): Veri listesinden sonra bir defa görüntülenecek olan alt başlığı düzenlemek için kullanılır.
  • SeparatorTemplate (Ayırıcı Şablon) : Birbirini takip eden iki veri arasında bir ayraç oluşturmak için kullanılır.

DataList kullanımında, bazı özellikler yardımıyla verileri istenilen şekilde listelemek mümkündür. Bu özelliklerden bazıları aşağıdaki gibidir:

  • RepeatLayout (Tekrar Düzeni):  DataList kontrolünün en önemli özelliklerinden biri olan RepeatLayout özelliği ekranda gösterilecek verilerin yerleşimini belirlemek amacıyla kullanılır. Verilerin ekranda görüntülenme şeklini belirlemek için aşağıdaki seçenekleri sunar:

    • Flow (Akış)
    • Orderedlist (Düzenli Liste)
    • Table (Tablo)
    • Unorderedlist (Düzensiz Liste) 

  • Cellpadding (Hücre Doldurma): Veri hücresinin içeriğinin sınırlara olan uzaklığını belirlemeye yarar.

  • Cellspacing (Hücre Aralığı): Hücrelerin birbirine olan uzaklığını belirlemeye yarar.

  • BackColor (Arka plan Rengi): Veri listeleme alanının arka plan rengini belirlemeye yarar.

  • BorderColor (Kenarlık Rengi): Tabloda kenarlık rengini belirlemeye yarar.

Uygulama:

Aşağıda örnek bir veri tabanı üzerinden çekilen verilerin DataList kontrolü kullanılarak nasıl görüntülenebileceği ile ilgili bir uygulama bulunmaktadır:

Default.aspx:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
   <title> DataList Kullanımı </title>
</head>
<body>
    <form id="form1" runat="server">
    <div>      

<asp:DataList ID="OrnekDataList" Runat="Server" RepeatDirection ="Vertical" RepeatLayout="table" GridLines="both" BorderColor ="Gray" BorderStyle ="Solid">
        <HeaderTemplate>
                <thead>
                        <tr>
                                <th></th>
                                <th>Ad</th>
                                <th>Soyad</th>
                                <th>Ara Sınav Notu</th>
                                <th>Final Notu</th>
                         </tr>
                </thead>
                <tbody>
         </HeaderTemplate>
         <ItemTemplate>
                          <tr>
                                  <td width="50px"><a href="Delete.aspx?id=<%#Eval("Id") %>">Sil</a></td>
                                  <td width="50px">
                                        <%# Eval(" Ad ") %></td>
                                  <td width="50px">
                                        <%# Eval(" Soyad ") %></td>
                                  <td width="50px" align="center">
                                        <%# Eval(" AraSınavNotu ") %></td>
                                  <td width="50px" align="center">
                                        <%# Eval(" FinalNotu " ) %></td>
                           </tr>
             </ItemTemplate>
          <AlternatingItemTemplate>
                           <tr>
                                  <td style=" background-color:Silver" width="50px" ><a href="Delete.aspx?id=<%#Eval("Id") %>">Sil</a></td>
                                  <td style=" background-color:Silver" width="50px">
                                        <%# Eval(" Ad ") %></td>
                                  <td style=" background-color:Silver" width="50px">
                                        <%# Eval(" Soyad ") %></td>
                                  <td style=" background-color:Silver" width="50px" align="center">
                                        <%# Eval(" AraSınavNotu ") %></td>
                                  <td style=" background-color:Silver" width="50px" align="center">
                                        <%# Eval(" FinalNotu " ) %></td>
                            </tr>
              </AlternatingItemTemplate>

          <FooterTemplate>
                  </tbody>
          </FooterTemplate>
</asp:DataList>
    </div>
    </form>
</body>
</html>

Default.aspx.cs:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using DatalistModel;

public partial class _Default : System.Web.UI.Page
{
        protected void Page_Load(object sender, EventArgs e)
        {
                   if (!IsPostBack)
                           BindToPage();
        }

        protected void BindToPage()
        {
                   DatalistEntities provider = new DatalistEntities();
                   OrnekDataList.DataSource = provider.GetNotlarList();
                   OrnekDataList.DataBind();      
        }

}

Uygulama çalıştırıldığında, tablodaki veriler bitinceye kadar DataList kontrolü tekrar eder ve tablo aşağıdaki gibi görüntülenir: