Différences

Ci-dessous, les différences entre deux révisions de la page.

--- helloworld:web:java:jsf [2016/11/26 20:47] – ↷ Liens modifiés en raison d'un déplacement. root
+++ helloworld:web:java:jsf [2020/05/10 23:55] (Version actuelle) – Suppression de la taille par défaut pour les images root
@@ Ligne 1: / Ligne 1: @@
 Une page ''JSF'' avec l'utilisation des ''EL'' utilise du code ''HTML'' dans lequel est mis des tags définis par les spécifications des ''JSF''. Ce sont ces tags qui appellent les fonctions ''Java''. Le code généré par les appels aux fonctions ''JSF'' est du ''XHTML 1.0''.
-<note>Avec ''JSF'', les ''EL'' s'utilisent avec le symbole ''#''.</note>
+<WRAP center round info 60%>
+Avec ''JSF'', les ''EL'' s'utilisent avec le symbole ''#''.
+</WRAP>
-<note>Tous les exemples ci-dessous utilisent le [[helloworld:design_pattern:bean:java|BeanPersonne]].</note>
+<WRAP center round info 60%>
+Tous les exemples ci-dessous utilisent le [[helloworld:design_pattern:bean:java|BeanPersonne]].
+</WRAP>
 =====Cycle de vie=====
