Barre de progression

Version imprimable

14/12/2006, 11h24
yousfi.z

Barre de progression

Bonjour à tous,

dans une page web j'ai un bouton.
Apres avoir cliquer dessus,une opération est lancée. Cette opération peut prendre une dizaine de minutes.
J'aimerai afficher un message ou une barre de progression qui indique que l'opération est en cours.
Est ce que quelqu'un a une solution un peu détaillée?

Merci d'avance pour vos aides.
14/12/2006, 12h20
Jabbal'H

bah un javascript qui lance la page jsp en arrière plan, ta jsp lui envois l'info quand elle a finis le traitement. Donc sur le retour d'info tu lance une fonction javascript qui stoppe la barre ou efface le message.
14/12/2006, 12h37
c_nvy

Jette un oeil à cette discussion qui traite déjà du sujet.;)

J'ai essayé la proposition de c_nvy. (image animéé)
Mais j'ai un problème lorsque je clique sur le bouton l'image n'apparait pas (il ya juste une croix rouge.
Voici ma page jsp

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
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html"%>
<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean"%>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic"%>
<%@ taglib uri="/WEB-INF/struts-layout.tld" prefix="layout"%>
<html:html>
<HEAD>
<script>
  function showGif() 
  { 
  document.getElementById("gif").style.visibility="visible"; 
  }
function Valoriser()
{
 
var frm=document.forms.item(1);
 
frm.BUTTON_ACTION.value ='INSERT';
 
frm.submit();
}
</script>
 
 
 
</HEAD>
<BODY>
 
<layout:form action="/operationACT" styleClass="FORM" width="100%">
 
	<layout:text key="" mode="N,H,R" property="BUTTON_ACTION" />
	<layout:text key="" mode="N,H,R" property="CODOPE" />
 
 <layout:row>
<div id="gif" style="visibility: hidden;">   
<img src="ajax-loader.gif" width="100" height="30">
</div>
</layout:row>
<layout:row>
<layout:button onclick="showGif();Valoriser();" style="width: 100px;" property="upd">   
		Valoriser
    </layout:button> 
</layout:row> 
</layout:form>
</BODY>
</html:html>

14/12/2006, 14h45
c_nvy

Essaie en utilisant le tag layout:img comme ceci :

Code:

<layout:img src="ajax-loader.gif" width="100" height="30">

ceci suppose que ajax-loader.gif est sous WEB-INF.

J'ai l'erreur balise inconnue pour layout:img
Code:

1 2 3 4 <layout:img src="ajax-loader.gif" width="100" height="30" > </layout:img>

14/12/2006, 15h10
c_nvy

Ah bon ? quelle version de Struts-Layout utilises-tu ?

Sinon, il existe aussi le tag layout:image mais je crois que tu ne peux pas spécifier les attributs width et height.
Mais bon, ça n'empêche pas de faire un essai.;)
14/12/2006, 15h25
yousfi.z

J'utilise la version 1.0.
Oui, comme vous l'avez dit, on ne peut pas spécifier les attribut height et width avec le tag image.

Sinon bouchette 63 a proposé une solution http://www.developpez.net/forums/sho...d.php?t=222271

Comment je peux modifier display à block en lançant l'opération?

Merci.
14/12/2006, 15h57
c_nvy

L'image ne s'affiche pas parce qu'il faut y rajouter le contexte de l'application.
Normalement, les tags de Struts-Layout le font automatiquement mais comme tu ne peux pas utiliser les tags layout:image et layout:img, tu peux essayer ceci :

Code:

<img src="<%=request.getContextPath()+"/ajax-loader.gif"%>" width="100" height="30">
14/12/2006, 16h13
yousfi.z

même ça n'a pas résolu le problème
14/12/2006, 17h07
c_nvy

Ton gif est bien directement sous WEB-INF ?
14/12/2006, 17h14
yousfi.z

Oui.
14/12/2006, 19h02
c_nvy

Peux-tu montrer le code html généré ?
14/12/2006, 21h26
gronono

Code:

<img src="<%=request.getContextPath()+"/ajax-loader.gif"%>" ...

Pour que le code ci-dessus marche, il faut que l'image soit à la racine de l'application donc dans le dossier parent de WEB-INF.

Pour info, le contenu du dossier WEB-INF est accessible uniquement au serveur mais pas par le client (ie le navigateur) : son contenu n'est pas publié.

Sinon je rajouterai un / avant request.getContextPath() :

Code:

<img src="/<%=request.getContextPath()+"/ajax-loader.gif"%>" ...

A+
14/12/2006, 21h39
c_nvy

Citation:

Envoyé par gronono

Code:

<img src="<%=request.getContextPath()+"/ajax-loader.gif"%>" ...

Pour que le code ci-dessus marche, il faut que l'image soit à la racine de l'application donc dans le dossier parent de WEB-INF.

Pour info, le contenu du dossier WEB-INF est accessible uniquement au serveur mais pas par le client (ie le navigateur) : son contenu n'est pas publié.

Tu as raison gronono, il ne faut pas le mettre sous WEB-INF mais à la racine du projet.
Désolée yousfi.z de t'avoir mal conseillé.:oops:
15/12/2006, 09h31
yousfi.z

Je vous remercie c_nvy et gronono, l'image est affichée mais elle n'est pas animée. Lorsque je l'ouvre à partir de mon projet (avec WebSphere Studio WebArt Designer) elle n'est pas animée.
Est ce que vous savez pourquoi l'image n'est plus animée?
29/12/2006, 14h50
don'de

Salut,
je suis aussi intéressé par ce sujet, faites moi savoir si vous avez trouvé une solution à cette gif figée.
merci ;)
29/12/2006, 15h00
remika

Perso j'avais suivi ce lien : http://wiki.apache.org/struts/StrutsPleaseWait
pour faire une page avec attente.

Mon gif animé était figé sous IE, pas sous Firefox...