Comment intégrer le ProgressBar dans mon projet

**maserati** · 19/01/2012, 13h08

Bonjour,

j'ai une page login.jsf, où les users rentrent les paramètres necessaire pour se connecter à Oracle, je veux que quand ils clique sur Connect un progressBar s'affiche et les rediriger vers la page welcome.jsf

PS: la connexion à Oracle marche nikel, la refirection à la page welcome.jsf marche aussi, je veux juste intégrer le progressBar
login.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
44
45
46
47
48
49
50
51
52
 
<?xml version='1.0' encoding='UTF-8' ?> 
<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"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich">
<head>
      <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
      <link href="css/default.css" rel="stylesheet" type="text/css" />
      <title> LOGICA TESTING BI TOOL</title>
    </head>
 
 <f:view>
    <body>
 
      <img src="img/logica.jpg" class="floatLeft" 
                height="82" width="96"/>
      <h1> LOGICA TESTING BI TOOL</h1> 
      <br clear="all" ></br>
      <table width="100%">
        <tr><td style="background-color: #200070" height="5"></td></tr>
      </table>
      <br clear="all" ></br>   
 
     <h:form>
 
 
 
    <rich:tabPanel headerAlignment="right" switchType="client">
             <rich:tab label="ORACLE">
            <h:panelGrid columns="2">
                <h:outputText value="Host"></h:outputText>
                <h:inputText value="#{ManagedBeanO.host}"></h:inputText>
                <h:outputText value="Port"></h:outputText>
                <h:inputText value="#{ManagedBeanO.port}"></h:inputText>
                <h:outputText value="User"></h:outputText>
                <h:inputText value="#{ManagedBeanO.user}"></h:inputText>
                <h:outputText value="Password"></h:outputText>
                <h:inputSecret value="#{ManagedBeanO.mdp}"></h:inputSecret>
                <h:outputText value="Base Name"></h:outputText>
                <h:inputText value="#{ManagedBeanO.baseName}"></h:inputText>
            </h:panelGrid>
             <h:commandButton value="Connect" 
            action="#{ManagedBeanO.process}" style="width: 6em" />
        </rich:tab>
 
 </h:form>     
 </body>
 </f:view> 
</html>

j'ai trouvé un code de progressBar dans le site de Richefaces mais j'ai pas réussi (ni comprendre ) comment l'intégrer voici leurs code:

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
<ui:composition 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"
    xmlns:a4j="http://richfaces.org/a4j"
    xmlns:rich="http://richfaces.org/rich">
 
    <h:form>
        <a4j:outputPanel id="progressPanel">
            <rich:progressBar value="#{progressBarBean.currentValue}"
                interval="2000" label="#{progressBarBean.currentValue} %"
                enabled="#{progressBarBean.enabled}" minValue="-1" maxValue="100"
                reRenderAfterComplete="progressPanel">
                <f:facet name="initial">
                    <br />
                    <h:outputText value="Process doesn't started yet" />
                    <a4j:commandButton action="#{progressBarBean.startProcess}"
                        value="Start Process" reRender="progressPanel"
                        rendered="#{progressBarBean.buttonRendered}"
                        style="margin: 9px 0px 5px;" />
                </f:facet>
                <f:facet name="complete">
                    <br />
                    <h:outputText value="Process Done" />
                    <a4j:commandButton action="#{progressBarBean.startProcess}"
                        value="Restart Process" reRender="progressPanel"
                        rendered="#{progressBarBean.buttonRendered}"
                        style="margin: 9px 0px 5px;" />
                </f:facet>
            </rich:progressBar>
        </a4j:outputPanel>
    </h:form>
</ui:composition>

javabeansource :

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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
/**
 * 
 */
package org.richfaces.demo.progressBar;
 
import java.util.Date;
 
/**
 * @author Ilya Shaikovsky
 *
 */
public class ProgressBarBean {
 
    private boolean buttonRendered = true;
    private boolean enabled=false;
    private Long startTime;
 
    public ProgressBarBean() {
    }
 
    public String startProcess() {
        setEnabled(true);
        setButtonRendered(false);
        setStartTime(new Date().getTime());
        return null;
    }
 
