Atelier2_jsf

download Atelier2_jsf

of 12

Transcript of Atelier2_jsf

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Atelier EDI Eclipse Ganymede N2 : JSFEtape 1 : configuration Dfinir Web Page Editor comme diteur par dfaut des pages *.jsp o Dans la fentre Fentres/Prfrences/Gnral/Editeurs/Associations de fichiers o Dans la liste Types de fichier slectionnez *.jsp o Dans la liste Editeurs associs slectionnez web page editor et cliquez sur le bouton Valeur par dfaut o Cliquez sur OK

Etape 2 : Cration du projet Fichier : Nouveau / projet web dynamique Project Name: jsf1 Target Runtime: IBM WASCE v2.1 version Module Web Dynamic: 2.5 Configuration: JavaServer Faces v1.2 , cliquez sur Modify et dans la fentre Project Facets Cocher WASCE Deployment Select JavaServer Faces (preselected at Version 1.2). Select WASCE Deployment.

Page 1/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Cliquez sur OK

Page 2/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Cliquez sur suivant, dans la fentre Module Web cocher la case Gnrer le descripteur de dploiement. Cochez la case gnrer le descripteur de dploiement . et cliquez sur suivant deux fois Dans la la fentre JSF capabilities , slectionnez loption Server side JSF implementation . Cliquez sur Terminer

Elment

JSF gnrs par lassistant : Un fichier de configuration WEB-INF/faces-config.xml. Une FacesServlet prdfinie dans le fichier web.xml. Mapping des url /faces/* dans le fichier web.xml

Page 3/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Etape 3 : Cration des pages JSP JSF Crer la page login.jsp Crer une nouvelle page jsp nomme login.jsp , dans la fentre Slectionner Modle JSP . slectionnez le modle New JavaServer Faces (JSF) Page (html) Cliquez sur Terminer

Notez la prsence des deux directives suivantes dans la page gnre. Crer la page JSP JSF bienvenue.jsp Etape 4 : dfinir la navigation Ouvrez le fichier faces-config.xml et slectionnez longlet Navigation rule . Slectionnez loutil page partir de la palette et cliquez lintrieur de la page Dans la fentre select JSP file slectionnez la page login.jsp

Page 4/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Cliquez sur OK Ajoutez de la mme manire la page bienvenue.jsp Crez le lien de navigation entre les deux pages o Cliquez sur loutil link o Dessiner un lien de la page login vers la page bienvenue o Cliquez sur loutil Select dans la palette. o Slectionnez le lien cr o Dans le panneau proprits dfinissez la proprit suivante : From outcome : login

Page 5/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Lignes gnres par lassistant dans le fichier faces-config.xml : login /login.jsp login /bienvenue.jsp

Etape 5 : Cration du bean manag : LoginBean Ouvrez le descripteur faces-config.xml, slectionnez longlet Managed bean Cliquez sur Add Slectionnez create a new java class Dfinir le nom du package et le nom de la classe.

Page 6/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Cliquez sur suivant deux foix, puis cliquez sur Terminer .

Les lignes suivantes ont t ajoutes par lassistant dans le fichier faces-config.xml : loginBean ateliers.web.jsf.LoginBean session

Complter la classe LoginBean . o Ajouter les proprits prives suivantes et les mthodes set et get correspondantes : nom password

Etape 6 : Complter la page login.jsp Ouvrez la page login.jsp Ajouter un bouton de commande bouton de commande partir de la section JSF HTML . Dfinir les proprits : o Value : Login Page 7/12

Nadiri Abdeljalil Contact : [email protected] o action: login

21/01/2009 Eclipse Ganymede J EE WebSphere

Code gnr par lassistant :

Ajouter un composant PanelGrid Dfinir la proprit value des composants OutputText (Item1 et Item3) comme suit : o Item1 : value=Nom : o Item3 : value=Password :

Page 8/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Remplacer le composant outputText item2 par un composant InputText o Proprits value: #{loginBean.nom}. Remplacer le composant outputText item4 par un composant InputSecret o Proprits : value : #{loginBean.password}

Etape 6 : crer un composant de validation

Page 9/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Ajouter une classe (nomme atelies.web.jsf.ValidationMdp) qui implmente linterface Validator

Cliquez sur Terminer , la classe suivante est gnre package ateliers.web.jsf; import import import import javax.faces.component.UIComponent; javax.faces.context.FacesContext; javax.faces.validator.Validator; javax.faces.validator.ValidatorException;

public class ValidationMdp implements Validator { public void validate(FacesContext arg0, UIComponent arg1, Object arg2) throws ValidatorException { // TODO Auto-generated method stub } } Enregistrez Ouvrez le fichier faces-config.xml et slectionnez longlet Component Dans la section Validators cliquez sur le bouton Add Page 10/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Slectionnez la classe ValidationMdp Dfinir la proprit Display Name : Valider Mot de passe Dfinir la proprit Validator ID : ateliers.web.jsf.validationMdp

Ajouter le composant JSF dans la page login.jsp

Etape 7 : Cration dun fichier de ressources Ajouter un fichier dans le dossier ateliers.web. jsf nomm messages.properties

Page 11/12

Nadiri Abdeljalil Contact : [email protected]

21/01/2009 Eclipse Ganymede J EE WebSphere

Ajouter le contenu suivant dans le fichier nom=nom mdp=mot de passe login=login

bienvenue=Bienvenue Dans la page login.jsp ajouter un composant JSF loadBundle

Remplacer la propit value des composants OutputText de la manire suivante :

Etape8 : Complter la page bienvenue.jsp. Ajouter un composant loadBundle Ajouter un composant outputLabel

Page 12/12