Discussion :

[valmeras]

Bonjour à tous,

J'ai un problème auquel je n'arrive pas à trouver de solution et cela me perturbe. Voila j'ai un formulaire d'envoi multiple et je voulais ajouter un gif animé qui viendra remplacer l'ecriture afin de faire patienter l'utilisateur le temps de l'envoi. J'ai en quelque sorte reussi mais le problème est que je ne sais pas comment insérer le gif animé. Voici le code de mon formulaire.

Code html :

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

1
2
3
4
<form action="" method="post" enctype="multipart/form-data" onsubmit="document.getElementById('upload').disabled=1;">
	<input type="file" name="files[]" multiple="multiple" accept="pdf/*"><br />
	<input type="submit" id="upload" value="Envoyer" onClick="this.form.submit();this.disabled=true;this.value='En Cours...'">
</form>

J'aimerais afficher un gif animé à la place de "En Cours..." puisque c'est lui qui remplace "Envoyer" lorsque l'upload est en cours.

J'ai besoin de votre aide.

PS: Je voudrais que cela soit en JavaScript.

Merci et bonne journée à vous

[SpaceFrog]

quel interet de faire un submit sur le clcik du bouton submit ???

[valmeras]

C'est pour que le bouton "Envoyer" ne soit plus "clickable" lorsqu'un fichier est en cours d'envoi.

[SpaceFrog]

heu ben le submit ne sert à rien alors ...

[valmeras]

Dans ce cas tu peux m'aider?

[SpaceFrog]

déja je passerait par le onsubmit du form, et pas sur le click du bouton submit ...

dans le onsubmit tu desactives le bouton

après pour l'image il suffii de modifier le style display d'un gif sur la page

[Bovino]

De toute façon, un GIF animé après le submit sera figé, donc ton truc, ça sert pas à grand chose !

[valmeras]

Qu'est ce que je dois faire alors?

Au début je faisais apparaître un gif animé juste en bas du bouton "Envoyer" mais le problème est que, lorsqu'un fichier est en cours d'envoi, l'utilisateur pouvait appuyer encore sur le bouton "envoyer"; ce qui a pour inconvénients de relancer l'upload. ET c'est ce que je veux éviter.
Faites moi des propositions s'il vous plaît si possible avec des exemples.

Merci

[Bovino]

Logiquement, ce que tu as déjà fait est déjà amplement suffisant à un détail près...

Code html :

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

<input type="submit" id="upload" value="Envoyer" onClick="this.disabled=true;this.value='En Cours...'">

[valmeras]

@Bovino, avant l'envoi de fichier:
Pendant l'envoi du fichier : .
avant l'envoi on peut clicker sur le bouton "Envoyer". Cependant, lors de l'envoi le bouton "Envoyer" est désactivé pour éviter que l'utilisateur ne click dessus une nouvelle fois. De plus pour le faire patienter, "envoyer" est remplacé par "en cours...". Maintenant ce que je veux c'est de remplacer la phrase "en cours..." par une image gif. Raison pour laquelle je suis sur ce forum, pour avoir de l'aide. Alors si vous pouvez me faire des propositions afin de m'aider à avancer, cela me ferait plaisir.

[SpaceFrog]

met une image en bakground de ton bouton ?

Mais bon ça n'apporte pas grand chose à l'ergonomie

[valmeras]

J'ai pu résoudre mon problème comme je le voulais.
Merci à tous.

[Auteur]

De toute façon, un GIF animé après le submit sera figé, donc ton truc, ça sert pas à grand chose !

il y a une petite astuce, à voir si c'est toujours valable :
http://www.developpez.net/forums/d65...formulaire-ie/