Discussion :

[anisj1m]

bonjour
je veut diviser ma page en deux parties une partie a gauche qui contient un menu qui contient des liens vers les pages de mon site et au centre un partie qui contient le contenue de la page.
la page devrait semblait a ceci:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
 
    MEnu           contenu de la page
_________|__________________
               |
               |
               |
               |
               |
               |
               |

quelles sont les tag que je doit utiliser avec quels attributs.
et merci

[romaintaz]

Tu utilises quelles librairies ?
Je te demande ça parce que certaines librairies (genre RichFaces) proposent des composants pour faire des menus justement...

[anisj1m]

j'utilise la bibliotheque trinidad

[Dr@ke]

Je fais exactement la meme chose, J'utilise facelets pour le decoupage et richfaces pour le menu.

[17mounir]

Est ce que c'est possible d'avoir un petit exemple de code ? je veux faire un menu qui rafraichi par ajax la page centrale, mais j'y arrive ps !

Je débute avec Jsf, RichFaces, Facelets et j'ai trop de mal


Merci

[Dr@ke]

C'est exactement ce que je cherchai a faire..
http://www.developpez.net/forums/sho...d.php?t=416578

mais finalement, lorsque je clique sur le menu, toute la page est raffraichie (avec le menu), pas seulement le contenu...je n'ai pas reussi a faire ca.

Dans mon cas, le MenuPanel ne contient que des regles de navigations..

[seb55555]

Si tu veux ne rafraichir que la partie contenu, le plus simple reste, à mon avis, d'utiliser des frames.
Je ne pense pas qu'AJAX présente de l'interet lorsque tu veux mettre à jour toute une page ( ou en tout cas son contenu principal ).

[Dr@ke]

et comment tu raffraichi que le contenu ?
Avec facelets, j'ai un menu.xhtml, et de nombreux contenu*.xhtml...
Quelle est la methode pour ne changer que la page de contenu sans toucher au reste, au moment d'appuyer sur un bouton du menu ?

[P4dre]

Si tu veux ne rafraichir que la partie contenu, le plus simple reste, à mon avis, d'utiliser des frames.
Je ne pense pas qu'AJAX présente de l'interet que lorsque tu veux mettre à jour toute une page ( ou en tout cas son contenu principal ).

Au contraire, Ajax permet de rafraichir uniquement les parties voulues avec ce genre de code :

Code :

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

1
2
3
4
5
6
7
8
9
 
<a4j:region renderRegionOnly="true">
   <h:panelGroup>
			...
    </h:panelGroup>
    <h:commandButton id="cbRecherche" value="...">
	...
    </h:commandButton>
</a4j:region>

Le tout est d'utiliser la balise region pour créer de zone de pages qui pourront être rafraichies individuellement

[if508]

Bonsoir,
J'ai le même problème initial que Dr@ke mais je n'aime pas travaillé avec facelet car je le trouve difficile. Et avec a4j(ajax4jsf)/richfaces je n'ai pas pu résoudre mon problème. Je n'ai pas pu aussi comprendre le bout de code qui a écrit P4dre..

Est ce que je dois écrire le code de l'action de rafraichissement(la page que j'aime l'inclure)?
Où j'écris ce code?


Merci beaucoup...

[romaintaz]

Bonjour if508,

Quel est ton problème exactement ?

Le code de P4dre est un exemple de code JSF (à écrire dans la page JSP ou XHTML) où il montre l'intérêt d'utiliser les a4j:region. En gros, ce composant sert à définir une zone de la page qui pourra être réaffichée suite à une requête Ajax.

Par exemple:

Code :

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

1
2
3
4
5
6
 
<a4j:region id="maRegion" ...>
    ...
</a4j:region>
...
<a4j:commandButton action="#{myBean.doSomething}" reRender="maRegion" .../>

Dans cet exemple, l'utilisateur clique sur le bouton, puis au retour de la réponse Ajax, seule la zone maRegion sera mise à jour sur la page HTML du client...

Est-ce plus clair ?

Sinon, pourquoi dis tu que Facelets c'est trop difficile ?

[if508]

