Eclipse Corner cikk

WTP ismertetők - JavaServer Faces Tools ismertető

Összegzés
Ebben az ismertetőben összeállítunk és futtatunk egy JavaServer Faces alkalmazást és kiemeljük a JSF Tools projekt által hozzáadott szolgáltatásokat.

Szerző: Raghu Srinivasan, Oracle Corporation.
2009 június 15


Bevezetés

Ebben az ismertetőben létrehozunk és futtatunk egy JavaServer Faces képességekkel rendelkező webalkalmazást. A WTP JSF Tools projekt olyan szolgáltatásokat biztosít amelyek egyszerbbé teszik az alkalmazások összeállítását, beállítását és végrehajtását. Ezek között az eszközök között szerepel a Web Page Editor, amelynek segítségével grafikus felületen szerkeszthetők a JSF-JSP weboldalak, a JSF-JSP oldalak szintaktikai és szemantikai ellenőrzése és a Faces konfigurációszerkesztő, amely az alkalmazás konfigurációs erőforrásfájljának szerkesztésére szolgál.

Az ismertetőben leírtak kipróbálása előtt érdemes lehet meglátogatni a következő oldalt: Egy webalkalmazás összeállítása és futtatása. Az említett ismertető bemutatja a kiszolgáló példány beállítását, amely témakört jelen ismertető nem tárgyal.

Beállítás

A Web Page Editor alapértelmezett szerkesztővé tétele JSP oldalak számára

A JSF Tools Projekt által biztosított Web Page Editor (WPE) NEM a JSP fájlok alapértelmezett szerkesztője. A következő lépések elvégzésével teheti a WPE szerkesztőt a JSP fájlok alapértelmezett szerkesztőjévé:

JavaServer Faces projekt létrehozása

Hozzon létre egy JSFTutorial nevű Új dinamikus webalkalmazást. A cél futási környezetet állítsa a következőre: Apache Tomcat 6.0
A beállítások részben válassza a JavaServer Faces Project v1.2 lehetőséget. Lépje át a következő két oldalt a JSF Képességek oldalra jutáshoz.

Új dinamikus webalkalmazás


A JSF képességek oldalon a JSF függvénytár típusa legördülő listából válassza ki a Felhasználói függvénytár elemet.

JSF képességek oldal


Kattintson a Függvénytár letöltése ikonra. Megjelenik a Függvénytár letöltése oldal a JSF megvalósítás JAR fájlok szolgáltatóinak listájával. Válassza ki a Sun Microsystems függvénytárát. Kattintson a Tovább gombra. Fogadja el a licencet, majd kattintson a Befejezés gombra.

JSF képességek oldal


Az eszköz letölti a JAR fájlokat, létrehoz egy JDT felhasználói függvénytárat és hozzáadja azt az aktuális projekthez. Jelölje be az új függvénytár jelölőnégyzetet, ha nincs bejelölve. Ezután kattintson a Függvénytárak kezelése ikonra.

JSF képességek oldal



Hozzon létre egy JDT felhasználói függvénytárat a JSTL jar fájlok tárolásához. Kattintson az OK gombra.

JSF képességek oldal



A JSTL függvénytár megjelenik a JSF képességek párbeszédablakban. Jelölje ki a függvénytárat, majd kattintson a Befejezés gombra.

JSF képességek oldal



JSF alkalmazása elkészült. Figyelje meg azt, hogy a web.xml fájl frissítésre került a Faces szervlettel és szervletleképezéssel, létrejött egy csonk JSF alkalmazáskonfigurációs fájl (faces-config.xml) és az összeépítési útvonal frissült a megvalósítási JAR fájlokkal.



Ha rendelkezik meglévő Dinamikus webalkalmazással, akkor lehetősége nyílik ahhoz JSF képességeket adni a következő elemek választásával:
Projekt tulajdonságai > Projektszempontok > Projektszempontok hozzáadása/eltávolítása…

Egy JSF JSP oldal létrehozása

A JSP oldal varázsló használatával hozzon létre egy login.jsp nevű oldalt az új alkalmazás Web content mappájában. A varázsló Sablon választása oldalán válassza az Új JSP(html) sablont. Kattintson a Befejezés gombra. Az oldal megjelenik a Web Page Editor alkalmazásban, ahogyan az alább látható


Web Page Editor


Nyissa meg a Tulajdonságok nézetet. Kattintson a jobb egérgombbal a tervezői rajzolási területre és a helyzetérzékeny menüben válassza ki a Megjelenítés->Tulajdonságok lehetőséget. Várjon, amíg a "Tulajdonságok olvasása" párbeszédablak eltűnik.

Adjon egy CommandButton elemet a rajzolási területhez.


WPE - CommandButton hozzáadása


PanelGrid hozzáadása
Módosítsa a panelrácson belüli összetevőket


WPE - PanelGrid hozzáadása


A Projektböngészőben bontsa ki a következő csomópontot: JSFTutorial->WebContent. Kattintson duplán a faces-config.xml fájlra. Ez elindítja a Faces beállításszerkesztőt. Válassza a Kezelt komponens lapot.

Faces beállításszerkesztő kezelt komponens

Kattintson a Hozzáadás gombra. Ez elindítja az Új felügyelt bean varázslót. Válassza az Új Java osztály létrehozása lehetőséget. A varázsló következő panelén írja be a csomag nevét com.tutorial formában, valamint az osztály nevét LoginBean formában. Kattintson a Befejezés gombra.

Új felügyelt bean

Ez létrehozza a Java osztályt és felügyelt beanként regisztrálja azt. Mentse a Faces konfiguráció szerkesztőt. Egy Java osztály szerkesztéséhez kattintson a ManagedBean osztály hiperhivatkozásra a Felügyelt bean oldalon az ábrán látható módon. Ez elindítja a Java szerkesztőt.

