ASP.net ile ListView kullanılarak tablo şeklinde listeleme ve Data Pager ile sayfalama

 


Merhaba .

Bu makalede ASP.net 3.5 ile beraber tanıştığımız Data Kontolleriden olan  ListView kontolü ve ListView ile berabaer çalışan DataPager nesnelerini inceliyoruz.
               Listview kontolü daha önce kullandığımız DataList , GridView, Repeater gibi nesnelerin yerine kullanılabilecek güzel bir konroldür. Örneğin GridView kullandığımız zaman verileri alt alta listelemek zorundaydık ya da DataList kullandığımız zaman verileri sayfalamak konusunda sıkıntı olurdu.
   ListView ile Databaseden çektiğimiz veileri tablo şeklinde isteğimiz gibi ekrana bastırıp aynı zamanda DataPager ile de ufak birkaç işlem sonunda istediğimiz formatta ekran çıktısını alabileceğiz.
ListView in temel olarak 3 adet template türü bulunuyor.

    Bunlardan ilki <LayoutTemplate>
Bu template altına girilen veriler  Repeater’daki HeaderTemplate ve FooterTemplate şablonlarının birleşimi gibidir.
 İkinci template : <GroupTemplate>
Bu template ise listview de veriler satır satır listelenmek yenine tablo şeklinde listelenmek isteniyorsa kullanılır ve listview in GroupItemCount değerine atanan sayıya  göre verileri ekranda tablo şeklinde gösterir. 
      Örneğin : GroupItemCount=”3 “ olarak belirtilirse ekran çıktı aşağıdaki gibi olur.

“Veri 01” | “Veri 02”  |  “Veri 03”
“Veri 04” | “Veri 05”  |  “Veri 06”
“Veri 07” | “Veri 08”  | “Veri 09”

Üçüncü tepmlate türü : <ItemTemplate>
 Bu  template te zaten yabancı değiliz .itemtemplate içerisinde databseden çekilen verileri gösterilir.
Listview de sayfalama konusu ise oldukça kolay bir şekilde yapılabiliyor. Sayfalama için yine ASP.net 3.5 ile gelen DataPager nesnesi kullanılır. Yapılmamız gereken tek şey sayfamıza bir adet datapager eklemek ve PagedControlID parametresine de sayfalama yapmak istediğimiz ListView kontolünün id sini vermek.


Şimdi   ListView i incelemek için her zamanki gibi örnek bir senaryo üzerinden hareket edelim .
Senaryoya göre veritabanından çekilen ürünleri   tablo şeklinde listeleyip sayfalama yapacağız.
 yeni bir web sitesi açıp data sekmesinin altından  sayfamıza bir adet listview ekliyoruz ve aşağıdaki gibi düzenliyoruz.

 Default.aspx

 <asp:ListView ID="ListView1" runat="server" GroupItemCount="3" >
        <LayoutTemplate>
        <table>
        <tr>
        <td>
            <table border="0" cellpadding="5">
        <asp:PlaceHolder ID="groupPlaceHolder" runat="server"></asp:PlaceHolder>
            </table>
        </td>
        </tr>
        </table>
       
        </LayoutTemplate>
        <GroupTemplate>
        <tr>
        <asp:PlaceHolder runat="server" ID="itemPlaceHolder"></asp:PlaceHolder>
        </tr>
        </GroupTemplate>
        <ItemTemplate>
        <td>
     
      <%# Eval("Name")%><br />
      Fiyat :&nbsp;<%# Eval("ShortDescription")%></td>
        </ItemTemplate>
        </asp:ListView>
<asp:DataPager ID="DataPager1" runat="server" PagedControlID="ListView1"
        PageSize="10" QueryStringField="Sayfa"  onprerender="DataPager1_PreRender">
        <Fields>
            <asp:NumericPagerField />
            <asp:NextPreviousPagerField />
        </Fields>
    </asp:DataPager>



 
Default.aspx.cs

 
Fonkisyonlar fonk = new Fonkisyonlar();
    protected void Page_Load(object sender, EventArgs e)
    {
   if (!IsPostBack)
    {
           SqlConnection cn = fonk.baglan();//Veritaanına bağlandık.
           DataSet ds = new DataSet();
           SqlDataAdapter da = new SqlDataAdapter("Select * from Urun",cn);
           da.Fill(ds, "Urun");
           ListView1.DataSource = ds;
           ListView1.DataBind();
           cn.Close();
      }
    }


protected void DataPager1_PreRender(object sender, EventArgs e)
  {

    SqlConnection cn = fonk.baglan();//Veritaanına bağlandık.
    DataSet ds = new DataSet();
    SqlDataAdapter da = new SqlDataAdapter("Select * from Urun", cn);
    da.Fill(ds, "Urun");
    ListView1.DataSource = ds;
    ListView1.DataBind();
    cn.Close();

  
  }

Ne yaptık ?

 Listview ‘ in oluşturduktan sonra  GroupItemCount="3" yaptıkböylece verilerimizin ekranda üçerli gruplar halinde gösterileceğini belirttik. Sonraki adımda ListView in teplatelerine geçtik ve ilk olarak <LayoutTemplate> içerisine verikeri göstermek isteğimiz şablonu belirttik. Yani verilerimizi tablo içinde göstereceğimizi belirttik ve verilerin geleceği  yere  bir <asp:PlaceHolder>
koyduk. Bu PlaceHolder in ID değerinde genel şablonmuzun altında gruplama işlemini yapacak olan GruopTemplate (bu örnekte gruplama 3 erli olarak yapılıyor ) içerindeki Place Holder a ayit ID yi belirttik.  Sonra <GroupTemplate> boğumunu açtık ve her satıırın bir <tr> tagı anlamına geldiğini belirttikten ve birtane daha <asp:PlaceHolder> koyduk ve ID değerini de itemtemplate e verdiğimiz ID  yi verdik.
 Son olarak verilerimizin gösterileceği template olan ItemTemplate e geçip veilerimizi ekrana yazdırdık.
               Verileri ekranda sitedğimiz formatta gösterdik sıra geldi sayfalama işlemine . Sayfalama için Listvew in altına bir DataPager sürükledik ve bıraktık.



 Datapager in Properties inden  PagedControlIDdeğerini ListView1 seçerek DataPager a  sayfalama yapacağı kontrolü göstermiş olduk. QueryStringField="Sayfa" bölümü sayfalama işlemini url ile yapmak için seçilebilir seçmesenizde çalışaktır parametere olarak istediğiniz ismi verebilirsiniz ben sayfa yazdım. Yine Properties den  <Fields> boğumunun içerisnde de sayfalama sonrasında sayfalar arasında gezinirken kullanmak isteğimiz Nevigasyon tipini seçtik.

Ekran görüntüsü.

 



    Previous
Ve Next yerine türkçe kelime yazmak için datapagerin Properties alanından ingilizce kelimeleri silip   türkçesini yazabilirsiniz.


Kolay Gelsin.
 
 

 

Bunu beğen
Paylaş

Yorumlar
Yorum Yaz
İsim : (*)
E-mail :
Web Adresi:
:
(*)
 
Kapat