    public Long getCurrentValue(){
        if (isEnabled()){
            Long current = (new Date().getTime() - startTime)/1000;
            if (current>100){
                setButtonRendered(true);
            }else if (current.equals(0)){
                return new Long(1);
            }
            return (new Date().getTime() - startTime)/1000;
        } if (startTime == null) {
            return Long.valueOf(-1);
        }
        else
            return Long.valueOf(101);
    }
 
    public boolean isEnabled() {
        return enabled;
    }
 
    public void setEnabled(boolean enabled) {
        this.enabled = enabled;
    }
 
    public Long getStartTime() {
        return startTime;
    }
 
    public void setStartTime(Long startTime) {
        this.startTime = startTime;
    }
 
    public boolean isButtonRendered() {
        return buttonRendered;
    }
 
    public void setButtonRendered(boolean buttonRendered) {
        this.buttonRendered = buttonRendered;
    }
}

**DevServlet** · 20/01/2012, 10h30

En general les exemples de RichFaces c'est des plug an play. T'arrives pas à faire tourner l'exemple tel quel ou à l'intégrer dans ta page à toi?
Car pour faire tourner juste la page complète dans ton projet :
-Tu crèes une classe coté controleur et tu y colles le contenu de la classe controleur fournie.
-Tu déclares ce controleur dans ton faces-config
-Et tu crèes ta page xhtml contenant le code intégral fourni sur le site.

Tu bloques où au fait?

**maserati** · 20/01/2012, 15h26

Bonjour,

Merci pour ta réponse.

Sinon j'ai crée une classe bean ( contenant le code que j'ai trouvé dans le site de richfaces)

