2012-04-27 1 views
15

Ho la seguente jQuery Plugin di convalida:jQuery convalida plug-mail più indirizzi

<script type="text/javascript" src="/requires/js/jquery.min.js"></script> 
<script type="text/javascript" src="/requires/js/jquery.validate.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#form").validate({ 
      rules: { 
       name: { 
        required: true, 
        minlength: 2 
       }, 
       email: { 
        required: true, 
        email: true 
       }, 
       emails: { 
        required: true, 
        email: true 
       } 
      }, 
      messages: { 
       name: { 
        required: "Je bent vergeten om je naam in te vullen.", 
        minlength: "Je bent vergeten om je naam in te vullen." 
       }, 
       email: { 
        required: "Je bent vergeten om je emailadres in te vullen.", 
        email: "Het opgegeven emailadres is niet geldig." 
       }, 
       emails: { 
        required: "Je bent vergeten om het emailadres van je vriend(in) in te vullen.", 
        email: "Je moet een geldig e-mailadres van je vriend(in) invullen." 
       } 
      } 
     }); 
    }); 
</script> 

<form id="form" method="post"> 
Jouw naam: <input type="text" name="name"><br /> 
Jouw e-mailadres: <input type="text" name="email"><br /> 
Het e-mailadres van je vriend(in): <input type="text" name="emails"><br /> 
<input type="submit" value="Verstuur"> 
</form> 

dai email valore persone deve può dare più emailaddresses come [email protected]m; [email protected] o il test @ test. com, test @ test2.com

Quando si esegue questa operazione, il plug-in di convalida restituisce l'errore: Je moet een geldig e-mailadres van je vriend (in) invullen.

Come posso risolvere questo problema?

risposta

42

Ecco una funzione su misura aggiunto con l'aiuto del addMethod:

jQuery.validator.addMethod(
    "multiemail", 
    function(value, element) { 
     if (this.optional(element)) // return true on optional element 
      return true; 
     var emails = value.split(/[;,]+/); // split element by , and ; 
     valid = true; 
     for (var i in emails) { 
      value = emails[i]; 
      valid = valid && 
        jQuery.validator.methods.email.call(this, $.trim(value), element); 
     } 
     return valid; 
    }, 

    jQuery.validator.messages.email 
); 

Ecco un jsFiddle che vi mostra come utilizzare il metodo personalizzato multiemail:

http://jsfiddle.net/leniel/xFphm/7/

+0

Grazie, ma dove posso metterlo in '$ (" # form "). Validate ({});'? – Arthur

+1

Includi questo JavaScript nella tua pagina, quindi dove hai emails: { required: true,email: true }, cambialo in emails: { required: true,multiemail: true }. –

+0

Grazie ragazzi !, ma quando il campo email è vuoto vedrei ad esempio: campo vuoto, e quando il campo non è corretto questo emailadres non è valido. Ora vedo solo un errore quando il campo non è corretto ... – Arthur

0

funzione Una soluzione su misura con messaggio interno

<script>  
jQuery.validator.addMethod("custom_method_one", function (value, element) { 
    if (this.optional(element)) { 
    return true; 
    } 

    var emails = value.split(','), 
    valid = true; 

    for (var i = 0, limit = emails.length; i < limit; i++) { 
    value = emails[i]; 
    valid = valid && jQuery.validator.methods.email.call(this, value, element); 
    } 

    return valid; 
    }, "Invalid email format: please use a comma to separate multiple email addresses."); 

$('#form').validate({ 
"emails": { required:true,custom_method_one: true } 
}) 
</script> 

<form method="post" id="form" name="form" action=""> 
<input type="text" name="emails" id="emails" placeholder="(eg:[email protected],[email protected],....)"/> 

</form>