Message pendant chargement d'une page

Version imprimable

Bonjour à toutes et à tous,

Alors... mon problème est simple... je n'arrive par aucun moyen à mettre un message d'attente sur certaines pages (avec quelques beaux traitements) qui demandent un certain temps à s'afficher.

J'ai essayé les méthodes suivantes :
1) Javascript :
Code:

1 2 3 4 5 <script language="javascript"> function fin_chargement(){ document.getElementById('siteLoader').style.display='none'; } </script>
ET ça :
Code:

1 2 <body onLoad="fin_chargement()"> <div id='siteLoader' style='position:aboslute; left:50%; top:50%; width:200px; height:100px; margin-left:-100px; margin-top:-50px; background-color:0066CC; color:FFFFFF;'>Please wait...</div>
2) OnLoad dans le Body :
Code:

1 2 <body onLoad="document.getElementById('siteLoader').style.display='none';"> <div id='siteLoader' style='position:aboslute; left:50%; top:50%; width:200px; height:100px; margin-left:-100px; margin-top:-50px; background-color:0066CC; color:FFFFFF'>Please wait...</div>
3) Avec CFFLUSH :
Code:

1 2 <div id='siteLoader' style='position:aboslute; left:50%; top:50%; width:200px; height:100px; margin-left:-100px; margin-top:-50px; background-color:0066CC; color:FFFFFF'>Please wait...</div> <CFFLUSH>
Et ça en fin de script :
Code:

1 2 3 <SCRIPT> document.getElementById('siteLoader').style.display='none'; </SCRIPT>
Là j'ai un message d'erreur comme quoi CFFLUSH est mal positionné !!!

Bref... je patauge... et j'ai grand besoin de votre aide ;)

Merci d'avance et n'oubliez pas... la vie est une fête !!!

Bonjour,

Une possibilité d'utiliser CFFLUSH (tirée de la documentation ColdFusion):

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
<html>

<head>
  <title>Your Magic numbers</title>
</head>

<body>
<H1>Your Magic numbers</H1>
<P>It will take us a little while to calculate your ten magic numbers. 
It takes a lot of work to find numbers that truly fit your 
personality. So relax for a minute or so while we do the hard 
work for you.</P>
<!-- Remarque pour utiliser correctemnet l'attribut position:absolute, il est nécessaire d'avoir un élément avec l'attribute:relative -->
<div id="siteLoade" style='position:aboslute; left:50%; top:50%; width:200px; height:100px; margin-left:-100px; margin-top:-50px; background-color:0066CC; color:FFFFFF;'>Please wait...</div>

<cfflush>

<cfflush interval=10>
<!--- Delay Loop to make is seem harder --->
<cfloop index="randomindex" from="1" to="200000" step="1">
  <cfset random=rand()>
</cfloop>

<!--- Now slowly output 10 random numbers --->
<cfloop index="Myindex" from="1" to="10" step="1">
  <cfloop index="randomindex" from="1" to="100000" step="1">
    <cfset random=rand()>
  </cfloop>
  <cfoutput>
    Magic number number #Myindex# is:&nbsp;&nbsp;#RandRange( 
100000, 999999)#<br><br>
  </cfoutput>
</cfloop>

<SCRIPT>
document.getElementById('siteLoader').style.display='none';
</SCRIPT>
</body>
</html>

Une autre solution plus statique est d'appeler une page intermédiaire qui affiche le message d'attente. Dans cette page, il existe une redirection vers la page de traitement.

Page d'attente intermédiaire

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<html>

<head>
  <meta http-equiv="refresh" content="; url=http://www.mon_site.com/url_de_la_page_de_traitement.cfm" />
  <title>Your Magic numbers</title>

</head>

<body>
<H1>Page d'attente</H1>
<P>Please wait...</div>
</body>
</html>

04/02/2010, 12h29
Jordel

Hello,

Ah bah de suite ça va mieux :)
J'ai utilisé sans encombre la première solution :)

Un grand merci !!!