Jsf 2.0 ajax inclusion de fichiers

**tralloc** · 20/10/2009, 17h57

Bonjour à nouveau
Bon, alors pour ceux qui n'auraient pas suivi mes périgrinations en JSF 2.0, mais qui j'ai réussi à changer le contenu d'un h:outputtext par ajax en utilisant un template et trois h:commandButton dans le même h:form.
Ca marche bien.

Maintenant j'ai voulu changer mon h:outputtext par un ui:include et évidemment ça ne marche pas. Il ne me trouve pas l'id de mon include : voici l'erreur :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
<f:ajax> contains an unknown id 'includeContenu' - cannot locate it in the context of the component boutonPageConnexion

Ce qui est logique car l'ui:include n'apparaît pas dans le code généré mais est remplacé dans la page par le code html de la page appelée.
Donc je pense qu'il n'est pas possible de le faire comme celà.

Mon but est de charger un morceau de page dynamiquement par ajax selon le h:commandButton sur lequel je vais appuyer.
Quelle solution entrevoyez vous ? Des component ezcomp (je ne maîtrise pas encore le fonctionnement mais je ne suis pas sûr que ça puisse répondre à ma requête), ou directement du javascript du type httpxmlrequest mais ça me semble lourd. j'ai aussi pensé à des iframes...
Qu'en pensez vous ? Quelle serait la meilleure solution, si possible s'en s'éloigner des jsf

**tralloc** · 21/10/2009, 10h54

Bon, j'ai eu une idée mais elle s'est révélée infructueuse, j'ai voulu utiliser les c:choose c:when
Ca marche au lancement dans certains cas, particulièrement au lancement de l'application. Voici mon code
page appelée : (entree.xhtml)

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
 
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:f="http://java.sun.com/jsf/core"
 
      xmlns:c="http://java.sun.com/jsp/jstl/core">
 
    <ui:composition template="/template/base.xhtml">
	<ui:define id="titre" name="titre">Entrez dans une nouvelle Ere</ui:define>
	<ui:define id="haut" name="haut">monhaut</ui:define>
	<ui:define id ="gauche" name="gauche">
	    <h:panelGroup id="GrouppeDeBouton">
		<h:commandButton id="boutonPageConnexion" value="Entrée" actionListener="#{environnement.actionBoutonPageConnexion}">
		    <f:ajax render="formulaireContenu"/>
		</h:commandButton>
		<h:commandButton id="boutonPageInscription" value="Inscrivez vous" actionListener="#{environnement.actionBoutonPageInscription}">
		    <f:ajax render="formulaireContenu"/>
		</h:commandButton>
		<h:commandButton id="boutonPageRegle" value="Les règles" actionListener="#{environnement.actionBoutonPageRegle}">
		    <f:ajax render="formulaireContenu" />
		</h:commandButton>
	    </h:panelGroup>
	</ui:define>
	<ui:define id="defineContenu"  name="contenu">
	    <h:form id="formulaireContenu">
		<c:choose>
		    <c:when test="#{environnement.pageConnexionActive}">
			<ui:include src="sousPageEntree/connexion.xhtml"/>
		    </c:when>
		    <c:when test="#{environnement.pageInscriptionActive}">
			<ui:include src="sousPageEntree/inscription.xhtml"/>
		    </c:when>
		    <c:when test="#{environnement.pageRegleActive}">
			<ui:include src="sousPageEntree/regle.xhtml"/>
		    </c:when>
		</c:choose>
	    </h:form>
	</ui:define>
    </ui:composition>
</html>

Puis voici mon code java

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
 
package objet.session;
 
import javax.faces.bean.ManagedBean;
import javax.faces.bean.SessionScoped;
import javax.faces.event.ActionEvent;
 
@ManagedBean(name="environnement")
@SessionScoped
public class Environnement {
    private String sousPageEnCours="sousPageEntree/connexion.xhtml";
 
 
    public boolean isPageConnexionActive() {
	return sousPageEnCours.equals("sousPageEntree/connexion.xhtml");
    }
 
    public boolean isPageInscriptionActive() {
	return sousPageEnCours.equals("sousPageEntree/inscription.xhtml");
    }
 
    public boolean isPageRegleActive() {
	return sousPageEnCours.equals("sousPageEntree/regle.xhtml");
    }
 
    public String getSousPageEnCours() {
	return sousPageEnCours;
    }
 
    public void setSousPageEnCours(String sousPageEnCours) {
	this.sousPageEnCours = sousPageEnCours;
    }
 
    public void actionBoutonPageConnexion(ActionEvent e){
	sousPageEnCours="sousPageEntree/connexion.xhtml";
    }
    public void actionBoutonPageInscription(ActionEvent e){
	sousPageEnCours="sousPageEntree/inscription.xhtml";
    }
    public void actionBoutonPageRegle(ActionEvent e){
	sousPageEnCours="sousPageEntree/regle.xhtml";
    }
 
}

