Devrait jQuery $(document).submit(); ne pas déclencher onSubmit dans la balise form?

J'ai le texte suivant:

<script type="text/javascript">
function CancelFormButton(button) {
    $(button.form).submit();
}
</script>

<form onsubmit="alert('here');">
<input type="button" value="Cancel" onClick="CancelFormButton(this);" />
</form>

Lorsque je clique sur le bouton "Annuler", le onsubmit du formulaire balise n'est pas déclenché.

Cette ligne au lieu soumet le formulaire avec succès: $(button.form).submit(); mais ignore la alert('here'); dans le onsubmit dans la balise form.

Est-ce correct ou suis-je en train de faire quelque chose de mal?

Par la façon dont, dans ce cas, je veux que cette fonctionnalité, mais je me demande si je vais avoir un problème dans un navigateur où le onsubmit est déclenchée.

InformationsquelleAutor Darryl Hein | 2009-03-14

jquery onsubmit

51

Désolé, mal compris votre question.

Selon Javascript - capture onsubmit lors de l'appel de la forme.submit():

M'a récemment demandé: "Pourquoi ne pas l'
forme.événement onsubmit faire virer quand j'
soumettre mon formulaire à l'aide de javascript?"

La réponse: les navigateurs Actuels ne sont pas
adhérer à cette partie de l'html
spécification. L'événement ne se déclenche
lorsqu'il est activé par un utilisateur et
ne se déclenche pas lorsqu'il est activé par
code.

(italiques ajoutés).

Remarque: "est activé par un utilisateur" comprend également frapper les boutons de soumission (incluant probablement par défaut de soumettre le comportement de la touche entrée, mais je n'ai pas essayé). Ni, je crois, qu'il ne se déclencher si vous (avec code) cliquez sur un bouton de soumission.
- Ce n'est toujours pas déclencher le onsubmit du formulaire... est-ce normal?
- Oui, c'.le formulaire est valide et correct et fonctionne dans tous les navigateurs. stackoverflow.com/questions/418076/... en outre, vous n'avez pas répondu à la question.
- Aussi, confondu par "plus précisément, il est de connaître la forme de l'attribut sur le bouton."
- Grrr, réponse, là encore, au lieu de changer la question! Je regarde comme un fou maintenant 🙁 Mais, thxs pour l'explication. Je me demande ce que le "courant" est.
- Juste testé dans IE6, et il ne déclenche pas le onsubmit...donc, ça fait un moment.
- Oui, il est déclenché avec entrée et en cliquant sur un bouton de soumission. Et oui, il n'est pas déclenché lors de l'utilisation de code de cliquer sur un bouton de soumission.
- le lien ne semble pas exister de plus?
- Vous demandez-vous, si c'est toujours le même?
InformationsquelleAutor cletus
26

Ce contourner résoudre le problème constaté par @Cletus.
```
function submitForm(form) {
    //get the form element's document to create the input control with
    //(this way will work across windows in IE8)
    var button = form.ownerDocument.createElement('input');
    //make sure it can't be seen/disrupts layout (even momentarily)
    button.style.display = 'none';
    //make it such that it will invoke submit if clicked
    button.type = 'submit';
    //append it and click it
    form.appendChild(button).click();
    //if it was prevented, make sure we don't get a build up of buttons
    form.removeChild(button);
}
```
Fonctionne sur tous les navigateurs modernes.
Fonctionnent sur onglets/donné naissance à l'enfant de windows (et oui, même dans IE<9).
Et en la vanille!

Juste passer un DOM référence à un élément de formulaire, et il va assurez-vous que tous les auditeurs, le onsubmit, et (si sa ne l'empêche pas d'ici là) enfin, de soumettre le formulaire.
- C'est vraiment une bonne solution de contournement.
- Il suffit de mettre ceci dans mon MVC web app du dossier Scripts. De travail magnifique!!! J'utilise cette où j'ai JQuery UI dialog boutons d'essayer de soumettre des formulaires qui sont affichés à partir des enfants dans l'IFRAME.
- J'ai essayer différentes solutions, seulement celui-ci fonctionne sur tous les navigateurs, et déclencheur d'événement d'envoi et formulaire de vérification de la validité (afficher les messages d'erreurs) dabblet.com/gist/97a733d9c787dcf99cff
- Et voici le jquery équivalent si vous êtes déjà à l'aide de jQuery: var form = $('youFormSelector'); var submitBtn = $('<input type="submit"></input>'); submitBtn.appendTo(formulaire); submitBtn.cliquez sur(); submitBtn.remove();
- vous êtes en supposant que quelques petites choses ici. Que si form est dans un autre document, appendTo() permet de cloner l'élément pour vous (j'ai utilisé open() pour faire un popup et essayé appendTo(); ne fonctionne pas). Que du jQuery click() invoquera soumettre (je l'ai testé sur un anchor et la page n'a pas changé). Cependant, même si vous êtes de droite, vous pouvez faire beaucoup plus succincte que vous l'avez fait, sinon vous pourriez tout aussi bien continuer à utiliser mon code. function submitForm(form) { $('<input>', {type:'submit', style:'display:none'}).appendTo(form).click().remove(); }
- Merci pour le commentaire de @Hashbrown. Je ne suis pas tout à fait sûr de savoir pourquoi vous dire, je suppose que jQuery click() va appeler soumettre. C'est l'entrée de type de l'attribut, autant que je comprends de votre code d'origine, qui soumet le formulaire. Mon code semble fonctionner avec un formulaire sur le même document (qui est le contexte de cette SORTE). Aussi, je n'ai pas très bien votre commentaire sur le clonage. N'est-ce pas $('<input/>').appendTo(la cible), de même que la création de la première $('<input/>') et en ajoutant à la cible?
- Pas de soucis. Je voulais dire que jQuery click(), au moins pour moi, ne semble pas appeler de l'élément sur. Il semble que du feu jointe, cliquez sur événements. Donc <a>s de ne pas déménager, <input type="submit">s l'habitude de présenter, et cetera. Et l'autre point est que le jQuery, le code que nous avons écrit de travail pour toutes les formes, mais celles qui existent dans les documents à côté de l'exécution. Id est, dans des cadres, et fenêtres enfants. Pour jQuery, vous aurez besoin de adopt d'abord dans ces cas. La magie dans mon script original est form.ownerDocument, création de l'élément dans l'environnement natif de l'obtenir-aller
- jQuery cliquez sur() fonctionne bien pour moi. Je dois dire que je ne l'ai pas testé sur des éléments à l'intérieur des cadres ou d'autres documents. Mais je considère que c'est en dehors de la portée de cet article. D'ailleurs, je ne pense pas qu'il y est un "one size fits all" solution pour cela.
InformationsquelleAutor Hashbrown
6

