ouvrir une fenétre popup

Version imprimable

29/07/2008, 12h28
sal.gass

ouvrir une fenétre popup

Salut pour tous,
Est ce que jboss seam permet d'ouvrir une fenetre popup xhtml à partir d'un click sur un bouton.
Si oui comment je procède pour ouvrir une tel page sous forme de popup ?
et comment je fait passer les actions à la page popup qui souvre ?
j'ai utilisé ça avec java script, la page popup s'ouvre mais les actions ne s'exécutent pas.

;)Merci pour votre aides;)

Salut,

Tu utilise IceFaces ou RichFaces ?

Moi, j'utilise icefaces et voici donc comment j'ai fait :

j'ai créé une page xhtml (qui correspond à ma popup) comme ceci :

maPopup.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
27
28
29
30
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
                      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<f:view xmlns="http://www.w3.org/1999/xhtml"
                xmlns:s="http://jboss.com/products/seam/taglib"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:h="http://java.sun.com/jsf/html"
		    xmlns:ice="http://www.icesoft.com/icefaces/component"
		    xmlns:c="http://java.sun.com/jstl/core"
                template="layout/template.xhtml">


<ice:panelPopup visible="#{maPopup.visible}" style="position: absolute; top:250px; left:400px; width:750px;" draggable="true">
 		
	<f:facet name="header" >
        <ice:panelGrid cellpadding="0" cellspacing="0" columns="2" style="text-align: center;" >
           <ice:outputText style="color: #FFFFFF;" value="Les couleurs"/>
        </ice:panelGrid>
    </f:facet>
                
    <f:facet name="body">		
 		 <ice:panelGroup>
                </ice:panelGroup>
 		
    </f:facet>
 		
 </ice:panelPopup>

</f:view>

c'est grace à cette attribut visible que tu ouvrira et fermera ta popup.

Ensuite dans la page xhtml où tu veux ouvrir ta popup tu ajoutes à la fin (avant </ui:define>) :

monFichier.xhtml :

Code:

1
2
3
4
5
 
<ice:form id="maPopup">
	<ui:include src="/maPopup.xhtml">
	</ui:include>
	</ice:form>

Ensuite tu as ton bean java maPopup.java, dans cette classe tu as une variable visible et une méthode ouvrir :

maPopup.java :

Code:

1
2
3
4
5
6
7
8
9
10
11
 
@Name("maPopup")
public class maPopup{
          private boolean visible = false;
 
          public void ouvrir(ActionEvent event){
               visible=true;
          }
 
         // les getters et les setters
}

et ensuite pour ouvrir ta popup en cliquant sur un bouton tu ajoute dans monFichier.xhtml:

Code:

1
2
3
 
 
<ice:commandButton value="ouvrir Popup" actionListener="#{maPopup.ouvrir}" />

J'espère que j'ai été clair

Bon courage

Merci bien bard123 pour votre réponse,
pour votre question, moi j'utilise RicheFaces.
Aussi dans richeFaces il y a un composant similaire à ce que vous avez utiliser
<rich:modalPanel>.

j'ai résolut le problème en utilisant un composant seam <s:Link>
avec target =New.
<s:Link ... target="New" />
ou bien en utilisant un simple composant <h:commandlink> avec target=#
<h:commandlink ... target="#" />.
Avec ces deux méthode, la fenêtre en question s'ouvre dans un nouveau onglet du Browser pas sous forme de pop up.

J'ai fait des recherches comment récupérer la valeur d'un composant JSF et le modifier en javaScript :
supposant on a la from suivante:
<h:form id="myform">
<h:inputText id="nom" ..../>
<h:inputText id="prenom" ..../>
</h:form>
le nom de l'élément doit être: "myform:nom" et "myform:prenom" et on fait l'accée par la méthode document.getElementById(''); . par exemple :

var nom_field = document.getElementById('myform:nom');
var prenom_field = document.getElementById('myform:prenom');
nom_field.value = prenom_field.value;

Voici un exemple ou on passe la référence du forme comme paramétré à la fonction java script: onkeypress();
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 <h:form id="myform"> <h:inputText id="nom" onkeypress("KeyPress(this.form)") ..../> // this fait la référence sur la forme courante // this.form renvoie la référence de la forme <h:inputText id="prenom" ..../> </h:form> ... ... function KeyPress(formRef) { var nom_field = document.getElementById(formRef.name + ':nom' ); //==> formRef.name renvoie l'id de la forme "myform" var prenom_field = document.getElementById(formRef.name + ':prenom' ); .... }
:yaisse2: Merci le problème est résolut :yaisse2:

Mais la discussion appartient ainsi au forum jsf pas au forum seam.