Empêcher la soumission multiple d’un formulaire

Lorsqu’on utilise des formulaires, on est souvent confronté au problème de la soumission multiple. Pour éviter cela il suffit d’utiliser la méthode JavaScript suivante :

function soumettreUneSeuleFois(formulaire) {   if (formulaire.elements['submit']  != null) {     if (formulaire.elements['submit'].disabled) {       return false;     }     formulaire.elements['submit'].disabled = true;     formulaire.elements['submit'].value = 'Veuillez patienter';   }   return true; }

Quant au code HTML du formulaire, il sera le suivant :

<form action="traitement.php" method="post"          onsubmit="return soumettreUneSeuleFois(this);">   <fieldset>     <input name="champ" type="text" />     <input type="submit" name="submit" value="soumettre" />   </fieldset> </form>

Ainsi lorsque le formulaire sera soumis, que ça soit par l’appui sur la touché Entrée ou bien par un clic sur le bouton de soumission, ce dernier sera désactivé et son texte sera remplacé par un message d’attente.

Ce contenu a été publié dans Développement Web. Vous pouvez le mettre en favoris avec ce permalien.

6 réponses à Empêcher la soumission multiple d’un formulaire

  1. Eric Daspet dit :

    Et moi de ne toujours pas comprendre pourquoi les navigateurs ne le font pas par d?faut, c’est leur boulot apr?s tout : ?viter d’envoyer plusieurs fois la m?me requ?te en attendant la r?ponse.

  2. solo dit :

    Sympa le script 🙂

  3. ZIKoS dit :

    mais si le javascript est desactiv? ?
    Bon moi et mes betises on part au P?rou.

  4. JMF dit :

    ZIKoS> Dans ce cas le formulaire a un fonctionnement normal. C’est justement l’int?r?t de ce type d’impl?mentation. Cela am?liore l’exp?rience utilisateur comme disent nos amis de la communication si le JavaScript est pr?sent et se d?grade parfaitement bien dans le cas contraire.

  5. dash dit :

    Attention ! La methode est traitre.
    Si la fonction soumettreUneSeuleFois() desactive le bouton "submit" lors de la validation du formulaire, la variable $_REQUEST[‘submit’] / $_POST[‘submit’] n’existera plus ! Donc, ca n’aura plus aucun sens de faire un test sur cette valeur. Par exemple sur des formulaires plus complexes (comme le formulaire de commentaire de ce blog).
    Il faut y penser. Je me suis fait surprendre sur mon blog…
    Solution : utiliser un champ hidden (par exemple "copy_submit") qui servira de temoin en cas de besoin 🙂

  6. Archaoniro dit :

    Hello,

    Important, quelqu’un sait s’il existe une solution pour que le bouton submit une fois d?sactiv? (disabled=’true’) soit r?activ? ?
    J’ai essay? avec disabled=’false’ mais ?a ne fonctionne pas…

    Merci beaucoup

Les commentaires sont fermés.