Bonjour,
Merci romaintaz..
Moi je suivis le source code de panelMenu de richfaces..
D'abord j'ai une page index.jsp où je fais 3 include de 3 pages .jsp:
- header.jsp
- contenu.jsp
- footer.jsp
et dans contenu.jsp j'écris le code suivant:

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
 
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
    <%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
    <%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
    <%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
    <style>
        .cols{
            vertical-align:top;
            width:50%;
        }
    </style>      
 
          <h:form>
          <h:panelGrid columns="2" columnClasses="cols" width="1160">
               <rich:panelMenu mode="ajax" width="246" iconExpandedGroup="disc" iconCollapsedGroup="disc" 
                     iconExpandedTopGroup="chevronUp" iconGroupTopPosition="right" 
                     iconCollapsedTopGroup="chevronDown">
           <rich:panelMenuGroup label="Client" >
 
               <rich:panelMenuItem label="Ajouter" reRender="test" action="Ajouter"> 
                   <f:param value="test value" name="test"/> 
               </rich:panelMenuItem>
               <rich:panelMenuItem label="supprimer" reRender="test" action="Supprimer"> 
                   <f:param value="test value" name="test"/> 
               </rich:panelMenuItem>
               <rich:panelMenuItem label="" reRender="test"> 
                   <f:param value="test value" name="test"/> 
               </rich:panelMenuItem>          
 
 
 
          </rich:panelMenuGroup>
 
      </rich:panelMenu>
        <rich:panel style=" height:700px; width :950px;">    
        <a4j:outputPanel ajaxRendered="true" id="test">
            ....
        </a4j:outputPanel>
    </rich:panel>  
 
    </h:panelGrid>
 
   </h:form>

et je ne sais pas quoi j'écris entre <a4j:outputPanel>
</a4j:outputPanel>

et voilà que j'écris dans faces-config.xml:

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
 
....
 
<navigation-rule>
  <from-view-id>/contenu.jsp</from-view-id>
  <navigation-case>
   <from-outcome>Ajouter</from-outcome>
   <to-view-id>/ajoutclient.jsp</to-view-id>
  </navigation-case>
 </navigation-rule>
 
<navigation-rule>
  <from-view-id>/contenu.jsp</from-view-id>
  <navigation-case>
   <from-outcome>Supprimer</from-outcome>
   <to-view-id>/supprimeclient.jsp</to-view-id>
  </navigation-case>
 </navigation-rule>
 
....

et le code de index.jsp est le suivant:

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
 
 
<%@ taglib uri="http://java.sun.com/jsf/html" prefix="h"%>
<%@ taglib uri="http://java.sun.com/jsf/core" prefix="f"%>
<%@ taglib uri="http://richfaces.org/a4j" prefix="a4j"%>
<%@ taglib uri="http://richfaces.org/rich" prefix="rich"%>
<html>
<head>
<title></title>
</head>
<body>
<f:view>
	<rich:panel style="width:1235px;height:150px;">
       <%@ include file="header.jsp"%>
	</rich:panel>
	<rich:separator width="1235"></rich:separator>
    <rich:panel style="width:1235px;height:700px;">
		<%@ include file="contenu.jsp"%>
    </rich:panel>
 
	<rich:separator width="1235"></rich:separator>	
 
	<rich:panel style="width:1235px;height:50px;">
       <%@ include file="footer.jsp"%>
	</rich:panel>
 
</f:view>
</body>
</html>

J'espère que vous pouvez m'aider...
Je serais reconnaissante...
Merci.

[romaintaz]

... je ne sais pas quoi j'écris entre <a4j:outputPanel>
</a4j:outputPanel> ...

Le composant a4j:outputPanel est juste là pour définir une zone dans ta page, qui sera rafraichie par une action Ajax (avec un a4j:commandButton ou un a4j:commandLink). Tu y places donc tout le code qui doit être rafraichit une fois que l'utilisateur clique sur le bouton / lien...

A noter que tu n'es pas limitée à une zone. Tu peux très bien faire un re-rendu de plusieurs zones : <a4j:commandButton ... reRender="zone1,zone2,..."> par exemple.