-{{:helloworld:web:java:jsf:cycle.png?500|Cycle de vie}}
+{{:helloworld:web:java:jsf:cycle.png|Cycle de vie}}
-[[http://bet-nafet.ma/expert/Java/Tutoriels/J2EE/JSFAvancees.html|Source]], {{:helloworld:web:java:jsf:javaserver_faces.html.maff|Archive}}
+<del>[[http://bet-nafet.ma/expert/Java/Tutoriels/J2EE/JSFAvancees.html|JavaServer Faces - techniques avancées]]</del> {{ :helloworld:web:java:jsf:javaserver_faces_2020-04-26_7_23_41_pm_.html |Archive le 2015}}
-{{:helloworld:web:java:jsf:jeett_dt_016.png?362|Cycle de vie}}
+{{:helloworld:web:java:jsf:jeett_dt_016.png|Cycle de vie}}
-[[http://docs.oracle.com/javaee/7/tutorial/jsf-intro006.htm#BNAQQ|Source]], {{ :helloworld:web:java:jeett.pdf |Archive}}
+[[http://docs.oracle.com/javaee/7/tutorial/jsf-intro006.htm#BNAQQ|The Lifecycle of a JavaServer Faces Application]], {{ lang:java:jeett.pdf |The Java EE Tutorial}}
 =====Création du projet=====
 Nécessite un projet de type [[ide:eclipse:projet|Dynamic Web Project]].
@@ Ligne 44: / Ligne 48: @@
 =====Exemple 2 - Utilisation d'un Bean=====
-<note important>Dans le cas de Beans utilisés par JSF, la valeur par défaut définie lors de la définition de l'attribut ou par le constructeur est initialisé à 0 (pourquoi ????). Il est donc nécessaire de définir une fonction ''init'' avec l'annotation ''@PostConstruct''.</note>
+<WRAP center round important 60%>
+Dans le cas de Beans utilisés par JSF, la valeur par défaut définie lors de la définition de l'attribut ou par le constructeur est initialisé à 0 (pourquoi ????). Il est donc nécessaire de définir une fonction ''init'' avec l'annotation ''@PostConstruct''.
+</WRAP>
 L'exemple est présenté ici afin de garder une cohérence avec les autres pages ([[helloworld:web:java:servlet|servlet]], [[jsp|JSP]] et [[jsp_jstl_el|JSP+JSTL]]). Cependant, il n'est pas possible de définir dans ''JSF'' la valeur d'attribut sans intervention de l'utilisateur.
-<note important>Il est indispensable que le nom de la classe définissant le Bean managé commence par une majuscule. En effet, lorsqu'on désignera la classe, il faudra taper ''com.llgc.BeanPersonne'' mais si l'on soit désigner la référence à un attribut, il faudra taper ''beanPersonne.taille'' avec une minuscule.</note>
+<WRAP center round important 60%>
+Il est indispensable que le nom de la classe définissant le Bean managé commence par une majuscule. En effet, lorsqu'on désignera la classe, il faudra taper ''com.llgc.BeanPersonne'' mais si l'on soit désigner la référence à un attribut, il faudra taper ''beanPersonne.taille'' avec une minuscule.
+</WRAP>
 <file xml index2.xhtml>
@@ Ligne 114: / Ligne 122: @@
 </html>
 </file>
-<note>La valeur retour de la méthode ''action'' définie la page de redirection.</note>
+<WRAP center round info 60%>
+La valeur retour de la méthode ''action'' définie la page de redirection.
+</WRAP>
 <file java Index3Action.java>
 package com.llgc;
@@ Ligne 131: / Ligne 143: @@
 Rendu du formulaire :
-{{:helloworld:web:java:servlet:rendu_ex3-1.png?310|Rendu du formulaire}}
+{{:helloworld:web:java:servlet:rendu_ex3-1.png|Rendu du formulaire}}
 Rendu de la réponse :
-{{:helloworld:web:java:servlet:rendu_ex3-2.png?310|Rendu de la réponse}}
+{{:helloworld:web:java:servlet:rendu_ex3-2.png|Rendu de la réponse}}
 =====Exemple 3b - avec validation des données=====
 Dans le cas de ''JSF'', l'utilisation de ''Javascript'' n'est plus obligatoire mais reste conseillé pour réduire la charge serveur.
-<note important>L'utilisation de ''Javascript'' n'empêche pas la vérification coté serveur, une page est facilement traficable depuis les navigateurs.</note>
+<WRAP center round important 60%>
+L'utilisation de ''Javascript'' n'empêche pas la vérification coté serveur, une page est facilement traficable depuis les navigateurs.
+</WRAP>
 <file java BeanPersonneValidatorTaille>
@@ Ligne 206: / Ligne 220: @@
 </file>
-<note>La balise ''h:message'' permet d'indiquer la position et éventuellement le style du message d'erreur. Si cette balise est absente, le message sera affiché à la position par défaut.</note>
+<WRAP center round info 60%>
+La balise ''h:message'' permet d'indiquer la position et éventuellement le style du message d'erreur. Si cette balise est absente, le message sera affiché à la position par défaut.
+</WRAP>
 Rendu, échec de conversion en nombre :
-{{:helloworld:web:java:jsf:rendu_3b_1.png?310x49|Rendu exo3, échec string en nombre}}
+{{:helloworld:web:java:jsf:rendu_3b_1.png|Rendu exo3, échec string en nombre}}
-<note>C'est bien le message ''Enter Only Digits'' qui est affiché et pas ''auie n'est pas un nombre.''. Je pense que comme la propriété ''taille'' est un nombre, il doit y avoir une conversion implicite avant la soumission au Bean validateur.</note>
+<WRAP center round info 60%>
+C'est bien le message ''Enter Only Digits'' qui est affiché et pas ''auie n'est pas un nombre.''. Je pense que comme la propriété ''taille'' est un nombre, il doit y avoir une conversion implicite avant la soumission au Bean validateur.
+</WRAP>
 Rendu, échec du domaine du nombre :
-{{:helloworld:web:java:jsf:rendu_3b_2.png?323x48|Rendu exo3, échec domaine du nombre}}
+{{:helloworld:web:java:jsf:rendu_3b_2.png|Rendu exo3, échec domaine du nombre}}
 Rendu, succès :
-{{:helloworld:web:java:jsf:rendu_3b_3.png?310x30|Rendu exo3, succès}}
+{{:helloworld:web:java:jsf:rendu_3b_3.png|Rendu exo3, succès}}
 ====Validateurs implémentés par défaut====
@@ Ligne 303: / Ligne 321: @@
 Rendu avec succès :
-{{:helloworld:web:java:jsf:rendu_3c_1.png?433x30|}}
+{{:helloworld:web:java:jsf:rendu_3c_1.png|}}
 Rendu sans succès :
-{{:helloworld:web:java:jsf:rendu_3c_2.png?433x48|}}
+{{:helloworld:web:java:jsf:rendu_3c_2.png|}}
 ====Convertisseurs implémentés par défaut====
@@ Ligne 370: / Ligne 388: @@
 </html>
 </file>
-<note important>Les ''init-param'' ne sont plus du tout accessibles en ''JSF'', ce qui démontre bien la volonté de séparer la représentation visuelle (''.xhtml'') des ''servlets''.</note>
+<WRAP center round important 60%>
+Les ''init-param'' ne sont plus du tout accessibles en ''JSF'', ce qui démontre bien la volonté de séparer la représentation visuelle (''.xhtml'') des ''servlets''.
+</WRAP>
 Rendu :
@@ Ligne 397: / Ligne 417: @@
 </file>
-<note important>Il est important de noter la présence de ''/faces'' au début de l'URL de redirection ''/faces/indexjsf5.xhtml''. Le fichier se trouve bien dans le dossier ''WebContent'' et non pas dans un hypothétique dossier ''WebContent/faces''. Sans cette dénomination (conformément au fichier ''web.xml''), les tags ''JSF'' ne seraient pas interprétés. Par contre, je n'ai pas réussi mettre le fichier ''indexjsf5.xhtml'' dans le dossier ''WEB-INF'' et y accéder via ''/faces/WEB-INF/indexjsf5.xhtml''. La solution peut être de remplacer dans ''web.xml'', ''<url-pattern>/faces/*</url-pattern>'' par ''<url-pattern>*.xhtml</url-pattern>'' et d'utiliser le lien de redirection ''/WEB-INF/indexjsf5.xhtml''.</note>
+<WRAP center round important 60%>
+Il est important de noter la présence de ''/faces'' au début de l'URL de redirection ''/faces/indexjsf5.xhtml''. Le fichier se trouve bien dans le dossier ''WebContent'' et non pas dans un hypothétique dossier ''WebContent/faces''. Sans cette dénomination (conformément au fichier ''web.xml''), les tags ''JSF'' ne seraient pas interprétés. Par contre, je n'ai pas réussi mettre le fichier ''indexjsf5.xhtml'' dans le dossier ''WEB-INF'' et y accéder via ''/faces/WEB-INF/indexjsf5.xhtml''. La solution peut être de remplacer dans ''web.xml'', ''<url-pattern>/faces/*</url-pattern>'' par ''<url-pattern>*.xhtml</url-pattern>'' et d'utiliser le lien de redirection ''/WEB-INF/indexjsf5.xhtml''.
+</WRAP>
 <file java ServletJSF5.java>
@@ Ligne 561: / Ligne 583: @@
 </file>
-Le fichier ''.css'' ([[http://www.mkyong.com/jsf2/jsf-2-0-jdbc-integration-example/|Source]], {{:helloworld:web:java:jsf:jsf_2.0_jdbc_integration_example.htm.maff|Archive}}) doit être placé dans le dossier ''WebContent\resources\css''.
+Le fichier ''.css'' ([[http://www.mkyong.com/jsf2/jsf-2-0-jdbc-integration-example/|JSF 2.0 + JDBC integration example]] {{ :helloworld:web:java:jsf:jsf_2.0_jdbc_integration_example_mkyong.com_2020-04-26_7_39_17_pm_.html |Archive du 29/08/2012 le 26/04/2020}}) doit être placé dans le dossier ''WebContent\resources\css''.
 <file css table-style.css>
 .order-table{
@@ Ligne 590: / Ligne 612: @@
 =====Exemple 7 - HTML5=====
-La génération de page au format HTML5 nécessite l'utilisation des JSF 2.2 avec JavaEE 7 et Tomcat 8. [[http://www.oracle.com/webfolder/technetwork/tutorials/obe/java/HTML5-JSF/html5jsf.html|Source]], {{:helloworld:web:java:jsf:html5jsf.html.maff|Archive}}.
+La génération de page au format HTML5 nécessite l'utilisation des JSF 2.2 avec JavaEE 7 et Tomcat 8. [[https://www.oracle.com/webfolder/technetwork/tutorials/obe/java/HTML5-JSF/html5jsf.html|Creating HTML5 Pages in JavaServer Faces 2.2]] {{ :helloworld:web:java:jsf:java_ee7_creating_html5_pages_using_jsf_2.2_2020-04-26_7_41_06_pm_.html |Archive le 26/04/2020}}.
 Faire les modifications suivantes :
-  * ''<html>'' par ''<html xmlns="http://www.w3.org/1999/xhtml"
-            xmlns:ui="http://xmlns.jcp.org/jsf/facelets"
+^Remplacer^par^
-            xmlns:h="http://xmlns.jcp.org/jsf/html"
+|''<html>''|''%%<html xmlns="http://www.w3.org/1999/xhtml" xmlns:ui="http://xmlns.jcp.org/jsf/facelets" xmlns:h="http://xmlns.jcp.org/jsf/html" xmlns:p="http://xmlns.jcp.org/jsf/passthrough">%%''|
-            xmlns:p="http://xmlns.jcp.org/jsf/passthrough">'',
+|''<head></head>''|''<h:head></h:head>''|
-  * ''<head></head>'' par ''<h:head></h:head>'',
+|''<body></body>''|''<h:body></h:body>''|
-  * ''<body></body>'' par ''<h:body></h:body>'',
+|''%%<script src="resources/js/story-page.js" type="text/javascript"></script>%%''|''%%<h:outputScript library="js" name="story-page.js" target="body" />%%''|
-  * ''<script src="resources/js/story-page.js" type="text/javascript"></script>'' par ''<h:outputScript library="js" name="story-page.js" target="body" />'',
+|''%%<link href="resources/styles.css" rel="stylesheet" type="text/css" />%%''|''%%<h:outputStylesheet name="styles.css" />%%''|
-  * ''<link href="resources/styles.css" rel="stylesheet" type="text/css" />'' par ''<h:outputStylesheet name="styles.css" />'',
+|''%%<img style="float:left;" draggable="true" ondragstart="drag(event);" data-sticker="robot.png" src="resources/stickers/robot.png">%%''|''%%<h:graphicImage name="stickers/robot.png" style="float:left" p:draggable="true" p:ondragstart="drag(event);" p:data-sticker="robot.png" />%%''|
-  * ''<img style="float:left;" draggable="true" ondragstart="drag(event);" data-sticker="robot.png" src="resources/stickers/robot.png">'' par ''<h:graphicImage name="stickers/robot.png" style="float:left" p:draggable="true" p:ondragstart="drag(event);" p:data-sticker="robot.png" />'',
+|''%%<div id="content">%%''|''%%<h:panelGroup layout="block" id="content">%%''|
-  * ''<div id="content">'' par ''<h:panelGroup layout="block" id="content">''.