Loading...
Prerequisito di questo tutorial è aver installato l'AS JBoss ed i JBoss Tools come descritto nel seguente articolo:https://www.appuntisoftware.it/i
Prerequisito di questo tutorial è aver installato l’AS JBoss ed i JBoss Tools come descritto nel seguente articolo:
https://www.appuntisoftware.it/installare-e-configurare-jboss-application-server/
Bisogna inoltre scaricare le librerie di Richfaces all’indirizzo:
http://www.jboss.org/richfaces/download.html
dove è possibile scegliere tra le versioni stabili e quelle ancora in sviluppo.
Prima di iniziare col progetto, apriamo all’interno di Eclipse, la vista Web Development , così facendo andando su File -> New apparirà nel menu la voce JSF Project:
Nuovo progetto JSF
Inseriamo il nome del progetto e scegliamo come ambiente JSF quello 1.2 e template JSFBlankWithoutLibs. Otterremo il seguento progetto visibile nel Package Explorer:
Gerarchia dei file
Inseriamo all’interno del nostro progetto le librerie Richfaces che abbiamo scaricato precedentemente. Il modo più semplice è fare un drag & drop dei file jar direttamente all’interno della cartella WebContent/WEB-INF/lib. Oppure è possibile creare una User Library andando in window>preferences>Java>Build Path>User Libraries e poi andando ad aggiungere questa libreria al Build Path della nostra applicazione.
Infine bisogna aggiungere nel file web.xml le seguenti righe:
<!-- Plugging the "Blue Sky" skin into the project --> <context-param> <param-name>org.richfaces.SKIN</param-name> <param-value>blueSky</param-value> </context-param> <!-- Making the RichFaces skin spread to standard HTML controls --> <context-param> <param-name>org.richfaces.CONTROL_SKINNING</param-name> <param-value>enable</param-value> </context-param> <!-- Defining and mapping the RichFaces filter --> <filter> <display-name>RichFaces Filter</display-name> <filter-name>richfaces</filter-name> <filter-class>org.ajax4jsf.Filter</filter-class> </filter> <filter-mapping> <filter-name>richfaces</filter-name> <servlet-name>Faces Servlet</servlet-name> <dispatcher>REQUEST</dispatcher> <dispatcher>FORWARD</dispatcher> <dispatcher>INCLUDE</dispatcher> </filter-mapping>
Clicchiamo col tasto destro culla cartella WebContent, creiamo una pagina JSP col nome di index.jsp e con il template JSFRedirect. Scegliamo come taglib JSF Core e JSF HTML. Verrà generato il seguente codice:
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f" %> <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h" %> <!doctype html public "-//w3c//dtd html 4.0 transitional//en"> <html> <head></head> <body> <jsp:forward page="echo.jsf" /> </body> </html>
All’interno del tag jsp:forward come attributo page inseriamo il valore echo.jsf.
Creiamo una nuova pagina JSP col nome di echo.jsp e con il template JSFBasePage. Scegliamo come taglib JSF Core, JSF HTML, JBoss Ajax4Jsf e JBoss RichFaces. Verrà generato il seguente codice:
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%> <%@ taglib uri="http://richfaces.org/a4j" prefix="a4j" %> <%@ 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:form> </h:form> </f:view> </body> </html>
Tramite la palette laterale inseriamo un Panel, ( si trova nella sezione JBoss RichFaces) all’interno del tag form ed inseriamo nell’attributo header il testo che verrà visualizzato. All’interno di questo inseriamo un inputText con value impostato uguale a bean.text (andremo poi a definire questo bean). Volendo utilizzare delle funzionalità Ajax inseriamo all’interno del tag inputText un component aj4:support prendendolo dal gruppo Ajax4Jsf. Lo colleghiamo ad un evento di rilascio del tasto (onkeyup) in modo che venga aggiornato il componente che avrà per id quello inserito all’interno dell’attributo reRender (in questo caso rep). Infine inseriamo un componente outputText per visualizzare il risultato con id uguale a rep. Cerchiamo di ottenere il seguente codice:
<rich:panel header="Test">
<h:inputText value="#{bean.text}" >
<a4j:support event="onkeyup" reRender="rep" />
</h:inputText>
<h:outputText value="#{bean.text}" id="rep"></h:outputText>
</rich:panel>
Facciamo ora doppio click sul file faces-config.xml e nel tab Tree creiamo un nuovo Managed Bean col nome bean e come classe demo.Bean. Infine inseriamo una proprietà dal nome text. Una volta salvato il file verrà generato il file all'interno della cartella Source e la definizione XML del bean all'interno del file face-config.xml.Avviamo ora l'appicazione facendo tasto destro sul progetto e cliccando su Run As -> Run on Server.
Riferimenti: http://docs.jboss.org/tools/movies/demos/rich_faces_demo/rich_faces_demo.htm
COMMENTS