web-dev-qa-db-fra.com

jquery cliquez sur () dans le bouton soumettre

J'ai une fonction .click () sur un bouton d'envoi dans un formulaire:

$("#submitId").click(function () {
    $('#hiddenInput').val(someVariable);
});

Il fonctionne comme un charme. Lorsque le bouton d'envoi est cliqué, la fonction click () remplit la variable d'entrée masquée, puis le formulaire entier est soumis. Le serveur reçoit ensuite l'entrée cachée avec le contenu actualisé.

Ma question est: cela fonctionnera-t-il toujours? Y a-t-il un risque que, pour une raison que je ne connais pas encore, l'opération de soumission soit exécutée en premier et la fonction click () plus tard? Je veux m'assurer que l'entrée cachée est toujours actualisée.

javascriptjqueryformsclicksubmit
10
iteam

Lorsque vous travaillez avec des formulaires, il est toujours conseillé de laisser le bouton submit faire son travail: DÉCLENCHEZ L'ÉVÉNEMENT SOUMETTRE LE FORMULAIRE ... c'est à cela qu'il est destiné. Ensuite, vous écoutez l'événement submit sur form plutôt que l'événement click sur le bouton submit.

Vous pouvez utiliser event.preventDefault() pour empêcher la soumission par défaut du formulaire afin que vous puissiez faire un peu de ménage puis vous pouvez soumettre le formulaire.

$("#submitId").closest('form').on('submit', function(event) {
    event.preventDefault();
    $('#hiddenInput').val(someVariable); //perform some operations
    this.submit(); //now submit the form
});

Ou simplement,

$('form').on('submit', function(event) {
    event.preventDefault();
    $('#hiddenInput').val(someVariable); //perform some operations
    this.submit(); //now submit the form
});
21
PeterKA

Il serait préférable d'attacher la mise à jour de la valeur directement au gestionnaire de soumission du formulaire comme celui-ci

$("#submitId").closest("form").submit(function () {
 $('#hiddenInput').val(someVariable);
});
4
Travis J

Personnellement, je pense qu'il est plus sûr d'empêcher la soumission, puis de définir la valeur de l'entrée nécessaire et de ne soumettre le formulaire que par programme. Comme:

$("form").submit(function (e) {
    e.preventDefault();
    $('#hiddenInput').val(someVariable);
    $(this).submit();
});
2
CmajSmith