PrimeFaces

PrimeFaces Dersleri-DataList Kullanımı

Merhaba arkadaşlar. DataGrid kullanımı dersimizin ardından bu dersimizde DataList kullanımını öğreneceğiz. DataGrid bileşenimizden farklı olarak bu bileşen verileri listeleme yolu ile kullanıcıya bildirmemiz sağlıyor.

Örnek projemiz üzerinden kullanımına bakalım.

index.xhtml Kodu

Index kodumuz içersinde DataList bileşenimizi p:dataList etiketi ile kullanıyoruz. DataList’in 3 farklı kullanım yöntemi ulunmakta: Temel, Tanımlama ve Sayfalama

Kod içinde birinci DataList temel kullanıma örnek. DataList’in value özelliğine Java kodumuz içindeki verileri tutan listeyi atıyoruz.  Artık alışkın hale geldiğimiz üzre bir de var özelliğine ihtiyacımız var. Type özelliğine ordered ataması yaparak html’deki <li> <ol> </ol> </li> yapısına benzer şekilde sıralanmış şekilde verileri ekrana yazdırıyoruz. Sıralanmamış şekilde isterseniz unordered yazmanız yeterli. Etiketin içinde f:facet name=”header” ifadesini  kullanarak bu DataList’e bir başlık atıyoruz. Akabinde h:outputText bileşenleri ile ekrana yazdırmak istediğimiz verileri yazdırıyoruz.

İkinci DataList kullanımı ise bir tanımlama özelliği ile kullanıma örnek. Temel kullanımdan farklı olarak type özelliğine definition ataması yapıyoruz. Akabinde içeride ikinci bir f:facet etiketi açıyoruz ve bunun name özelliğine description atamasını yapıyoruz. Sonra bu f:facet etiketinin içine tanımlayıcı olarak ne kullanmak istiyorsak onu yazıyoruz.  Bu örnek için tanımlayıcı bir resim olacak.

Üçüncü DataList kullanımı da sayfalama özelliği ile kullanıma örnek. Yapmamız gereken paginator özelliğine true ataması yapmak ve rows özelliğine sayfa açıldığında kaç kayıt görünmesini istediğimizi yazmak. Onun dışında burada bir commandLink’imiz var ve dialog penceresi açıp içerisini güncelleyebiliyor. Daha önce anlattığım için buraya girip yazıyı uzatmıyayım 🙂

DataListBean.java Kodu

DataListBean sınıfımız içersinde verilerimizi tutacak listemizi dolduruyoruz. Bunun yanında bir de dialog penceresinde görünecek bilgileri tutan secilenIlce adında bir değişkenimiz var.

Ilceler.java Kodu

Kendine has özellikleri olan Ilceler sınıfımız.

Ekran Çıktıları

Bazı ekran çıktılarını WordPress kabul etmediği için hızlı resim ile koydum.

Temel kullanımda sıralı liste şeklinde ekrana bastık.

Temel kullanımda sıralı liste şeklinde ekrana bastık.

 

Tanımlama özelliği ile kullanımda tanımlayıcı olarak verdiğimiz resimler de gözükmekte.

Sayfalama özelliği ile kullanımda da ekranda 3 kayıt görünmesini istediğimiz için 3 kayıt göründü ve toplamda 6 kayıt olduğu için 2 sayfa halinde oldu.

Sayfalama özelliği ile kullanımda da ekranda 3 kayıt görünmesini istediğimiz için 3 kayıt göründü ve toplamda 6 kayıt olduğu için 2 sayfa halinde oldu.

 

Büyüteç’e tıkladığımda dialog penceresi açıldı ve başka bilgiler de göründü.

 

Bu yazıda da bu kadar arkadaşlar. Anlayamadığınız yer olursa yorum kısmına yazın lütfen. Elimden geldiğince yardımcı olmaya çalışacağım size. Gelecek yazımızda DataScroller bileşenini öğreneceğiz. Sağlıcakla kalın.