JQuery validation élément unique ne respectant pas les règles

Question

Je ne peux pas craquer celui-ci - J'ai un formulaire simple avec une zone de texte et un bouton (ne pas soumettre). Je veux que les utilisateurs entrent une adresse e-mail et quand ils appuient sur le bouton, il sera ajouté à une liste d'adresses affichées sur une page. J'ai seulement besoin de valider l'entrée de l'utilisateur pour voir si c'est une adresse e-mail valide.

HTML:

<form id="inviteFriendsForm"> 
    Email address: <input type="text" id="cemail" name="someEmail" value="" /> 
    <input type="button" id="addEmail" value="Add email" /> 
</form> 

jQuery:

$("#addEmail").click(function() { 
    var isValid = $("#inviteFriendsForm").validate({ 
     rules: { cemail: { required: true, email: true } } 
    }).element("#cemail"); 

    if(isValid) { 
     alert($("#cemail").val()); 
    } 
    else { 
     alert('Wrong email'); 
    } 
}); 

Le problème que j'ai est cette variable isValid est toujours vrai. S'il vous plaît noter que les alertes sont là pas parce que je l'utiliser pour indiquer une erreur à l'utilisateur, le code sage, je dois juste savoir si je devrais continuer à traiter l'entrée de l'utilisateur ou non.

Juste pour un enregistrement, je suis en utilisant jQuery Validation Plugin 1.8.0

Merci beaucoup,

Antonin

Answer 1

1. Faire le bouton un bouton Envoyer.
2. Utilisez la propriété submitHandler de validate pour modifier ce qui se passe lorsque le formulaire est validé.
3. Laissez l'affichage des erreurs de validation faire l'affaire. Si vous avez besoin d'une alerte au lieu d'une étiquette d'erreur, vous pouvez modifier la façon dont l'erreur s'affiche (consultez la documentation).