[JSF 2.0] faire apparaître et disparaître des composants

Version imprimable

09/11/2010, 16h35
olivier57b

[JSF 2.0] faire apparaître et disparaître des composants

salut,

quelqu'un pourrait-il me donner le code d'une appli minimale exploitant un framework JSF (primefaces ou autre) at permettant de faire apparaître et disparaître une textBox lors de l'appui sur le bouton "faire apparaître" et "faire disparaître"?
il faut je crois passer par ajax.

merci,

olivier
09/11/2010, 17h49
Sniper37

c'est simple en utilisant ajax, avec Richfaces par exemple avec l'attribut rendered des composants JSF.

C'est aussi possible du CSS, en utilisant display block ou none..

tu trouvera des exemples dans les tutoriels ou dans le forum..
09/11/2010, 18h17
tchize_

puisque vous cliquez sur un bouton, l'ajax n'est même pas nécessaire. tout ce qu'il faut c'est
-> que le bouton soit relié en immediate="true" à une action JSF qui change la valeur d'un boolean dans le bean
-> d'avoir l'attribut "rendered" du composant qui se base sur le champ boolean en question (rendered="#{leBean.doitAfficherLePanneau}")
09/11/2010, 18h34
olivier57b

merci,

en fait le truc que je voudrais exactement est que j'ai une combobox, avec des valeurs prédéfinies et que si je choisis une de ces valeurs j'ai des infos complémentaires que s'affichent dans deux textBoxes à côté.

alors, ajax ou pas?

après, je me mets à coder;)

olivier

ps: l'attribut rendered est pour JSF ou particulier à richfaces?
09/11/2010, 20h35
tchize_

JSF.

Si tu ne veux pas rafraichir systématiquement toute la page -> ajax.
Mais l'effet final est réalisable avec ou sans ajax sans soucis.
09/11/2010, 20h38
olivier57b

salut,

au risque d'être un peu lours, est-ce que je pourrais avoir un exemple de code?
ça me permettrait d'y voir + clair!

olivier
09/11/2010, 20h39
olivier57b

avec ajax:aie:

pour me mettre à ajax, j'ai essayé un petit exemple, mais il ne marche pas :

le fichier bean.java

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
package java;
 
import javax.faces.bean.ManagedBean;
 
@ManagedBean(name="bean")
public class Bean {
 
    private String text;
 
    public String getText() {
        return text;
    }
 
    public void setText(String text) {
        this.text = text;
    }
 
    public Bean() {
        super();
        // TODO Auto-generated constructor stub
    }
 
}

et la page JSF de test:

index.xhtml

Code:

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
 
<!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:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
 
<h:body>
	<f:view>
	<h:form id="form1">
	<h:panelGrid id="pg1">
	<h1>hello</h1>
	<br/>
	<h:inputText id="ipt1" value="#{bean.text}">
		<f:ajax event="keyup" render="texte"></f:ajax>
	</h:inputText>
	<br></br>
	<h:outputText id="texte" value="#{bean.text}"></h:outputText>
	</h:panelGrid>
	</h:form>
	</f:view>
</h:body>
 
</html>

ça doit théoriquement copier ce qu'on entre dans la balise inputText vers la balise outputText.

mais ça ne marche pas : si j'entre du texte rien n'est copié et si j'appuie sur entrée, j'ai un message me disant que le bean "bean" est inconnu.

olivier.

10/11/2010, 09h35
Sniper37

Citation:

Envoyé par olivier57b

pour me mettre à ajax, j'ai essayé un petit exemple, mais il ne marche pas :

l'évènement c'est onkeyup

Code:

<f:ajax event="onkeyup" render="texte"></f:ajax>

j'obtiens ce message d'erreur:

Citation:

javax.servlet.ServletException: /index.xhtml @16,42 <f:ajax> 'onkeyup' is not a supported event for HtmlInputText. Please specify one of these supported event names: blur, change, click, dblclick, focus, keydown, keypress, keyup, mousedown, mousemove, mouseout, mouseover, mouseup, select, valueChange.
javax.faces.webapp.FacesServlet.service(FacesServlet.java:325)

avec ce code:
Code:

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 <!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:ui="http://java.sun.com/jsf/facelets" xmlns:h="http://java.sun.com/jsf/html" xmlns:f="http://java.sun.com/jsf/core"> <h:body> <f:view> <h:form id="form1"> <h:panelGrid id="pg1"> <h1>hello</h1> <br/> <h:inputText id="ipt1" value="#{bean.text}"> <f:ajax event="onkeyup" render="texte"></f:ajax> </h:inputText> <br></br> <h:outputText id="texte" value="#{bean.text}"></h:outputText> </h:panelGrid> </h:form> </f:view> </h:body> </html>
moi j'y connais pas grand chose mais il semblerait que tu t'es trompé!:roll:

olivier

10/11/2010, 16h35
olivier57b

... à moins que ça soit pour richfaces.
j'éspère pas
10/11/2010, 16h47
Sniper37

Citation:

Envoyé par olivier57b

... à moins que ça soit pour richfaces.
j'espère pas

En effet oui .. tu as raison ..

ton bean est dans quel scope du coup??
10/11/2010, 16h58
olivier57b

ben je ne sais pas : j'ai utilisé une annotation donc il utilise pour le scope la valeur par défaut.
session?
le problème viendrait de là?
10/11/2010, 17h10
Sniper37

Citation:

Envoyé par olivier57b

ben je ne sais pas : j'ai utilisé une annotation donc il utilise pour le scope la valeur par défaut.
session?
le problème viendrait de là?

Par défaut ça doit être request..essaye avec l'annotation ViewScoped
10/11/2010, 17h31
olivier57b

j'ai essayé d' ajouter l'annotation mais rien n'y fait : la textBox est bien affichée mais il n'y a rien à côté et si je tape du texte dedans rien ne se passe (à côté je veux dire, car dans la textBox le texte s'affiche quand même :aie:)

j'y comprends rien
10/11/2010, 18h01
tchize_

met ton texte dans une outputpanel et fait le rerender de l'outputpanel. Le texte n'est pas associé à un conteneur div ou span -> impossible de le rafraichir.
10/11/2010, 18h13
olivier57b

euh... je ne trouve pas de balise h:outputPanel.
c'est du richfaces?

olivier
10/11/2010, 18h23
Sniper37

panelGroup par exemple, tu as l'idée ..tu peux t'en inspirer n'attend pas une réponse que tu copier/colle dans ton IDE directement..

avec ce code :

Code:

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
 
<!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:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
 
<h:body>
	<f:view>
		<h:form id="form1">
 
			<h1>hello</h1>
			<br />
			<h:inputText id="ipt1" value="#{bean.text}">
				<f:ajax event="keyup" render="pg2"></f:ajax>
			</h:inputText>
			<br></br>
			<h:panelGroup id="pg2">
				<h:outputText id="texte" value="#{bean.text}"></h:outputText>
			</h:panelGroup>
 
		</h:form>
	</f:view>
</h:body>
 
</html>

j'obtiens l'affichage du texte (hello) mais de rien d'autre...
j'essaie mais je dois reconnaître que pour l'instant je fais chou blanc :aie:

11/11/2010, 02h35
olivier57b

:ccool:
ça marche en utilisant netbeans, avec le même code.
la faute à mojarra (la version JSF2.0 dispo sur eclipse)?