le problème c'est que la page login.xhtml contient 2 action, la première action c'est de cliquer sur un bouton et afficher le progressBar ( ça je l'ai intégré dans mon projet et ça marche) mais le souci, est que à la fin de la progressBar ( quand elle arrive à 100% ) je dois automatiquement appeller une méthodebean

Code :

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

1
2
<h:commandButton value="Connect" 
            action="#{ManagedBeanO.process}" style="width: 6em" />

afin de se connecter à oracle et passer à la page suivante.

**DevServlet** · 20/01/2012, 15h41

Je pensais que ça devrait pouvoir le faire. Essaie dans :

Code :

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

1
2
3
4
<a4j:commandButton action="#{progressBarBean.startProcess}"
                        value="Start Process" reRender="progressPanel"
                        rendered="#{progressBarBean.buttonRendered}"
                        style="margin: 9px 0px 5px;" />

de rajouter l'attribut onComplete = #{tonBeanConnexion.login} comme attribut, cette attribut lancera automatiquement l'appel de la connexion quand la méthode startProcess aurait rendu la main. Testes et redis nous.

**maserati** · 20/01/2012, 15h50

J'ai modifié mon code :

Code :

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

1
2
3
4
5
<a4j:commandButton action="#{progressBarBean.startProcess}"
                        value="Start Process" reRender="progressPanel"
                        rendered="#{progressBarBean.buttonRendered}"
                       onComplete = "#{ManagedBeanT.process}" 
                        style="margin: 9px 0px 5px;" />

Pour voir le résultat, je dois aller vers la page welcome.xhtml, qui affiche la connexion, or, dans mon Navigation Rule (faces-config.xhtml ) je passe de login.xhtml vers welcome.xhtml que si la méthode process ( me retourne le mot "connect" ).

Donc comment intégrer aussi cette condition dans le code de richfaces ?

Merci par avance de votre aide

**DevServlet** · 20/01/2012, 16h24

Fais nous voir ton faces-config. Normalement si ton faces-config attend la chaine "connect" pour t'envoyer à welcome, si elle ne l'a pas à la fin de cette méthode, elle forcera l'utilisateur à rester sur la même page. Dans ce cas il faudra que dans cette méthode, lors d'un echec de connexion qu'elle prépare un message d'erreur dont l'affichage se fera dans la page de login pour dire à l'utilisateur de recommencer. Fais nous voir ton faces-config voir.

**maserati** · 20/01/2012, 16h30

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
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
 
<?xml version="1.0" encoding="UTF-8"?>
 
<faces-config
    xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd"
    version="2.0">
	<managed-bean>
		<managed-bean-name>ManagedBeanO</managed-bean-name>
		<managed-bean-class>com.test.ManagedBeanO</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
	<managed-bean>
		<managed-bean-name>ManagedBeanT</managed-bean-name>
		<managed-bean-class>com.test.ManagedBeanT</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
	<managed-bean>
		<managed-bean-name>ManagedBeanS</managed-bean-name>
		<managed-bean-class>com.test.ManagedBeanS</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
	<managed-bean>
		<managed-bean-name>progressBarBean</managed-bean-name>
		<managed-bean-class>com.test.ProgressBarBean</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
	<navigation-rule>
		<display-name>login.xhtml</display-name>
		<from-view-id>/login.xhtml</from-view-id>
		<navigation-case>
			<from-outcome>Connect</from-outcome>
			<to-view-id>/welcome.xhtml</to-view-id>
		</navigation-case>
	</navigation-rule>
	<navigation-rule>
		<display-name>login.xhtml</display-name>
		<from-view-id>/login.xhtml</from-view-id>
		<navigation-case>
			<from-outcome>ConnectS</from-outcome>
			<to-view-id>/fromSQL.xhtml</to-view-id>
		</navigation-case>
	</navigation-rule>
	<navigation-rule>
		<display-name>login.xhtml</display-name>
		<from-view-id>/login.xhtml</from-view-id>
		<navigation-case>
			<from-outcome>ConnectT</from-outcome>
			<to-view-id>/fromTeradata.xhtml</to-view-id>
		</navigation-case>
	</navigation-rule>
 
 
</faces-config>

J'ai bien réfléchi, normalement, ta réponse précedente doit marcher, voici le code modifié:

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
        <a4j:outputPanel id="progressPanel">
            <rich:progressBar value="#{ManagedBeanT.currentValue}"
                interval="2000" label="#{ManagedBeanT.currentValue} %"
                enabled="#{ManagedBeanT.enabled}" minValue="-1" maxValue="100"
                reRenderAfterComplete="progressPanel">
                <f:facet name="initial">
                    <br />
                    <h:outputText value="Process doesn't started yet" />
                    <a4j:commandButton action="#{ManagedBeanT.startProcess}"
                        value="Start Process" reRender="progressPanel"
                        rendered="#{ManagedBeanT.buttonRendered}"
                        onComplete = "#{ManagedBeanT.process}"                         style="margin: 9px 0px 5px;" />
                </f:facet>
                <f:facet name="complete">
                    <br />
                    <h:outputText value="Process Done" />
                    <a4j:commandButton action="#{ManagedBeanT.startProcess}"
                        value="Restart Process" reRender="progressPanel"
                        rendered="#{ManagedBeanT.buttonRendered}"
                        style="margin: 9px 0px 5px;" />
                </f:facet>
            </rich:progressBar>
        </a4j:outputPanel>

la méthode process retourne une chaine "Connect "( ça veut dire connexion à Oracle ) donc quand je l'ai implémenté, quand la barre de progression arrive à 100% il m'affiche un boutton "Restart Process "

j'ai supprimé la partie cette partie ci-dessous, mais l'application ne marchais plus ^^ donc je l'ai laissé et je comprends pas comment procéder à une solution

Code :

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

1
2
3
4
5
6
7
8
                <f:facet name="complete">
                    <br />
                    <h:outputText value="Process Done" />
                    <a4j:commandButton action="#{ManagedBeanT.startProcess}"
                        value="Restart Process" reRender="progressPanel"
                        rendered="#{ManagedBeanT.buttonRendered}"
                        style="margin: 9px 0px 5px;" />
                </f:facet>

**DevServlet** · 20/01/2012, 16h39

Qu'est ce qui ne marche pas? c'est quoi le message d'erreur ?

**maserati** · 20/01/2012, 16h42

j'ai fait ce que tu m'avais dit de faire, quand je clique sur le boutton connect, et à la fin de la barre de progression il m'affiche le boutton Restart Process ( donc pas de message d'erreur )

**maserati** · 20/01/2012, 16h44