Ma solution simple:
```
$("form").children('input[type="submit"]').click();
```
C'est un travail pour moi.
- C'est en supposant que vous avez soumettre buttom
- Si vous avez un bouton "envoyer", puis le onsubmit serait de tir. Je crois que le problème est quand le type=button onclick=...
- c'est une simple solution de contournement pour avoir un type=bouton soumettre
InformationsquelleAutor rukeba
6

Je suppose que c'est raisonnable pour que ce comportement dans certains cas, mais je dirais que le code ne le déclenchement de la soumission d'un formulaire doit toujours être le comportement par défaut. Supposons que vous voulez attraper un formulaire de soumission avec
```
$("form").submit(function(e){
    e.preventDefault();
});
```
et ensuite la validation de l'entrée. Si le code pourrait déclencher soumettre des gestionnaires, vous pourriez ne jamais inclure
```
$("form").submit()
```
à l'intérieur de ce gestionnaire, car il en résulterait une boucle infinie (le MÊME gestionnaire d'être appelé, de prévenir la soumission, de valider, et de soumettre à nouveau). Vous devez être en mesure de soumettre manuellement un formulaire à l'intérieur d'un gestionnaire de soumission sans déclencher le même gestionnaire.

Je me rends compte ce n'est pas RÉPONDRE directement à la question, mais il ya beaucoup d'autres réponses sur cette page à propos de la façon dont cette fonctionnalité peut être piraté, et j'ai senti que ce qui doit être souligné (et c'est trop long pour un commentaire).

InformationsquelleAutor tandrewnichols
2

trigger('submit') ne fonctionne pas.car onSubmit méthode de ne pas me faire virer.
le code suivant fonctionne pour moi, l'appel de méthode onSubmit lors de l'utilisation de ce code :

$("form").find(':submit').click();

InformationsquelleAutor f.jafari
1

Essayer de déclencher() votre fonction:
```
$("form").trigger('submit'); //and then... do submit()
```
- Nope, aussi ne déclenche pas la soumettre.
- nice, j'ai appris quelque chose de nouveau aussi 🙂
- Vote vote 🙂 Oui, un peu utile et un peu ennuyeux.
- $("form").déclencheur("envoyer") est le même que $("form").submit(). Le second est juste un raccourci.
InformationsquelleAutor Sergei

Au lieu de

$("form").submit()

essayer cette

 $("<input type='submit' id='btn_tmpSubmit'/>").css('display','none').appendTo('form');
 $("#btn_tmpSubmit").click();

InformationsquelleAutor ashkufaraz

J'ai trouvé cette question serval ans.

récemment, j'ai essayé de "réécrire" la méthode d'envoi. ci-dessous mon code

window.onload= function (){
for(var i= 0;i<document.forms.length;i++){
    (function (p){
        var form= document.forms[i];
        var originFn= form.submit;
        form.submit=function (){
            //do something you like
            alert("submitting "+form.id+" using submit method !");
            originFn();
        }
        form.onsubmit= function (){
            alert("submitting "+form.id+" with onsubmit event !");
        }
    })(i);


}

}

<form method="get" action="" id="form1">
<input type="submit" value="提交form1" />
<input type="button" name="" id="" value="button模拟提交1" onclick="document.forms[0].submit();" /></form>

Il l'a fait dans IE,mais pas dans les autres navigateurs, pour la même raison que "cletus"

InformationsquelleAutor

0

La solution la plus simple pour contourner ce problème est de créer des "temporaire" input de type submit et déclencher cliquez sur:
```
var submitInput = $("<input type='submit' />");
$("#aspnetForm").append(submitInput);
submitInput.trigger("click");
```
InformationsquelleAutor Kai

Vous devez vous connecter pour publier un commentaire.