jQuery: l’évenement « submit » n’est pas capturé

  • jquery submit
jQuery: l’évenement « submit » n’est pas capturé

Travaillant actuellement sur un projet mettant en œuvre du jQuery, je suis tombé sur un problème qui m’a fait perdre du temps lors de la mise en prod. En effet ce problème ne se posait pas lors des tests en développement mais apparaissait sur le serveur de production (je ne sais pas pourquoi d’ailleurs).

Le problème se trouvait sur un formulaire simple de login que je gère en ajax. Sur ce formulaire, je pose un handler sur l’évenement submit de la form pour traiter le post en arrière plan et ainsi ne pas faire recharger la page si je dois afficher un message d’erreur (classique).
Seulement ici rien ne se passait du coté javascript et le formulaire était donc envoyé de façon normal.

Et la raison est très simple: il ne faut pas nommer son input[type=submit] en « submit ».

En clair: le code faux:

<form id="myform" action="connexion.html" method="post">
<input type="text" name="login" />
<input type="password" name="pwd" />
<input type="submit" name="submit" value="Connexion" />
</form>

Et le code qui fonctionnera:

<form id="myform" action="connexion.html" method="post">
<input type="text" name="login" />
<input type="password" name="pwd" />
<input type="submit" name="peu_importe_mais_pas_submit" value="Connexion" />
</form>

En complément, le code jQuery:

$('#myform').submit(function() {
$.post($('#myform').attr('action'), $("#myform").serialize(),function(data){
var response = jQuery.parseJSON(data);
//traiter la reponse
});
return false;
});

En espérant que cela pourra aider quelqu’un…

Voir aussi:
La documentation officielle de jQuery qui m’a mis sur la voie.

  • Batysta 16 janvier 2011 à 18 h 36 min Répondre

    Ca aura en effet aidé quelqu’un !

  • Roy 1 juin 2013 à 3 h 35 min Répondre

    Salut,
    J’ai eu le même soucis avec ajax egalement pour l’envoi de formulaire, après avoir verifier si le pseudo/mail existait déjà dans la bdd:

    $(‘#form_register’).removeAttr(‘onsubmit’)
    $(‘#form_register’).submit();
    Le « onsubmit » était bien retirer, mais le formulaire n était pas envoyé au 1ere envoi, mais au 2eme(2eme click de l utilisateur).

    Merci pour l’info

  • Flapy 27 août 2013 à 14 h 12 min Répondre

    Merci ça faisait des heures que j’essayais de comprendre pourquoi mon submit() ne fonctionnait pas !!!
    Notez que chez moi le problème n’était pas le name= »submit » mais id= »submit »

Laissez un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Vous pouvez utiliser ces balises et attributs HTML : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>