Ce que je veux, c'est qu'à la fin de la barre de progression, je sois rediriger vers welcome.xhtml ( vu que j'ai intégré le onComplete = "#{ManagedBeanT.process}" )

**DevServlet** · 20/01/2012, 16h55

En fait y'a une erreur dans ton faces-config, quand je relis mieux là :

Code :

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

1
2
3
4
5
6
<navigation-case>
      <from-action>#{tonBean.pprocess}</from-action>
      <from-outcome>Connect</from-outcome>
      <to-view-id>/welcome.xhtml</to-view-id>
      <redirect/>
    </navigation-case>

Essaie plutot ca. en laissant ton xhtml comme je te l'ai proposé

**maserati** · 20/01/2012, 16h57

voilà j'ai modifié mon faces-config.xml

Code :

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

1
2
3
4
5
6
7
8
9
<navigation-rule>
		<display-name>login.xhtml</display-name>
		<from-view-id>/login.xhtml</from-view-id>
		<navigation-case>
            <from-action>#{ManagedBeanT.process}</from-action>
			<from-outcome>Connect</from-outcome>
			<to-view-id>/welcome.xhtml</to-view-id>
		</navigation-case>
	</navigation-rule>

mais ça marche toujours pas

**DevServlet** · 20/01/2012, 17h00

Envoyé par maserati

Non ça marche pas, et y a pas de message d'erreur !

En fait y'a une erreur dans ton faces-config, quand je relis mieux là :

Code :

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

1
2
3
4
5
6
<navigation-case>
      <from-action>#{tonBean.pprocess}</from-action>
      <from-outcome>Connect</from-outcome>
      <to-view-id>/welcome.xhtml</to-view-id>
      <redirect/>
    </navigation-case>

Essaie plutot ca. en laissant ton xhtml comme je te l'ai proposé

**maserati** · 20/01/2012, 17h09

Oui j'ai fait ce que tu m'avais demandé de faire ( cf: mon précédent commentaire ) mais ça marche pas

**DevServlet** · 21/01/2012, 10h56

Désolé je viens de voir ton message. Parti du bureau un peut tôt hier. T'as bien mis ça :

Code :

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

<from-action>#{tonBean.process}</from-action>

? Il faut dire à faces-config, qu'à la fin de ta methode process ce qu'il doit faire. remontres moi ton faces config si tu l'as fait. Tu suis pas à pas ce que je te décris et ça marchera

**maserati** · 27/01/2012, 10h53

Désolé pour le retard dû à des soucis perso.

Voici mon face-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
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
<?xml version="1.0" encoding="UTF-8"?>
 
<faces-config
    xmlns="http://java.sun.com/xml/ns/javaee"
    xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-facesconfig_2_0.xsd"
    version="2.0">
	<managed-bean>
		<managed-bean-name>ManagedBeanO</managed-bean-name>
		<managed-bean-class>com.test.ManagedBeanO</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
	<managed-bean>
		<managed-bean-name>ManagedBeanT</managed-bean-name>
		<managed-bean-class>com.test.ManagedBeanT</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
	<managed-bean>
		<managed-bean-name>ManagedBeanS</managed-bean-name>
		<managed-bean-class>com.test.ManagedBeanS</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
	<managed-bean>
		<managed-bean-name>progressBarBean</managed-bean-name>
		<managed-bean-class>com.test.ProgressBarBean</managed-bean-class>
		<managed-bean-scope>session</managed-bean-scope>
	</managed-bean>
	<navigation-rule>
			<from-view-id>/login.xhtml</from-view-id>
		<navigation-case>
            <from-action>#{ManagedBeanO.process}</from-action>
			<from-outcome>Connect</from-outcome>
			<to-view-id>/welcome.xhtml</to-view-id>
		</navigation-case>
	</navigation-rule>
	<navigation-rule>
		    <from-view-id>/login.xhtml</from-view-id>
		<navigation-case>
		    <from-action>#{ManagedBeanS.process}</from-action>
			<from-outcome>ConnectS</from-outcome>
			<to-view-id>/fromSQL.xhtml</to-view-id>
		</navigation-case>
	</navigation-rule>
	<navigation-rule>
				<from-view-id>/login.xhtml</from-view-id>
		<navigation-case>
		 <from-action>#{ManagedBeanT.process}</from-action>
			<from-outcome>ConnectT</from-outcome>
			<to-view-id>/fromTeradata.xhtml</to-view-id>
		</navigation-case>
	</navigation-rule>
 
 
 
</faces-config>

Donc j'ai fait ce que tui m'avait dit, mais ça marche toujours pas, please help

Comment intégrer le ProgressBar dans mon projet

JSF Java

Discussions similaires

Partager

Partager