Merhaba,
JSF'te Composite Component diye bir tasarım durumu söz konusudur. Bir nevi template işlemi örneğin projenizde birden fazla datatable'niz var ve hepsinin birbirinin aynısı olmasını istediğiniz durumda Composite Component biçilmiş kaftandır. Bir süre sonra ufak bir değişiklik yapmak istediğiniz ve bunu bütün datatablelarda yapmanız gerekecek. Bu durumda hazırlamış olduğunuz Composite Component de değişiklik yapmanız yeterli olacaktır.
Buradaki konuda PrimeFaces Crud işlemi üzerinden anlatım yapacağım.
Öncelikle Web Pages ' in altında resources klasörünün altına ui adında bir klasör oluşturuyoruz. Sonra datatable.xhtml dosyasını oluşturuyoruz.
datatable.xhtml
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:p="http://primefaces.org/ui"
xmlns:composite="http://xmlns.jcp.org/jsf/composite">
<composite:interface>
<composite:attribute name="id" />
<composite:attribute name="value" />
<composite:attribute name="rowKey" />
<composite:attribute name="selection" />
<composite:attribute name="paginatorPosition" default="bottom"/>
<composite:attribute name="rowselect"/>
<composite:attribute name="contextMenu"/>
<composite:attribute name="rowDblselect"/>
<composite:attribute name="selectListener" method-signature="void listener()"/>
</composite:interface>
<composite:implementation>
<p:dataTable id="#{cc.attrs.id}"
value="#{cc.attrs.value}"
lazy="false"
rowKey="#{cc.attrs.rowKey}"
var="item"
paginator="true"
rows="10"
paginatorPosition="#{cc.attrs.paginatorPosition}"
rowsPerPageTemplate="10,20,30,40,50,100"
selectionMode="single"
selection="#{cc.attrs.selection}">
<p:ajax event="rowSelect" update="#{cc.attrs.rowselect}" listener="#{cc.attrs.selectListener}"/>
<p:ajax event="contextMenu" update="#{cc.attrs.contextMenu}" listener="#{cc.attrs.selectListener}"/>
<p:ajax event="rowDblselect" onsuccess="#{cc.attrs.rowDblselect}"/>
<composite:insertChildren/>
<!-- Sayfalarında kullanacağın datatable tanımın... -->
</p:dataTable>
</composite:implementation>
</html>
Datatable tanımladıktan sonra şimdi bunu sayfalarımıza entegre etmeye geçelim
customer/List.xhtml sayfasını düzenleyelim. Öncelikle oluşturduğumuz tagleri çağırabilmek için sayfa başlığına tagi ekleyelim
xmlns:coco="http://xmlns.jcp.org/jsf/composite/ui"
Şimdi de Primefaces için p:datatable değilde tanımlamış olduğumuz coco:datatable olarak çağıralım.
<coco:datatable id="datalist"
value="#{customerController.items}"
rowKey="#{item.customerId}"
selection="#{customerController.selected}"
selectListener="#{customerController.resetParents}"
rowselect="@form:createButton,@form:viewButton,@form:editButton,@form:deleteButton,@form:CustomerDataTableContextMenu"
rowDblselect="document.getElementById('CustomerListForm:viewButton').click();"
contextMenu="@form:createButton @form:viewButton @form:editButton @form:deleteButton">
Bunu bütün sayfalara uygulayarak sayfalarımızı kontrol altına alabiliriz. Örneğin paginatorPosition default olarak bottom(alt) sayfa değiştiriciyi altta gösterdim. Bunu top yaptığımızda sayfanın üstüne çıkacaktır. Bu da kaç tane sayfaya uyguladıysak hepsine uygulanacaktır. Yani tek tek değiştirmekten kurtulmuş olacağız.
Sorunsuz javalı günler :)
0 Yorumlar