Déterminez quel élément a envoyé un formulaire depuis l'intérieur de la sous-unité

Question

Existe-t-il un moyen de déterminer quel élément a soumis un formulaire à l'intérieur d'un gestionnaire de sous-diffusion? Essayer d'écrire un gestionnaire générique qui sait quel élément a été cliqué. Par exemple, étant donné cette forme:

<form onsubmit="onSubmitHandler"> 
    <input type="submit" name="submit1" /> 
    <input type="submit" name="submit2" /> 
</form> 

Comment puis-je déterminer à l'intérieur du onSubmitHandler quel bouton soumettre a été cliquée? J'ai essayé event.target/event.srcElement, mais cela donne le formulaire, pas le bouton de soumission réel.

Mise à jour: J'écris un contrôle générique ici, donc il n'a aucune idée de ce qu'il y a sur le formulaire. La solution doit fonctionner sans connaître et modifier le code HTML du formulaire. Mon fallback est de marcher sur le DOM pour trouver tous les boutons qui pourraient causer une soumission, mais je voudrais éviter cela.

Answer 1

Une autre solution serait de déplacer le déclencheur d'événement de l'événement présenter de la forme, à l'événement onclick de l'élément présenter, en tant que tel:

<form name='form1'> 
    <input type="submit" name="submit1" onclick="onSubmitHandler"/> 
    <input type="submit" name="submit2" onclick="onSubmitHandler"/> 
</form> 

Dans votre fonction de gestionnaire, vous pouvez déterminer l'élément de soumission par simple inspecter le nom de la cible de l'événement, et si vous avez besoin d'accéder aux informations du formulaire ou à d'autres éléments, vous pouvez l'obtenir à partir de l'attribut "formulaire" des éléments de soumission.

Answer 2

Je n'utiliserais pas un type de bouton d'envoi standard.

Faire la fonction Envoyer prennent un argument supplémentaire qui représente l'élément qui l'a soumis, et le bouton aurait un onclick qui envoie this comme paramètre:

<input type="button" onclick="submitHandler(this)"> 

Answer 3

Mon fallback est la marche du DOM trouver tous les boutons qui pourraient causer un soumettre, mais je voudrais éviter cela.

... et d'y ajouter des écouteurs pour stocker le bouton 'dernier clic' qui est ensuite lu par l'écouteur de soumission, non?

Je ne peux pas penser autrement, désolé.

Answer 4

Cette solution fonctionne dans Firefox. Je ne l'ai pas vérifié dans d'autres navigateurs compatibles ou IE.
Je ne suis pas trop optimiste pour IE, vous auriez à le regarder et poster vos résultats.

<form id="myForm"> 
    <input type="submit"> 
    <input type="submit"> 
</form> 

_

document.getElementById('myForm').addEventListener('submit', function(e){ 
    e.preventDefault(); 
    e.explicitOriginalTarget.style.background = 'red'; 
}, false); 

Answer 5

Cliquez sur la bulle d'événements, de sorte que vous pouvez simplement ajouter un « onclick » auditeur à la forme elle-même, qui vérifie si la source cible de clic est un bouton d'envoi; Si c'est le cas, stockez une référence à cet endroit quelque part associé au formulaire auquel vous pouvez accéder à partir de votre gestionnaire d'onsubmit. Si vous souhaitez gérer correctement les formulaires "Enter", écoutez l'événement "onkeypress" ou "onkeydown" du formulaire, vérifiez "Enter" et effacez les informations de votre bouton submit si l'événement cible ISN ' T un bouton de soumission.