Ajouter un gif animé tout en bloquant le bouton Envoyer

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:

---

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

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

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

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

Dans ce cas tu peux m'aider?

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

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

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

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

Code:

---

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

---

@Bovino, avant l'envoi de fichier: Pièce jointe 141129
Pendant l'envoi du fichier : Pièce jointe 141130.
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.

met une image en bakground de ton bouton ?

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

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

Citation:

---

Envoyé par Bovino

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

---

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