JSF

JSF Dersleri-Composite Components

Merhaba arkadaşlar. Bu yazımızda “Composite Componenets” konusunu öğreneceğiz.

Bileşik Bileşenler Nedir?

Bileşik bileşenler bizim bir yerde yazdığımız kodu diğer sayfalar içinde de kullanmamızı sağlayan yapıdır. Bileşik bileşen ile yazdığımız kod diğer sayfalarda etiket olarak kullanılır. Örneğin bizim kullandığımız h:commandButton, h:inputText birer etikettir. İşte bileşik bileşenler tıpkı bunlar gibi her sayfada ulaşılabilir olacaktır.

Nasıl Kullanılır?

Bileşik bileşenlerinin kullanımına dair bir örnek yaparak nasıl kullanıldığını anlamaya çalışalım. Öncelikle projemizi aşağıdaki resimde olduğu gibi oluşturalım.

2014-06-22 20:45:58

Örneğimize ait kodlar ve açıklaması aşağıda yer almaktadır.

index.xhtml Kodu

 

isim_soyisim.xhtml Kodu

 

kodlar.xhtml Kodu

 

Managedbean.java Kodu

 

Kodların açıklaması

kodlar.xhtml içerisinde yer alan <composite:interface> etiketi bileşik bileşeni oluşturmaya yarayan etikettir. Yani diğer sayfada <tekyazimlikkod:kodlar> etiketi açıldığında etikete ait bileşenler bu etiket içinde tanımlanmaktadır. <composite:attribute> bileşen tanımlamamıza olanak sağlayan etikettir. Bu örnekte <tekyazimlikkod:kodlar> etiketi için 4 adet bileşenimiz vardır.

<composite:implementation> etiketi <composite:interface> etiketininde yazılan bileşenlerin kullanılmasını ve uygulanmasını sağlayan etikettir. #{cc.attrs.Adınız_yaz}ifadesinde cc

bileşen kelimesini, attrs attributes kelimesini temsil etmektedir. Adını_yaz kendi oluşturduğumuz bileşendir. #{cc.attrs.Adınız_yaz}ifadesi ekrana Adınız_yaz bileşenine atanan değeri basacaktır.

<h:inputText id=”Ad” value=”#{cc.attrs.Adınız_degerini_al}”/> ifadesi girilen ismin  Adınız_degerini_al bileşenine atanacağını söyler. Daha sonra bu isim index sayfası içinde managed bean yapısına aktarılmaktadır. Soyad kısmı da aynıdr.

Bu yapı içerisinde bir de buton bulunmaktadır. Bu projeyi yazarken denedim ve gördüm ki butonu bileşik bileşen dışına alırsanız girilen isim soyisim gözükmemekte. Buna da dikkat etmeliyiz.

index.xhtml içinde sizde kodu kendiniz yazarken göreceksiniz ki <tekyazimlikkod:kodlar>etiketi kendiğilinden gelecektir. Adınız_yaz=”Adınız” kısmı kodlar.xhtml içinde yer alan #{cc.attrs.Adınız_yaz} kısmına Adınız yazısını gönderip ekrana Adınız yazılmasını sağlamaktadır. Adınız_degerini_al=”#{managedbean.isim}” ifadesi ise inputText’e girilen ismin managed bean içerisindeki isim değişkenine atanmasını sağlamaktadır. Soyad kısmında da bu söylediklerimiz geçerlidir.

Managed Bean ve isim_soyisim.xhtml sayfalarında ayrıca anlatılacak bir şey yoktur. Daha önce öğrendiğimiz şeylerdir.

Bir de ekran çıktımızı görelim.

2014-06-22 22:25:30

 

 

 

 

 

2014-06-22 22:26:31

 

 

 

 

 

 

Bileşik bileşenlerin kullanımı da bu şekilde arkadaşlar. Gelecek yazımızda JSF ve AJAX’ın birlikte nasıl kullanıldığını öğreneceğiz. Esen kalın.

  • Pingback: JSF-Bileşik Bileşenler | kod5()

  • emre

    Merhaba, dersleri buraya kadar takip ettim. Şuana kadar internetten takip ettiğim en faydalı ve zevkli ders oldu benim için. Teşekkür ederim.

    • Merhaba.
      Size faydası oldu ise ne güzel 🙂
      Başarılar dilerim.
      Kolay gelsin.

  • bilalekrem

    Merhaba hocam,

    Sıkıntım şu ifadesini ide tanımıyor.

    xmlns:composite=”http://java.sun.com/jsf/composite”>

    Sanırsam bu ifadeyle library tanımı yapıyoruz. Bunu yazmama rağmen ifadesine ide de ulaşamıyorum. İnternette araştırma yaptım

    xmlns:cc=”http://xmlns.jcp.org/jsf/composite” >

    böyle bir ifade buldum ancak buda fayda vermedi. Öneriniz var mı acaba ?

    • İlkay Günel

      Merhabalar.
      Geç döndüğüm için özür dilerim. Kullandığınız ide nedir? Ve bir de JSF’i nasıl nasıl kullanıyorsunuz? pom.xml’e bağımlılıklar ekleyerek mi IDE’den destek alarak mı?

    • bilalekrem

      Gene bir karışıklık oldu galiba, yorumları eş zamanlı olarak sildik sanırsam kusura bakmayın dikkat edemedim.

      Netbeans i kullanıyorum ve aslında library ekleniyormuş. Benim dikkatsizliğimden kaynaklı bi durummuş kusura bakmayın :/ ancak şöyle bir farklılık olmuş neden bilemiyorum isterseniz yazınızı buna göre düzenleyin. Syntax olarak composite etiketi cc ye dönmüş

      <composite …. yerine <cc…. olmuş

      • İlkay Günel

        Bu konu ile ilgilenip yazıyı güncelleyeceğim.
        Teşekkür ederim.

  • bilalekrem

    Az önce bir yorum bıraktım, düzenlemeyi bulamadığım için yeniden yolluyorum kusura bakmayın. Aslında library ekleniyormuş. Benim dikkatsizliğimden kaynaklı bi durummuş kusura bakmayın :/ ancak şöyle bir fakrlılık olmuş. jsf2.2 ile olmuş olabilir bilemiyorum isterseniz yazınızı buna göre düzenleyin. Syntax olarak composite bileşeni cc ye dönmüş.

  • Rojbahar Aygaz

    Merhabalar
    Bu yapı veritabanında güncelleme işleminde guncelle xhtml sayfasına id gönderirken de kullanılır mı sizce. Phpde ki linkle id gönderme işlemi gibi mi yani.

  • Sali

    Soyadınız_yaz=”Soyadınız”
    Soyadınız_degerini_al={managedbean.soyisim}”> surada hata vardir cift tirnak ve # eksiktir. Duzeltmenizi rica ederim.