Comment faire quelque chose avant de le soumettre? [fermé]

142

J'ai un formulaire qui a un bouton qui soumet le formulaire. Je dois faire quelque chose avant que les soumissions ne se produisent. J'ai essayé de faire onClick sur ce bouton mais cela se produit après la soumission.

Je ne peux pas partager le code mais, généralement, que dois-je faire dans jQuery ou JS pour gérer cela?

javascript jquery html

— Jimmy
source

11

toux jsFiddle Exemple toux

— Brad Christie

2

@Brad Christie si seulement je pouvais accepter un commentaire comme réponse. Merci très utile.

— Jimmy

3

Je déteste quand stackover ferme une question. Vous pouvez gérer vos actions en utilisant les événements suivants qui se déclenchent au moment suivant juste avant de soumettre un formulaire: 1- onmouseover 2- onmousemove 3- onmousedown 4- onfocus 5- onmouseup 6- onclick 7- onsubmit

— Shadi Namrouti

1

J'apprécie cette question parce que j'ai rencontré le même problème tout récemment et que cette question est exactement ce que je voulais poser.

— wastetime909

2

drôle que cette question soit fermée car ce n'est pas une vraie question: -?

— AnnaKlein

207

Si vous disposez d'un formulaire en tant que tel:

<form id="myform">
...
</form>

Vous pouvez utiliser le code jQuery suivant pour faire quelque chose avant que le formulaire ne soit soumis:

$('#myform').submit(function() {
    // DO STUFF...
    return true; // return false to cancel form action
});

— Dan Breen
source

2

J'ai des difficultés à utiliser ceci pour les boucles qui doivent être terminées avant la soumission. Aucune suggestion?

— Smilyan

Vous avez un code à regarder? Je ne suis pas sûr de comprendre le problème.

— Dan Breen

3

Pourquoi est-ce enveloppé dans un appel de fonction vide? La submitfonction ne devrait-elle pas être capable de se lier directement à la fonction $('#form')sans la fonction vide environnante? EDIT: la documentation suggère que l'appel de la fonction environnante n'est pas nécessaire .

— eykanal

@eykanal Bon point. Je suis allé de l'avant et j'ai modifié la réponse pour supprimer le wrapper de fonction après avoir confirmé qu'il fonctionnait bien avec sa suppression.

— Jon Schneider

3

@eykanal J'ai utilisé l'appel de fonction "vide", car c'est un raccourci pour la $(document).ready()fonction de jQuery , qui garantit que le DOM est complet avant d'attacher l' submitévénement. Si votre JS est au bas de la page, ce n'est pas nécessaire, mais si c'est dans la <head>section, vous en avez besoin. Voir: stackoverflow.com/q/13062246/135108

— Dan Breen

23

En supposant que vous ayez un formulaire comme celui-ci:

<form id="myForm" action="foo.php" method="post">
   <input type="text" value="" />
   <input type="submit" value="submit form" />

</form>

Vous pouvez attacher un onsubmit-event avec jQuery comme ceci:

$('#myForm').submit(function() {
  alert('Handler for .submit() called.');
  return false;
});

Si vous return falsene soumettez pas le formulaire après la fonction, si vous retournez vrai ou rien, il sera soumis comme d'habitude.

Consultez la documentation jQuery pour plus d'informations.

— acmé
source

11

Vous pouvez utiliser onclickpour exécuter du code JavaScript ou jQuery avant de soumettre le formulaire comme ceci:

<script type="text/javascript">
    beforeSubmit = function(){
        if (1 == 1){
            //your before submit logic
        }        
        $("#formid").submit();            
    }
</script>
<input type="button" value="Click" onclick="beforeSubmit();" />

— James Johnson
source

18

Mais cela ne fonctionne pas, lorsque le formulaire contient par exemple un champ de saisie et que l'utilisateur frappe la touche de retour qui déclenche l'événement de soumission. Il est généralement préférable de s'attacher directement à l'événement de soumission afin de vous assurer qu'il est appelé quelle que soit la manière dont l'utilisateur a déclenché la soumission.

— acme

2

— Ansyori

5

assurez-vous que le bouton de soumission n'est pas de type "soumettre", faites-en un bouton. Ensuite, utilisez l'événement onclick pour déclencher du javascript. Là, vous pouvez faire ce que vous voulez avant de publier vos données.

— rogerlsmith
source

3

Le formulaire peut être soumis de différentes manières, par exemple en appuyant sur Entrée dans certains champs. Lier à un clic sur un bouton qui ne peut pas être cliqué n'est pas une bonne idée. Les autres réponses montrent comment vous liez onsubmitle formulaire , qui se déclenchera quelle que soit la façon dont le formulaire est soumis.

— Jason