Faces konfiguráció szerkesztő - Felügyelt bean lap


Szerkessze a com.tutorial.LoginBean Java osztályt. Adja hozzá az alábbi kódot és mentse.

LoginBean
A Projektböngésző nézetben kattintson a jobb egérgombbal a login.jsp JSP oldalra, majd kattintson az előugró menü Érvényesítés menüpontjára. Megjegyzés: az oldalnak most már érvényesnek kell lennie.

A Weboldal szerkesztő Forrás oldalán vegye fel a következő JSF címkét: <h:inputSecret value="#{}"></h:inputSecret> . Amikor a kurzor a szögletes zárójelek között van nyomja le a Ctrl+szóköz billentyűkombinációt. Egy előugró ablakot láthat, amelyen az implicit objektumok listája és a fent meghatározott felügyelt bean látható. Válassza ki a loginBean felügyelt beant.

Bean tulajdonságainak érvényesítése az EL-ben

Írja be a tulajdonság nevét, például x, ami nincs meghatározva a felügyelt beanben, majd mentse a módosítást. A szerkesztő arra fog figyelmeztetni, hogy a tulajdonság nem oldható fel.

Bean tulajdonságainak ellenőrzése az EL-ben

Törölje az érvénytelen tulajdonságot. Nyomja meg a Ctrl+szóköz billentyűkombinációt a '.' után a bean nevében. A felügyelt beanben meghatározott tulajdonságok listáját láthatja egy előugró ablakban. Válassza a password elemet a menüből.

Tartalomsegéd

Hozza létre a com.tutorial.validatePassword Java osztályt, amely megvalósítja a Validator felületet és mentsen.

Validator
A Projektböngészőben bontsa ki a következő csomópontot: JSFTutorial->WebContent. Kattintson duplán a faces-config.xml fájlra. Ez elindítja faces-config szerkesztőjét. Válassza a Komponens lapot. Bontsa ki az Érvényesítők részt.

Faces-config szerkesztő Komponens lap

Kattintson a Hozzáadás gombra. A Validator osztály mellett kattintson a Tallózás gombra, majd válassza ki a com.tutorial.ValidatePassword osztályt. Mentse a változásokat.

Faces-config szerkesztő Érvényesítő regisztrálása

Vegye fel a következő JSF címkét: <f:validator id=""></f:validator > . Amikor a kurzor a dupla idézőjelek között van, nyomja le a Ctrl+szóköz billentyűkombinációt. Egy előugró ablakot láthat, amelyen a szabványos érvényesítők listája és a faces-config fájlban regisztrált érvényesítők szerepelnek. Válassza a Jelszó érvényesítése lehetőséget.

Tartalomsegéd az érvényesítőkhöz


Most áthelyezzük az oldalon használt statikus karaktersorozatokat egy erőforráskötegbe. Ennek elvégzéséhez adjon egy messages.properties nevű mezőt a com.tutorial mappához. Határozza meg a tulajdonságokat az alább láthatóak szerint és mentse a fájlt.

Erőforrásköteg tartalomsegédje

Vegye fel a loadBundle JSF címkét az alább látható módon. Fogd-és-vidd módszerrel is áthelyezheti a címkét a Paletta nézet JSF Core részéből.

Erőforrásköteg tartalomsegédje

Törölje a Name karaktersorozatot az outputLabel címke érték attribútumából. Amikor a kurzor a szögletes zárójelek között van nyomja le a Ctrl+szóköz billentyűkombinációt. Felugró ablakot láthat, amelynek listáján szerepel az msg változó, amelyet a loadBundle címkében határozott meg. Válassza ezt.

Erőforrásköteg tartalomsegédje

Írjon be egy pontot az msg után és üsse le a Ctrl+szóköz billentyűkombinációt. Előugró ablakot láthat a messages.properties fájlban meghatározott tulajdonságok listájával. Válassza a name tulajdonságot.

Erőforrásköteg tartalomsegédje


Töltse ki a bejelentkező oldalt az alábbiak szerint.

Bejelentkező oldal kitöltése

Hozzon létre egy új, welcome.jsp nevű JSF oldalt az alábbiak szerint.

Bejelentkező oldal kitöltése

Faces beállítások Erőforrás-szerkesztő

A JSF Tools projekt magában foglal egy speciális szerkesztőt a faces konfigurációs erőforrásfájlok számára. A következő részben egy rövid bevezető következik a szerkesztőről. Hamarosan elérhető lesz a szerkesztő minden szolgáltatását bemutató ismertető is.
Kattintson duplán a faces-config.xml fájlra a Faces konfiguráció szerkesztő indításához. Váltson át a Navigáció lapra.

Faces konfiguráció szerkesztő



Faces konfiguráció szerkesztő

JSF JSP oldal tesztelése

1) Most futtatjuk az oldalt Apache Tomcat kiszolgálón. A Naviágtorban jelölje ki a login.jsp oldalt, majd kattintson az előugró menü Futtatás a kiszolgálón menüpontjára.



2) Válassza ki az Apache Tomcat kiszolgálót és - ha még nem tette volna meg - állítsa be azt a kívánt módon.

3) Kattintson a Befejezés gombra. A Konzol nézetben láthatja, hogy a Tomcat kiszolgáló elindul, majd láthatja a futtatott bejelentkezési oldal megjelenését a webböngészőben az alább látható módon.



Kattintson a Bejelentkezés gombra. Lépjen a welcome oldalra.


Gratulálunk! Létrehozta és futtatta első JavaServer Faces alkalmazását az új Eclipse WTP JSF Tools használatával.