Discussion :

[Lourpiop]

Bonjour,
peut ont utiliser jquery?
je voudrais faire ca:
http://top-news.fr/demos/ajax-jquery/test.html


Comment faut il faire en JSF? Car là avec les <h:commandButton> à la place des <a>, je m'en sors pas...

[Sniper37]

tu peux le faire en ajax si tu utilise Richfaces, sinon en javascript.
En JSF tu peux utiliser l'attribut rendered de ton div(panelGroup par exemple) avec Richfaces utiliser un a4j:support ou reRender, et en pure JSF valueChangeListener et un submit du formulaire.

Avec javasscript, tu peux changer le style et le display du div block ou hidden..voir et forum jaavscript.

[Lourpiop]

Ok merci
Mais j'arrive bien à cacher un div (en javascript) s'il n'y a pas de JSF dedans.
Mais lorque je mettais des composants JSF dedans ca ne fonctionnait plus...
Peut être qu'il faut éviter certains composants?

[Sniper37]

donne nous le code pour comprendre ce qui ne va pas.

[scorplayer]

De mon côté ça marche avec :

Code :

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

1
2
3
4
5
6
7
8
function displayOrHideBlock(x){
    if( document.getElementById(x).style.display =='block'){
        document.getElementById(x).style.display = 'none';
    }
    else{
        document.getElementById(x).style.display = 'block';
    }
}

x correspond à l'id de ton div.
Cette méthode est appelé par l'attribut onclick d'une balise <a>.

[Lourpiop]

Sniper37:
Mon code bidon:

fonctions javascript:

Code :

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

1
2
3
4
5
6
7
8
 <script type="text/javascript">
        function cacherJSF(){
                document.getElementById('contenuJSF').style.display = 'none';
        }
        function cacherJavascript(){
                document.getElementById('contenuJavascript').style.display = 'none';
        }
</script>

Code qui cache rien:

Code :

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

1
2
3
4
5
6
7
8
9
<div id ="contenuJSF">
            <h:form id ="form1">
                <h:panelGrid columns ="2">
                    <h:outputText value="Nom :"/>
                    <h:inputText/>
                </h:panelGrid>
                <h:commandButton value="Retour" onclick="cacherJSF()" />
            </h:form>
</div>

Code sans JSF qui cache:

Code :

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

1
2
3
4
5
6
        <div id="contenuJavascript">
            <form>
                Contenu
                <a onclick="cacherJavascript()">cacher</a>
            </form>
        </div>

scorplayer:
Mais <a> c'est pas du JSF?

[scorplayer]

Oups, je viens de voir que tu voulais du JSF.
Tu as essayé avec un outputLink à la place d'un commandLink?

[romaintaz]

En fait, ton souci c'est que dans le code suivant :

Code :

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

1
2
3
<h:form id="myForm">
    <h:panelGroup id="myBlock" layout="block">
    ...

si tu veux récupérer le panelGroup (le DIV en HTML) il te faut l'ID complet de ce dernier, qui n'est pas myBlock, mais myForm:myBlock !

En effet, certains composants (qui implémentent l'interface NamingContainer) ont la particularité de faire préfixer les IDs des composants qu'ils contiennent par leur propre ID. Dans mon exemple, myBlock est donc préfixé par myForm: Le form est l'un de ces NamingContainer.

[tchize_]

Code :

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

1
2
3
4
5
6
7
8
9
<div id ="contenuJSF">
            <h:form id ="form1">
                <h:panelGrid columns ="2">
                    <h:outputText value="Nom :"/>
                    <h:inputText/>
                </h:panelGrid>
                <h:commandButton value="Retour" onclick="cacherJSF()" />
            </h:form>
</div>

C'est bien beau ce code, mais après avoir caché ton DIV, ca va soumettre le formulaire et afficher une nouvelle page -> ne sert à rien, il est là ton problème. Si tu veux annuler une soumission de forumlaire dans un onclik, il faut faire un "return false" pour interromptre le process.

[scorplayer]

tchize_ a trouvé

C'est pour ça qu'à l'époque j'avais opté pour la balise <a>. La prochaine fois j'utiliserais peut être une balise JSF maintenant que j'ai l'explication et l'astuce pour ne pas soumettre le formulaire.

Merci tchize_

[Lourpiop]

ah oui ca marche mieux merci!!
je me disais, c'est comme si ca cachait une fraction de seconde!!
merci!

[Lourpiop]

du coup ca ne passe plus par mon champ "action" !!

Code :

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

1
2
 
<h:commandLink value="#{p.firstName}" action="#{userController.doUpdate}"  onclick="update();return false;"  />

[tchize_]

ben oui c'est le but Si tu dois passer par l'action, autant cacher directement ton panneau avec un rendered= dans ta page jsf, ca évitera de s'emmerder

[Lourpiop]

C'est cool