JSF Melih Sakarya JSF Java Server Faces www.mergecons.com www.mergecons.com 1
Java da Web Mimarileri Servlet JSP Struts JSF www.mergecons.com 2
JSF Açılımı Java Server Faces MVC (Model-View-Controller) JSR Standartı (JSR-127, JSR 252) Component Oriented Event Driven Farklı JSF implementasyonları 3. parti JSF bileşenleri (PrimeFaces, Ice Faces, RichFaces, OpenFaces...) www.mergecons.com 3
Specification JSR 127 JSF 1.1 JSR 252 JSF 1.2 JSR 314 JSF 2.0 www.mergecons.com 4
JSF Specification Lead 2001 ortalari Amy Fowler 2002 yilinda Ed Burns Craig McClanahan 2008 Ed Burns Roger Kitain www.mergecons.com 5
Gerçeklemeler (Implementation) MyFaces (Apache) Sun RI (Reference Implementation)... www.mergecons.com 6
Neden JSF Standart olması. Kolay ve anlaşılabilir olması. RAD desteği. Bileşen mimarisinin kolaylığı. Farklı grupların bileşen desteği. Gelişmiş EL (Expression Language desteği). Karmaşık uygulamaları daha kolay geliştirme. www.mergecons.com 7
JSF Yaklaşımı Bileşen yönelimli Olay(event) tabanlı Bileşenlere olay(event) tanımlama Bileşenleri Java objelerine erişim (EL desteği ile) www.mergecons.com 8
JSF Mimarisi www.mergecons.com 9
MVC Model View Controller www.mergecons.com 10
JSF-MVC www.mergecons.com 11
JSF Ortamı web.xml configurasyonu faces-config.xml Core JSF kütüphaneleri 3. party JSF kütüphaneleri www.mergecons.com 12
web.xml Java da web ortamı ile ilgili tanımların bulunduğu xml dosyasıdır. JSF projelerinde JSF tanımları web.xml içerisine yapılmalıdır. WEB-INF altında bulunur. www.mergecons.com 13
web.xml <context-param> <param-name>javax.faces.state_saving_method</param-name> <param-value>server</param-value> </context-param> <listener> <listener-class>com.sun.faces.config.configurelistener</listener-class> </listener> <servlet> <servlet-name>faces Servlet</servlet-name> <servlet-class>javax.faces.webapp.facesservlet</servlet-class> <load-on-startup>1</load-on-startup> </servlet> <servlet-mapping> <servlet-name>faces Servlet</servlet-name> <url-pattern>*.jsf</url-pattern> </servlet-mapping> <login-config> <auth-method>basic</auth-method> </login-config> www.mergecons.com 14
faces-config.xml JSF ile ilgili tanımların bulunduğu dosyadır. WEB-INF altında bulunur. www.mergecons.com 15
faces-config.xml <?xml version="1.0" encoding="utf-8"?> <faces-config version="1.2" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xi="http://www.w3.org/2001/xinclude" xmlns:xsi="http://www.w3.org/2001/xmlschema-instance" xsi:schemalocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_1_2.xsd"> </faces-config> www.mergecons.com 16
JSF Kütüphaneleri jsf-api.jar jsf-impl.jar www.mergecons.com 17
JSF Yaşam Döngüsü www.mergecons.com 18
JSF Arayüz Bileşenleri Tag şeklinde kullanılan tanımlardır. Dinamik önyüzler kodlamak için kullanılır. UIComponent sınıfından türemişlerdir. Genişletilebilir ve yeni tag kütüphaneleri yazılabilir. Tüm bileşenlerde binding attribute u bulunur. www.mergecons.com 19
JSF Arayüz Bileşenleri core Validation, conversion, event handling... 18 standart core tag html presentation (sunum) 25 standart html tag www.mergecons.com 20
html bileşenleri HTML Bileşenleri h:form h:commandbutton h:selectmanymenu h:inputtext h:commandlink h:panelgrid h:inputtextarea h:message h:panelgroup h:inputsecret h:messages h:datatable h:inputhidden h:grapicimage h:column h:outputlabel h:selectonelistbox h:selectmanycheckbox h:outputlink h:selectonemenu h:selectmanylistbox h:outputformat h:selectoneradio h:outputtext h:selectbooleancheckbox www.mergecons.com 21
Core Bileşenler Core Bileşenler f:view f:convertdatetime f:verbatim f:subview f:convertnumber f:facet f:validator f:attribute f:validatedoublerange f:param f:validatelength f:actionlistener f:validatelongrange f:valuechangelistener f:loadbundle f:setpropertychangelistener f:selectitems f:converter f:selectitem www.mergecons.com 22
JSF HTML Bileşenleri Çıktı veren bileşenlerdir. İki JSF standart bileşen kütüphanesinden biridir. Standart olarak h: ile başlarlar Sayfa başında taglib tanımı olmalıdır. Tümünde arayüz bilşenlerinde id ve renderer attribute ları bulunur. www.mergecons.com 23
Tanım <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> www.mergecons.com 24
HTML bileşenleri h:inputtext h:outputtext h:commandbutton h:datatable h:column... www.mergecons.com 25
Core Bileşenler Core bileşenlerdir. İki JSF standart bileşen kütüphanesinden biridir. Standart olarak f: ile başlarlar Sayfa başında taglib tanımı olmalıdır. www.mergecons.com 26
Tanım <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> www.mergecons.com 27
Core Bileşenler f:view f:convertdatetime f:selectitem f:validatelength... www.mergecons.com 28
Bir JSF Sayfası <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <html> <head> <title></title> </head> <body> <f:view> <h:outputtext value="merhaba Dunya" /> </f:view> </body> </html> www.mergecons.com 29
Geliştirme Ortamı Kurulumu Java 1.6 Eclipse JBoss Tools Tomcat www.mergecons.com 30
Sınıf Çalışması Bir JSF projesi oluşturun. Ekrana Merhaba Dünya yazan bir JSF sayfası oluşturun. www.mergecons.com 31
HTML Çıktısı <html> <head> <title></title> </head> <body> Merhaba Dunya </body> </html> www.mergecons.com 32
f:view Root bileşendir. JSF bileşen ağacı bu bileşen ile başlar. www.mergecons.com 33
f:view <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <html> <head> <title></title> </head> <body> <f:view> <! JSF bileşenleri burada olacak --> </f:view> </body> </html> www.mergecons.com 34
HTML Çıktısı <html> <head> <title></title> </head> <body> <!-- JSF bilesenleri burada olacak --> </body> </html> www.mergecons.com 35
JSF Form Bileşeni h:form olarak adlandırılır. Tüm form bileşenleri h:form içerisinde olmalıdır. UIForm tipinde bir bileşendir. prependid false ise form içerisindeki bileşen id leri bozulmaz. www.mergecons.com 36
Form Bileşeni <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <html> <body> <f:view> <h:form id="test"> <!-- Form bileşenleri burada olmalı --> </h:form> </f:view> </body> </html> www.mergecons.com 37
HTML Çıktısı <html> <body> </form> <form id="test" name="test" method="post" action="/demo/demo.jsf" enctype="application/x-www- form-urlencoded"> <input type="hidden" name="test" value="test" /> <input type="hidden" name="javax.faces.viewstate" id="javax.faces.viewstate" value="j_id1:j_id2" /> </body> </html> www.mergecons.com 38
h:commandbutton <h:commandbutton id="submit" value="kaydet" action="#{demobean.kaydet}"> </h:commandbutton> www.mergecons.com 39
h:commandbutton <input type="submit" name="j_id_jsp_384513454_1:j_id_jsp_384513454_3" value="kaydet" /> www.mergecons.com 40
h:commandlink <h:commandlink id="link" action="goto"> <h:outputtext value="deneme Linki" /> </h:commandlink> www.mergecons.com 41
h:commandlink <a id="_id0:link" href="#" onclick="document.forms['_id0']['_id0:link'].value='_id0 :link';document.forms['_id0'].submit();return false;"> </a> Deneme Linki www.mergecons.com 42
h:graphicimage <h:graphicimage id="img" alt="jsf-sun" url="/img/jsf.gif"/> www.mergecons.com 43
h:graphicimage <img id="jsftags:img" src="/demo/img/jsf.gif" alt="jsf-sun" /> www.mergecons.com 44
inputtext <h:inputtext id="adres" value="#{demobeam.adres}" /> www.mergecons.com 45
inputtext <input type="text" name="jsftags:_id1" value="deneme adresi" /> www.mergecons.com 46
h:inputsecret <h:inputsecret redisplay="false" value="#{demobean.sifre}" /> www.mergecons.com 47
h:inputsecret <input id="jsftags:password" type="password" name="jsftags:password" value="123456" /> www.mergecons.com 48
h:inputhidden <h:inputhidden id="hidden" value="deneme" /> www.mergecons.com 49
h:inputhidden <input id="jsftags:hidden" type="hidden" name="jsftags:hidden" value="deneme" /> www.mergecons.com 50
h:inputtextarea <h:inputtextarea id="textarea" rows="4" cols="7" value="test amacli bir yazi.."/> www.mergecons.com 51
h:inputtextarea <textarea id="jsftags:textarea" name="jsftags:textarea" cols="5" rows="3"> Test amacli bir yazi.. </textarea> www.mergecons.com 52
h:outputtext <h:outputtext value="#{denemebean.adres}"/> Escape özelliği ile xml çıktısı verilebilir veya çıktı engellenebilir. escape="true" tag ler gösterilir escape="false" tag ler gösterilmez işletilir www.mergecons.com 53
h:outputtext Deneme amacli bir adres www.mergecons.com 54
h:outputlabel <h:outputlabel for="adres"> <h:outputtext id="addresslabel" value="ev Adresi" /> </h:outputlabel> www.mergecons.com 55
h:outputlabel <span id="jsftags:addresslabel"> Ev Adresi </span> www.mergecons.com 56
h:outputlink <h:outputlink value="http://www.melihsakarya.com"> <f:verbatim>blog Adresi</f:verbatim> </h:outputlink> www.mergecons.com 57
h:outputlink <a href="http://www.melihsakarya.com"> </a> Blog Adresi www.mergecons.com 58
h:outputformat <h:outputformat value="#{msg.formatmesaji}"> <f:param value="melih Sakarya" /> <f:param id="urunadi" value="asus" /> </h:outputformat> www.mergecons.com 59
h:outputformat Merhaba Melih Sakarya Asus dünyasına hoşgeldiniz :) www.mergecons.com 60
h:message Adres Bilgileri <h:message style="color: red" for="adres" /> <h:inputtext id="adres" value="#{demobean.adres}" required="true" /> <h:commandbutton action="save" value="kadet" /> www.mergecons.com 61
h:message Adres Bilgileri <span style="color: red"> Validation Error: Value is required. </span> <input id="jsftags:adres" type="text" name="jsftags:adres" value="" /> <input type="submit" name="jsftags:_id1" value="kaydet" /> www.mergecons.com 62
h:selectbooleancheckbox <h:selectbooleancheckbox title="emailkayit" value="#{demobean.emailkayit}"> </h:selectbooleancheckbox> <h:outputtext value="email adresiniz kayit edilsin mi?" /> www.mergecons.com 63
h:selectbooleancheckbox <input type="checkbox" name="jsftags:_id6" checkedtitle="email" /> Email adresiniz kayit edilsin mi? www.mergecons.com 64
h:selectmanycheckbox <h:selectmanycheckbox id="kullanicilar" value="#{demobean.secilenkullanicilar}"> <f:selectitems value="#{carbean.kullanicilistesi}" /> </h:selectmanycheckbox> www.mergecons.com 65
h:selectmanycheckbox <span id="jsftags:kullanicilar"> <table><tr><td> </td> <td> <label for="jsftags:kullanicilar"> <input name="jsftags:kullanicilar" value="melih" type="checkbox"> Melih Sakarya </input> </label> <label for="jsftags:kullanicilar"> <input name="jsftags:kullanicilar" value="ahmet" type="checkbox"> Ahmet Dursun </input> </label> </td></tr></table></span> www.mergecons.com 66
h:selectmanymenu <h:selectmanymenu id="kullaniciselectmanymenu" value="#{demobean.secilenkullanicilar}"> <f:selectitems value="#{demobean.kullanicilar}" /> </h:selectmanymenu> www.mergecons.com 67
h:selectmanymenu <select id="jsftags:kullanici_selectmanymenu" name="jsftags:kullanici_selectmanymenu" multiple size="1"> <option value="melih">melih Sakarya</option> <option value="ahmet">ahmet Dursun</option> <option value="ayse">ayse Deneme</option> </select> www.mergecons.com 68
h:selectmanylistbox <h:selectmanylistbox id="kullaniciselectmanylistbox" value="#{demobean.secilenkullanicilar}"> <f:selectitems value="#{demobean.kullanicilar}" /> </h:selectmanylistbox> www.mergecons.com 69
h:selectmanylistbox <select id="jsftags:kullaniciselectmanylistbox" name="jsftags:kullaniciselectmanylistbox" multiple size="3"> <option value="melih">melih Sakarya</option> <option value="ahmet">ahmet Dursun</option> <option value="ayse">ayse Deneme</option> </select> www.mergecons.com 70
h:selectoneradio <h:selectoneradio value="#{demobean.kullanici}"> <f:selectitems value="#{demobean.kullanicilar}" /> </h:selectoneradio> www.mergecons.com 71
h:selectoneradio <table><tr> <td> <label for="jsftags:_id9"> <input type="radio" </td> <td> name="jsftags:_id9" value="melih"> Melih Sakarya </input></label> <label for="jsftags:_id9"> <input type="radio" </td> name="jsftags:_id9" value="ahmet"> Ahmet Dursun </input></label> </tr></table> www.mergecons.com 72
h:selectonemenu <h:selectonemenu id="kullanicisec" value="#{demobean.kullanici}"> <f:selectitems value="#{demobean.kullanicilar}" /> </h:selectonemenu> www.mergecons.com 73
h:selectonemenu <select id="jsftags:kullanicisec" name="jsftags:kullanicisec" size="1"> <option value="melih">melih Sakarya</option> <option value="ahmet">ahmet Dursun</option> <option value="ayse">ayse Deneme</option> </select> www.mergecons.com 74
h:selectonelistbox <h:selectonelistbox id="kullanici" value="#{demobean.kullanici}"> <f:selectitems value="#{demobean.kullanicilar}" /> </h:selectonelistbox> www.mergecons.com 75
h:selectonelistbox <select id="jsftags:kullanicisec" name="jsftags:kullanicisec" size="3"> <option value="melih">melih Sakarya</option> <option value="ahmet">ahmet Dursun</option> <option value="ayse">ayse Deneme</option> </select> www.mergecons.com 76
Sınıf Çalışması Kullanıcı kayıt formu oluşturun. Ad Soyad Yaş Cinsiyet Adres Çalışmak istediği şehirler www.mergecons.com 77
h:panelgrid <h:panelgrid columns="4" > <f:facet name="header"> <h:outputtext value="ornek Tablo" /> </f:facet> <h:outputtext value="1" /> <h:outputtext value="2" /> <h:outputtext value="3" /> <h:outputtext value="4" /> <h:outputtext value="5" /> <h:outputtext value="6" /> <h:outputtext value="7" /> </h:panelgrid> www.mergecons.com 78
h:panelgrid <table><thead> </thead> <tbody> <tr><th colspan="4" scope="colgroup">ornek Tablo</th></tr> <tr> </tr> <tr> </tr> <td>1</td> <td>2</td> <td>3</td> <td>4</td> <td>5</td> <td>6</td> <td>7</td> </tbody></table> www.mergecons.com 79
Sınıf Çalışması Panelgrid ile yaptığınız kullanıcı kayıt formunu düzenleyin. www.mergecons.com 80
h:datatable <h:datatable id="kullanici" value="#{demobean.kullanicilar}" var="kullanici"> <h:column> <f:facet name="header"> </f:facet> <h:outputtext value="ad" /> <h:outputtext value="#{kullanici.ad}" /> </h:column> </h:datatable> www.mergecons.com 81
f:selectitems <h:selectonemenu id="kullanicisec" value="#{demobean.kullanici}"> <f:selectitems value="#{demobean.kullanicilar}" /> </h:selectonemenu> www.mergecons.com 82
f:selectitems <select id="jsftags:kullanicisec" name="jsftags:kullanicisec" size="1"> <option value="melih">melih Sakarya</option> <option value="ahmet">ahmet Dursun</option> <option value="ayse">ayse Deneme</option> </select> www.mergecons.com 83
f:selectitem <h:selectonemenu id="renksec" value="#{demobean.renk}"> <f:selectitem itemvalue="red" itemlabel="kirmizi" /> <f:selectitem itemvalue="blue" itemlabel="mavi" /> <f:selectitem itemvalue="black" itemlabel="siyah" /> <f:selectitem itemvalue="green" itemlabel="yesil" /> <f:selectitem itemvalue="white" itemlabel="beyaz" /> </h:selectonemenu> www.mergecons.com 84
f:selectitem <select id="jsftags:renksec" name="jsftags:renksec" size="1"> <option value="red">kirmizi</option> <option value="blue">mavi</option> <option value="black">siyah</option> <option value="green">yesil</option> <option value="white">beyaz</option> </select> www.mergecons.com 85
EL (Expression Language) Özel bir tanım dilidir. JSTL ile benzerlik gösterir. Nesnelere ve metodlara erişim için kullanılır. #{managedbeanadi.attribuate} şeklinde yazılır. Genişletilmiş (Extended) EL seçenekleri bulunabilir. www.mergecons.com 86
EL ve Operatorler + - * / % == eq!= < > <= >= &&! x==5? "Sayi Bes" : "Sayi Bilinmiyor" www.mergecons.com 87
ManagedBean Basit Java sınıflarıdır. Herhangi bir sınıfı miras almasına gerek yoktur. JSF tarafında otomatik oluşturulurlar. JSF context i içerisinden erişilebilirler faces-config.xml içerisinde tanımlanmalıdırlar www.mergecons.com 88
ManagedBean JSF ManagedBean Scope Session Application Request None EL (Expression Language) ile erişilebilirler. www.mergecons.com 89
Örnek Managed Bean public class OrnekManagedBean { private String ad; public String getad() { } return ad; } public void setad(string ad) { } this.ad = ad; www.mergecons.com 90
faces-config.xml tanımı <managed-bean> <managed-bean-name>ornek</managed-bean-name> <managed-bean-class> com.msakarya.ornekmanagedbean </managed-bean-class> <managed-bean-scope>session</managed-bean-scope> </managed-bean> www.mergecons.com 91
Managed Bean Parametreleri Managed Bean ler için parametre gönderimi için kullanılır. Sabit paremetreler veya dışarıdan parametreler gönderilebili. www.mergecons.com 92
Managed Bean Parametreleri <managed-bean> <managed-bean-name>ogrenciduzenlebean</managed-bean-name> <managed-bean-class>ogrenciduzenlebean</managed-bean-class> <managed-bean-scope>request</managed-bean-scope> <managed-property> <property-name>ogrenciid</property-name> <property-class>java.lang.integer</property-class> <value>#{param.ogrenciid}</value> </managed-property> <managed-property> <property-name>ogrenci</property-name> <property-class>ogrencibean</property-class> <value>#{ogrencibean}</value> </managed-property> </managed-bean> www.mergecons.com 93
Value Binding <h:form> <h:inputtext value="#{ornek.ad}" /> </h:form> www.mergecons.com 94
SelectItem <h:selectonemenu value=""> <f:selectitems value="#{ornek.sehirlistesi}"/> </h:selectonemenu> www.mergecons.com 95
SelectItem public String sehir; } public String getsehir() { } return sehir; public void setsehir(string sehir) { } this.sehir = sehir; public List<SelectItem> getsehirlistesi(){ List<SelectItem> sehiler = new ArrayList<SelectItem>(); sehiler.add(new SelectItem("06","Ankara")); sehiler.add(new SelectItem("35","Izmir")); sehiler.add(new SelectItem("34","Istanbul")); return sehiler; www.mergecons.com 96
Action Binding <h:form> <h:inputtext value="#{ornek.ad}" /> <h:commandbutton action="#{ornek.kayit}" value="kaydet" /> </h:form> www.mergecons.com 97
Action Binding public class OrnekManagedBean { private String ad; } public String getad() { return ad; } public void setad(string ad) { this.ad = ad; } public void kaydet(){ System.out.println("kaydetme islemi yapildi"); } www.mergecons.com 98
Scope Yaşam Döngüsü @PostConstruct @PreDestroy www.mergecons.com 99
Scope Yaşam Döngüsü public class DemoBean { private String ad; @PostConstruct public void postconstructdemo(){ System.out.println("postConstructDemo"); } public void test(){ System.out.println("test yapildi"); } @PreDestroy public void predestroydemo(){ System.out.println("preDestroyDemo"); }... } www.mergecons.com 100
Sınıf Çalışması Öğrenci kayıt ekranı hazırlayın. Ad Soyad Bölüm Kullanıcı Adı Şifre Öğrencilerin giriş yapabileceği bir login ekranı hazırlayın. www.mergecons.com 101
Bileşen - rendered Bileşenin render edilip edilmeyeceğini belirtir. Boolean tipinde değer atanmalıdır. www.mergecons.com 102
Bileşen - rendered Boolean deger1=true; Boolean deger2=false; public Boolean getdeger1() { } return deger1; public void setdeger1(boolean deger1) { } this.deger1 = deger1; public Boolean getdeger2() { } return deger2; public void setdeger2(boolean deger2) { } this.deger2 = deger2; www.mergecons.com 103
Bileşen - rendered <h:inputtext value="merhaba Dunya-1" rendered="#{test.deger1}"/> <h:inputtext value="merhaba Dunya-2" rendered="#{test.deger2}"/> www.mergecons.com 104
Sınıf Çalışması Yaptığınız datatable da bir sütunu göstermeyin. Ad değeri kendi adınız olan alanı bold karakter olarak gösterin. Bir butona tıklayınca bir yazıyı gösterin tekrar tıklayınca yazıyı kaldırın. www.mergecons.com 105
Bileşen - Binding Bileşenlerin sunucu taraflı tanımlanmasını sağlar. Binding attribute u ile model alınır. www.mergecons.com 106
Bileşen - Binding <h:inputtext binding="#{demobeaniki.ad}" /> private HtmlInputText ad; public void kaydet() { } System.out.println(getAd().getValue()); //getters setters www.mergecons.com 107
HTML Bileşen Sınıfları HtmlInputHidden HtmlInputSecret HtmlInputText HtmlInputTextarea HtmlOutputFormat HtmlOutputLabel HtmlOutputLink HtmlOutputText HtmlSelectBooleanCheckbox HtmlSelectManyCheckbox HtmlSelectManyListbox HtmlSelectManyMenu HtmlSelectOneListbox HtmlSelectOneMenu HtmlSelectOneRadio UIInput UIOutput UISelectBoolean UISelectMany UISelectOne www.mergecons.com 108
ManagedBean üzerinden farklı bir managedbean e ulaşım <managed-bean> <managed-bean-name>ogrenciduzenlebean</managed-bean-name> <managed-bean-class>ogrenciduzenlebean</managed-bean-class> <managed-bean-scope>request</managed-bean-scope> <managed-property> <property-name>ogrenciid</property-name> <property-class>java.lang.integer</property-class> <value>#{param.ogrenciid}</value> </managed-property> <managed-property> <property-name>ogrenci</property-name> <property-class>ogrencibean</property-class> <value>#{ogrencibean}</value> </managed-property> </managed-bean> www.mergecons.com 109
ManagedBean üzerinden farklı bir managedbean e ulaşım Kullanici k = (Kullanici)FacesContext.getCurrentInstance().getELContext().getELResolver().getValue(FacesContext.getCurrentInstance().getELContext(), null, "kullanici"); System.out.println("Ad Soyad = " +k.getad()+" "+ k.getsoyad()); www.mergecons.com 110
ManagedBean üzerinden http bilgilerine erişim HttpServletRequest request = (HttpServletRequest) FacesContext.getCurrentInstance().getExternalContext().getRequest(); HttpServletResponse response = (HttpServletResponse) FacesContext.getCurrentInstance().getExternalContext().getResponse(); HttpSession session = request.getsession(); Cookie[] cookies = request.getcookies(); www.mergecons.com 111
valuechangelistener <h:selectonemenu value="#{demobean.sehir}" immediate="true" valuechangelistener="#{demobean.valuechangemetod}" onchange="submit();"> <f:selectitem itemvalue="06" itemlabel="ankara"/> <f:selectitem itemvalue="34" itemlabel="istanbul"/> <f:selectitem itemvalue="35" itemlabel="izmir"/> </h:selectonemenu> <br /> <h:selectonemenu value="#{demobean.ilce}"> <f:selectitems value="#{demobean.ilceler}"/> </h:selectonemenu> www.mergecons.com 112
valuechangelistener private String sehir; private String ilce; private List<SelectItem> ilceler = new ArrayList<SelectItem>(); public void valuechangemetod(valuechangeevent event){ } ilceler.clear(); if(event.getnewvalue().equals("34")){ } ilceler.add(new SelectItem("Besiktas")); ilceler.add(new SelectItem("Kadikoy")); else if(event.getnewvalue().equals("35")){ } ilceler.add(new SelectItem("Karsiyaka")); ilceler.add(new SelectItem("Bornova")); www.mergecons.com 113
Sınıf Çalışması Fakülte seçince bölümleri listeleyen bir uygulama yapınız. www.mergecons.com 114
h:datatable <h:datatable id="kullanici" value="#{demobean.kullanicilar}" var="kullanici"> <h:column> <f:facet name="header"> </f:facet> <h:outputtext value="ad" /> <h:outputtext value="#{kullanici.ad}" /> </h:column> </h:datatable> www.mergecons.com 115
h:datatable header - footer <h:column> <f:facet name="header"> Hello World </f:facet> <h:outputtext value="#{kayit.deger}" /> </h:column> www.mergecons.com 116
h:datatable public class Ogrenci { public Ogrenci() { } public Ogrenci(String ad, String soyad) { } this.ad = ad; this.soyad = soyad; String ad; String soyad; } public String getad() { return ad; } //diger set ve get metodlari www.mergecons.com 117
h:datatable public class Test { } public Test(){ } ogrenciler.add(new Ogrenci("Melih","Sakarya")); ogrenciler.add(new Ogrenci("Ahmet","Dursun")); List<Ogrenci> ogrenciler = new ArrayList<Ogrenci>(); public List<Ogrenci> getogrenciler() { } return ogrenciler; public void setogrenciler(list<ogrenci> ogrenciler) { } this.ogrenciler = ogrenciler; www.mergecons.com 118
h:datatable <h:datatable value="#{test.ogrenciler}" var="ogrenci"> <h:column> <f:facet name="header"> <h:outputtext value="ad" /> </f:facet> <h:outputtext value="#{ogrenci.ad}" /> </h:column> <h:column> <f:facet name="header"> <h:outputtext value="soyad" /> </f:facet> <h:outputtext value="#{ogrenci.soyad}" /> </h:column> </h:datatable> www.mergecons.com 119
Sınıf Çalışması Bir datatable içerisindeki verileri listeleyin. Şehir Şehir İsmi Plaka www.mergecons.com 120
h:datatable style.satir1 { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: black; background-color: white; text-indent: 6px; }.satir2 { font-family: Arial, Helvetica, sans-serif; font-size: 12px; color: white; background-color: black; text-indent: 6px; } www.mergecons.com 121
h:datatable style <h:datatable value="#{test.ogrenciler}" var="ogrenci" rowclasses="satir1,satir2">> www.mergecons.com 122
Sınıf Çalışması Hazırladığınız datatable satırlarını renklendirin. www.mergecons.com 123
Parametre Gönderimi <h:form> <h:datatable value="#{ogrencibean.ogrenciler}" var="ogr"> <h:column> <f:facet name="header"> <h:outputtext value="sil" /> </f:facet> <h:commandlink action="#{ogrencibean.sil}" value="sil" > <f:setpropertyactionlistener value="#{ogr}" target="#{ogrencibean.secilenogrenci}" /> </h:commandlink> </h:column> //... </h:datatable> </h:form> www.mergecons.com 124
Parametre Gönderimi public class OgrenciBean { private List<Ogrenci> ogrenciler = new ArrayList<Ogrenci>(); private Ogrenci secilenogrenci; } public void sil(){ System.out.println(secilenOgrenci.getAd()); System.out.println(secilenOgrenci.getSoyad()); www.mergecons.com 125
Navigation Yönlendirmeler için kullanılır. Duruma göre yönlendirmeler yapılabilir. Ortak veya her sayfa için ayrı yönlendirmeler olabilir. www.mergecons.com 126
Navigation www.mergecons.com 127
Navigation <navigation-rule> <from-view-id>/login.jsp</from-view-id> <navigation-case> <from-outcome>basarili</from-outcome> <to-view-id>/basarili.jsp</to-view-id> </navigation-case> </navigation-rule> www.mergecons.com 128
Navigation <h:commandbutton action="#{test.girisyap}" value="giris Yap" /> www.mergecons.com 129
Navigation public String girisyap(){ } return "basarili"; www.mergecons.com 130
Navigation <navigation-rule> <from-view-id>/test2.jsp</from-view-id> <navigation-case> <from-outcome>basarili</from-outcome> <to-view-id>/basarili.jsp</to-view-id> </navigation-case> <navigation-case> <from-outcome>basarisiz</from-outcome> <to-view-id>/basarisiz.jsp</to-view-id> </navigation-case> </navigation-rule> www.mergecons.com 131
Sınıf Çalışması Kullanıcı kayıt ekranı hazırlayın Kayıt başarılı ise kullanıcı giriş ekranına yönlendirsin. Kullanıcı giriş ekranı hazırlayın Doğru giriş yaptığı durumda başarılı Hatalı girişte başarısız ekranına yönlendirsin www.mergecons.com 132
Glabal Navigation <navigation-rule> <from-view-id>*</from-view-id> <navigation-case> <from-outcome>giris</from-outcome> <to-view-id>/login.jsp</to-view-id> </navigation-case> </navigation-rule> www.mergecons.com 133
Glabal Navigation <h:commandlink action="giris" value="giris Sayfasi" /> www.mergecons.com 134
Direk Yönlendirme Sayfanın tekrar çağırımını sağlar <navigation-rule> <from-view-id>/ogrenci.jsp</from-view-id> <navigation-case> <from-outcome>duzenle</from-outcome> <to-view-id>/ogrenciduzenle.jsp</to-view-id> <redirect/> </navigation-case> </navigation-rule> www.mergecons.com 135
Tanım Dosyalarını Ayırma <context-param> <param-name>javax.faces.config_files</param-name> <param-value> /WEB-INF/managed-beans.xml, /WEB-INF/navigation.xml </param-value> </context-param> www.mergecons.com 136
navigation.xml <faces-config> <navigation-rule> <from-view-id>/ogrenci.jsp</from-view-id> <navigation-case> <from-outcome>duzenle</from-outcome> <to-view-id>/ogrenciduzenle.jsp</to-view-id> </navigation-case> </navigation-rule> </faces-config> www.mergecons.com 137
managed-beans.xml <faces-config> <managed-bean> <managed-bean-name>demobean</managed-bean-name> <managed-bean-class>demobean</managed-bean-class> <managed-bean-scope>request</managed-bean-scope> </managed-bean>... </faces-config> www.mergecons.com 138
Internationalization i18n Çok dillilik sağlar. Bir uygulama içerisinde birden fazla dil desteği verilebilir. Kullanıcının yerel ayarlarına göre dil seçenekleri çıkabilir. www.mergecons.com 139
Properties dosyaları >JavaSource\messages.properties >classes\messages.properties www.mergecons.com 140
i18n Properties dosyaları >messages.properties >messages_tr.properties >messages_en.properties >messages_fr.properties www.mergecons.com 141
messages.properties name = ad lastname = soyad www.mergecons.com 142
messages_en.properties name = name lastname = lastname www.mergecons.com 143
messages_tr.properties name = ad lastname = soyad www.mergecons.com 144
Properties dosyaları <f:loadbundle var="msg" basename="messages"/> <h:outputtext value="#{msg.name}"/> www.mergecons.com 145
i18n <f:view locale="#{facescontext.externalcontext.requestlocale}"> <f:view locale="tr"> <f:view locale="en"}"> www.mergecons.com 146
i18n <f:loadbundle var="msg" basename="messages" /> <h:outputtext value="#{msg.name}" /> www.mergecons.com 147
i18n tarayıcı ayarları Internet Explorer Firefox Tools, Internet Options, Languages Click Add, select language, OK Move to top of list using "Move Up" Tools, Options, Advanced, General, Languages Click Add, select language, Add Move to top of list using "Move Up" www.mergecons.com 148
Genel Resource Tanımı <application> <resource-bundle> <base-name>messages</base-name> <var>messages</var> </resource-bundle> <locale-config> <default-locale>tr</default-locale> <supported-locale>en</supported-locale> <supported-locale>de</supported-locale> </locale-config> </application> www.mergecons.com 149
Sınıf Çalışması 2 dilde destek veren bir rezervasyon formu hazırlayın. Ad Soyad Giriş Tarihi Çıkış Tarihi www.mergecons.com 150
UTF-8 Desteği native2ascii -encoding UTF-8 messages_ tr.properties messages_tr.properties www.mergecons.com 151
Parametrik mesajlar Var olan mesajlar parametreler ile birleştirilebilir. www.mergecons.com 152
Parametrik mesajlar name = ad lastname = soyad message = Sn. {0} {1} mesajiniz {2} adresinize gonderilmistir. www.mergecons.com 153
Parametrik mesajlar <h:outputformat value="#{msg.message}"> <f:param value="melih" /> <f:param value="sakarya" /> <f:param value="melih.sakarya@gmail.com" /> </h:outputformat> www.mergecons.com 154
Parametrik mesajlar Sn. Melih Sakarya mesajiniz melih.sakarya@gmail.com adresinize gonderilmistir www.mergecons.com 155
Parametrik mesajlar <h:outputformat value="#{msg.message}"> <f:param value="#{kullanici.ad}" /> <f:param value="#{kullanici.soyad}" /> <f:param value="#{kullanici.email}" /> </h:outputformat> www.mergecons.com 156
Converter Alınan değerleri çevrim için kullanılır. Değerlerin nesne ve karakter dönüşleri vardır. www.mergecons.com 157
Converter <h:form> <h:inputtext value="#{demo.testvalue}" > <f:convertnumber /> </h:inputtext> <h:commandbutton action="#{demo.testaction}" value="test" /> </h:form> www.mergecons.com 158
Converter public class Demo { } public int testvalue; public int gettestvalue() { } return testvalue; public void settestvalue(int testvalue) { } this.testvalue = testvalue; public void testaction(){ } System.out.println("testValue... " + testvalue); www.mergecons.com 159
Standart Converter lar Converter Adı javax.faces.bigdecimal javax.faces.biginteger javax.faces.boolean javax.faces.byte javax.faces.character javax.faces.datetime javax.faces.double javax.faces.float Converter Sınıfı javax.faces.convert.bigdecimalconverter javax.faces.convert.bigintegerconverter javax.faces.convert.booleanconverter javax.faces.convert.byteconverter javax.faces.convert.characterconverter javax.faces.convert.datetimeconverter javax.faces.convert.doubleconverter javax.faces.convert.floatconverter www.mergecons.com 160
Tarih Çevrimi <h:form> <h:inputtext value="#{demo.testvalue}" > <f:convertdatetime pattern="dd.mm.yyyy"/> </h:inputtext> <h:commandbutton action="#{demo.testaction}" value="test" /> <br/> <h:messages /> </h:form> www.mergecons.com 161
Tarih Çevrimi public class Demo { public Date testvalue; public Date gettestvalue() { return testvalue; } public void settestvalue(date testvalue) { this.testvalue = testvalue; } } public void testaction(){ } System.out.println("testValue... " + testvalue); www.mergecons.com 162
Sınıf Çalışması Doğum tarihinizi console ekranına yazdıran bir uygulama yazınız. www.mergecons.com 163
Özel Converter Custom Converter Var olan converter ların yeterli gelmediği durumlarda kullanılır. Sınıflar için uygulanabilirler. Sınıfların arayüz tarafında gösterimini saglayabilirler. www.mergecons.com 164
Custom Converter getasobject getasstring -Obje değeri -Karakter değeri www.mergecons.com 165
Custom Converter public Object getasobject(facescontext context, UIComponent component,string value) public String getasstring(facescontext context, UIComponent component,object value) www.mergecons.com 166
Custom Converter Phone Number public class PhoneNumber { } String code; String number; //Setter getter @Override public String tostring() { } return code +" "+number; www.mergecons.com 167
Custom Converter Phone Number public class PhoneConverter implements Converter { } public Object getasobject(facescontext context, UIComponent component, String value) { } if (value == null value.equals("")) { } return null; String[] s = value.split(" "); //532 1232244 PhoneNumber phone = new PhoneNumber(); phone.setcode(s[0]); phone.setnumber(s[1]); return phone; public String getasstring(facescontext context, UIComponent component,object value) { } return value.tostring(); www.mergecons.com 168
Custom Converter Phone Number <converter> <converter-id>phonenumber</converter-id> <converter-class>phoneconverter</converter-class> </converter> www.mergecons.com 169
Custom Converter Phone Number <h:form> <h:inputtext value="#{demo.testvalue}"> <f:converter converterid="phonenumber"/> </h:inputtext> <h:commandbutton action="#{demo.testaction}" value="test" /> <br /> <h:messages /> </h:form> www.mergecons.com 170
Sınıf Çalışması Doğum tarihinizi custom converter ile 18.12.1988 şeklinde alacak bir converter yazınız. www.mergecons.com 171
Validation Geçerlilik denetimi yapar. Geçerliliğe uymayanlar validation fazında yakalanır. Özel validation lar yazmak mümkündür. www.mergecons.com 172
Required alanlar Ad : <h:inputtext value="#{test4.ad}" required="true" id="ad" /> <h:message for="ad"/> <h:commandbutton action="#{test4.kaydet}" value="kaydet"/> www.mergecons.com 173
requiredmessage Ad : <h:inputtext value="#{test4.ad}" required="true" id="ad" requiredmessage="ad alani bos olamaz"/> <h:message for="ad"/> <h:commandbutton action="#{test4.kaydet}" value="kaydet"/> www.mergecons.com 174
Mesajlar <h:inputtext id="ad" value="#{ogrenci.ad}" /> <h:message for="ad" /> <h:inputtext id="soyad" value="#{ogrenci.soyad}" /> <h:message for="soyad" /> www.mergecons.com 175
Mesajlar <h:messages/> <h:inputtext id="ad" value="#{ogrenci.ad}" /> <h:inputtext id="soyad" value="#{ogrenci.soyad}" /> www.mergecons.com 176
Mesajlar FacesContext.getCurrentInstance().addMessage (null, new FacesMessage("Kayit basari ile yapildi")); www.mergecons.com 177
Sınıf Çalışması Üye formu yaratınız ve bunlardan iki tanesinin boş girilmesini engelleyiniz. Ad Soyad Adres Email www.mergecons.com 178
Validation <f:validatelength minimum="5" maximum="12" /> <f:validatedoublerange minimum="0.5"/> <f:validatelongrange minimum="25"/> www.mergecons.com 179
immediate Ad : <h:inputtext value="#{test4.ad}" required="true" id="ad" requiredmessage="ad alani bos olamaz"/> <h:message for="ad"/> <h:commandbutton action="#{test4.kaydet}" value="kaydet" immediate="true"/> www.mergecons.com 180
f:validatelength <h:inputtext value="#{test.ad}" id="ad" validatormessage= "Ad alani 5-10 karakter araliginda olmali"> <f:validatelength minimum="5" maximum="10" /> </h:inputtext> <h:commandbutton action="#{test.kaydet}" value="kaydet" /> <h:message for="ad" /> www.mergecons.com 181
f:validatedoublerange <h:inputtext value="#{test4.dolar}" id="ad" validatormessage="dolar kuru 1.5 ten asagi olamaz"> <f:validatedoublerange minimum="1.5"/> </h:inputtext> www.mergecons.com 182
f:validatelongrange <h:inputtext value="#{test4.km}" id="ad" validatormessage="uzunluk 100 den asagi olamaz"> <f:validatelongrange minimum="100"/> </h:inputtext> www.mergecons.com 183
Mesajların Türkçeleştirilesi javax.faces.component.uiinput.required javax.faces.validator.not_in_range javax.faces.validator.doublerangevalidator.maximum javax.faces.validator.longrangevalidator.maximum javax.faces.validator.doublerangevalidator.minimum javax.faces.validator.longrangevalidator.minimum javax.faces.validator.doublerangevalidator.type javax.faces.validator.longrangevalidator.type javax.faces.validator.lengthvalidator.maximum javax.faces.validator.lengthvalidator.minimum www.mergecons.com 184
Sınıf Çalışması Kullanıcı kaydı yaparken aşağıdaki kontrolleri yapınız. 18 yaşından küçük olamaz. Ad ve soyad boş olamaz. Şifre 5 karakterden küçük olamaz. www.mergecons.com 185
Custom Validator İhtiyaçları karşılamayan durumlarda özel yazılan validator lardır. www.mergecons.com 186
Custom Validator public void fiyatkontrol(facescontext context, } UIComponent componenttovalidate, Object value) throws ValidatorException { double fiyat = ((Double) value).doublevalue(); if (fiyat <= 50) { } FacesMessage message = new FacesMessage("50 den asagi bir fiyat olamaz."); throw new ValidatorException(message); www.mergecons.com 187
Custom Validator <h:inputtext value="#{test4.fiyat}" id="fiyat" validator="#{test4.fiyatkontrol}"/> <h:commandbutton action="#{test4.kaydet}" value="kaydet" /> <h:message for="fiyat" /> www.mergecons.com 188
Sınıf çalışması A- ile başlamak zorunda olan bir validator kontrolü yazın. www.mergecons.com 189
PhaseListener JSF yaşam döngüsünü dinlemek için kullanılır. Yaşam döngüsünün istenilen adımında çalıştırılır. www.mergecons.com 190
PhaseListener PhaseId ANY_PHASE APPLY_REQUEST_VALUES INVOKE_APPLICATION PROCESS_VALIDATIONS RENDER_RESPONSE RESTORE_VIEW UPDATE_MODEL_VALUES www.mergecons.com 191
PhaseListener public class DemoListener implements PhaseListener { public PhaseId getphaseid() { return PhaseId.RESTORE_VIEW; } public void beforephase(phaseevent event) { } public void afterphase(phaseevent event) { } } www.mergecons.com 192
PhaseListener public class DemoListener implements PhaseListener { } public PhaseId getphaseid() { } System.out.println("getPhaseId() calisti"); return PhaseId.RESTORE_VIEW; public void beforephase(phaseevent event) { } System.out.println("beforePhase() calisti"); public void afterphase(phaseevent event) { } System.out.println("afterPhase() calisti"); FacesContext fc = event.getfacescontext(); String page = fc.getviewroot().getviewid(); System.out.println("page = "+page); www.mergecons.com 193
PhaseListener <lifecycle> <phase-listener>demolistener</phase-listener> </lifecycle> www.mergecons.com 194
PhaseListener <f:phaselistener type = "com.mergecons.demolistener"/> www.mergecons.com 195
Sınıf Çalışması Her sayfada kullanıcı yetki kontrolü yapan bir PhaseListener yazınız. www.mergecons.com 196
Son Sorular???? www.mergecons.com 197