lorsque la page entree se charge pour la première fois, la sous page active en cours est : "connexion.xhtml" voir le code java
Il la charge sans aucun problème à l'endroit que j'ai défini dans ma page.

par contre lorsque je clique sur un de mes trois boutons "h:commandButton" les valeurs sont bien changées dans le code java, puis j'ai le message suivant, apparaissant dans un alert au sens javascript du terme qui me rend perplexe :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
malformedXML: During update: formulairePageGlobale:formulaireContenu not found

et ce quel que soit le bouton choisi
pourtant lorsque j'affiche le code html de la page généré je trouve bien mon formulaire avec pour id=formulairePageGlobale:formulaireContenu
voici la page générée :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"><head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <link href="./resources/css/default.css" rel="stylesheet" type="text/css" />
        <link href="./resources/css/cssLayout.css" rel="stylesheet" type="text/css" />
        <title>Entrez dans une nouvelle Ere
	</title><script type="text/javascript" src="/NouvelleEreJsf2/faces/javax.faces.resource/jsf-uncompressed.js?ln=javax.faces"></script></head><body>
<form id="formulairePageGlobale" name="formulairePageGlobale" method="post" action="/NouvelleEreJsf2/faces/entree.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="formulairePageGlobale" value="formulairePageGlobale" />
 
	<div id="top" class="top">
 
	    <h2>Entrez dans une nouvelle Ere
	    </h2>monhaut
        </div>
        <div>
            <div id="left"><span id="formulairePageGlobale:GrouppeDeBouton"><input id="formulairePageGlobale:boutonPageConnexion" type="submit" name="formulairePageGlobale:boutonPageConnexion" value="Entrée" onclick="mojarra.ab(this,event,'action',0,'formulairePageGlobale:formulaireContenu');return false" /><input id="formulairePageGlobale:boutonPageInscription" type="submit" name="formulairePageGlobale:boutonPageInscription" value="Inscrivez vous" onclick="mojarra.ab(this,event,'action',0,'formulairePageGlobale:formulaireContenu');return false" /><input id="formulairePageGlobale:boutonPageRegle" type="submit" name="formulairePageGlobale:boutonPageRegle" value="Les règles" onclick="mojarra.ab(this,event,'action',0,'formulairePageGlobale:formulaireContenu');return false" /></span>
            </div>
            <div id="divContenu" class="left_content">
<form id="formulairePageGlobale:formulaireContenu" name="formulairePageGlobale:formulaireContenu" method="post" action="/NouvelleEreJsf2/faces/entree.xhtml" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="formulairePageGlobale:formulaireContenu" value="formulairePageGlobale:formulaireContenu" />
<?xml version="1.0" encoding="UTF-8"?>
<!--
To change this template, choose Tools | Templates
and open the template in the editor.
--><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 
    <body>
        <p>
            Connexion
        </p>
    </body>
</html><input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="-122723051736160639:4845146440517739797" autocomplete="off" />
</form>
            </div>
        </div><input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="-122723051736160639:4845146440517739797" autocomplete="off" />
</form></body>
 
</html>

Pouvez vous m'aider à comprendre ?
Merci d'avance

PS: J'ai essayé une autre solution qui donne exactement le même résultat avec des h:panelgroup
J'ai aussi eu l'idée de me servir du code java pour changer le contenu de l'include page mais sans effet : l'objet UIinclude n'existe pas dans les bibliothèques java

**Sniper37** · 21/10/2009, 11h44

tu peux englober le include dans un panelGroup et faire le render sur ce dernier.

**tralloc** · 21/10/2009, 11h46

Yess !!!
J'y suis presque j'ai rempacé le formulaire par un h:panelgroup
Dernier soucis, le refresh ne se fait pas bien, il y a un problème de cycle de vie que je dois résoudre :
Quand j'appuie sur un bouton, j'ai le résultat de l'appuis précédent, ce qui n'est pas idéal !

**tralloc** · 21/10/2009, 11h47

sniper je n'avais pas encore vu ta réponse (merci) mais c'est ça !.
Je n'ai plus que mon problème de cycle de vie à régler !!!

**tralloc** · 21/10/2009, 12h11

J'ai crié victoire un peu vite...
Il y a désormais un rendered = "true" sur mon h:panelgroup
et sur chaque h:commandbutton un immediate="true"
mais le refresh n'est pas meilleur

**tralloc** · 21/10/2009, 14h36

Est-ce que quelqu'un sait si c'est possible dans un binding de modifier un ui:include ? Il semblerait que c'est ma seule chance

Jsf 2.0 ajax inclusion de fichiers

JSF Java

Vue hybride

Discussions similaires

Partager

Partager