Image pour faire patienter l'utilisateur

**sakhavat** · 13/04/2011, 10h31

Bonjour tout le monde

J'ai besoin de votre aide.
Problème: Le temps de chargement prend du temps. Il faut mettre une image gif.

Code html :

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

1
2
3
<table width="100%">
<tr><td colspan="2"><center><input id="submit" type="image" src="contents/php/bouton_dl.png" value="submit"></center></td></tr>
</table>

Voilà le code: Je veux que quand je clique sur le bouton ca envoie le formulaire, et en meme temps il affiche l'image gif qui indique que la page est en train de charger.
Ca doit etre possible en javascript avec onclick, mais je sais pas comment faire, je suis un vrai débutant.

Merci d'avance
Sakhavat

**andry.aime** · 13/04/2011, 11h05

Je ne vois pas trop l'intérêt car la page va se recharger

Code html :

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

<input id="submit" type="image" src="contents/php/bouton_dl.png" value="submit" onclick="this.src='newImage.gif';"/>

**sakhavat** · 13/04/2011, 17h02

Merci bcp, c'est ce que je cherchais.
L’intérêt c'est de dire aux utilisateur qu'il se passe quelque chose: patienter!
Car quand on clique sur le bouton de téléchargement, ca prend bcp de temps, et l'utilisateur peut quitter la page, s'il voit l'image des chargement , il va patienter.

Voilà l'intérêt

**sakhavat** · 14/04/2011, 16h34

J'ai juste une question, vous avez mit un "/" a la fin, est ce que c'est correct?

Car j'ai testé le code , mais chez moi en local ca fonctionne, mais sur le serveur à distant ca fonctionne pas.

Ca peut etre a cause de "/"?

Vous pouvez m'ecrire la version correct de ce code svp?
onclick ou onClick?
quoi d'autre empecher la fonctionnement de ce code???

Merci d'avance.
Sakhavat

**SpaceFrog** · 14/04/2011, 16h44

un input est une balise autofermante ...

**ABCIWEB** · 15/04/2011, 01h52

En html strict on met un "/" devant le ">" pour les balises auto fermantes.

De même en html strict on écrit onclick et non onClick.

Mais bon cela invaliderait juste ta page au niveau du validateur mais ce n'est pas l'origine de ton pb.

Pour ton problème, l'image est-elle correctement chargée sur le serveur distant et son adresse est-elle bonne par rapport à ton code ?

**sakhavat** · 15/04/2011, 10h45

J'ai verifié plusier fois, oui le lien est correct. Au début le code fonctionnait, mais mnt il fonctionne plus.
Onclick, je l'ai mis devant, ca fonctionne pas non plus.

Je comprends rien.

**ABCIWEB** · 15/04/2011, 19h15

Essayes cela, c'est le principe :

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
<?php
if (isset($_POST['envoi']))
{
sleep(2);
}  
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans titre</title>
<script type="text/javascript">
<!--
function Annonce_attente(id_attente)
    {      
        var attente;
 
        if (attente = document.getElementById(id_attente))
        {
            attente.innerHTML = 'Patientez...';
        }
    }
-->
</script>
</head>
 
<body>
 
<div>  
 
	<form action = "#" method = "post" onsubmit = "Annonce_attente('message_attente')" >
 
		<p>       				 
			<input type = "submit" value = "Envoyez"  name="envoi" />
		</p>
 
    </form>
 
</div>
 
<div id = "message_attente" style="margin-top:20px;">
</div>
 
</body>
</html>

**flyingfr53** · 21/04/2011, 09h53

Souvent les pbs de difference entre local et distant viennent des majuscules sur les noms de fichiers.

Image pour faire patienter l'utilisateur

JavaScript

Discussions similaires

Partager

Partager