jquery validation de mail
Bonjour,
J'aurais aimé savoir si quelqu'un aurait des piste pour une validation de mail en jquery ???
J'aimerais faire ceci :
lorsque la personne saisie son mail :
- validation du mail à la saisie sur le fait de savoir si c'est bien un mail
- en parallèle est-il possible de faire une validation instantannée pour voir si le mail existe bien dans la base de données ???
J'ai fais ceci mais j'ai du mal :
mon form
Code:
1 2 3 4 5 6 7 8
|
<input type="text" name="email" id="email" value="Votre adresse mail" />
<label for="email">
<span class="red">*</span> Saisissez votre adresse @-mail.<br />
<span id="result" name="result"></span>
</label>
<input class="submit" type="submit" name="submit_first" id="submit_first" value="" /> |
mon fichier requete2.php:
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23
|
$email = mysql_real_escape_string($_POST['email']);
$query = "SELECT * FROM utilisateurs WHERE email_utilisateurs ='".$email."'";
$result = mysql_query($query);
$utilisateurs = mysql_fetch_array($result);
$num_rows = mysql_num_rows($result);
if(filter_var($email, FILTER_VALIDATE_EMAIL)){
if($num_rows !=0){
echo '<input class="red" type=text value="email non disponible"/>';
}else{
echo '<input class="green" type=text value="mail disponible"/>';
}
}else{
if($email == 'Votre adresse mail'){
echo '<input class="red" type=text value="Veuillez saisir un mail"/>';
}else{
echo '<input class="red" type=text value="emal invalide"/>';
}
} |
et mon fichier jquery.main.js
Code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49
|
$('#submit_first').click(function(){
//remove classes
$('#first_step input').removeClass('error').removeClass('valid');
//ckeck if inputs aren't empty
var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
var fields = $('#first_step input[type=text], #first_step input[type=password]');
var error = 0;
$.post("requete2.php", { email: $("#email").val() },
function(data) {
$("#result").html(data);
});
fields.each(function(){
var value = $(this).val();
if(value.length<4 || value==field_values[$(this).attr('id')] || ( $(this).attr('id')=='email' && !emailPattern.test(value) ) || $('#email').val() != $('#email2').val()){
$(this).addClass('error');
$(this).effect("shake", { times:3 }, 50);
error++;
} else {
$(this).addClass('valid');
}
});
if(!error) {
if( $('#newPass').val() != $('#newPass2').val() ) {
$('#first_step input[type=password]').each(function(){
$(this).removeClass('valid').addClass('error');
$(this).effect("shake", { times:3 }, 50);
});
return false;
} else {
//update progress bar
$('#progress_text').html('33% Complete');
$('#progress').css('width','113px');
//slide steps
$('#first_step').slideUp();
$('#second_step').slideDown();
}
} else return false;
}); |
j'arrive à valider tout ce don't j'ai besoin, j'arrive à afficher ce que je veux mon span result (email valide, invalide, disponible....) mais lorsque tout mes champs sont remplis j'ai toujours email non-disponible(déjà utilisé)et mon form est quand même validé et je passe à l'étape suivante...
J'ai voulu faire ceci:
Code:
1 2 3 4 5 6 7 8 9 10
|
if($('#result').val() == 'email non disponible'){
$(this).addClass('error');
$(this).effect("shake", { times:3 }, 50);
error++;
}else{
$(this).addClass('valid');
} |
le souci est que je n'arrive pas à le mettre au bon endroit...
merci pour votre aide
récupération valeur de champs <span>
j'aimerais faire ceci :
Code:
1 2
|
$("span:#result").val() == "email non disponible" |
ou un truc du genre.
En gros récupérer ma valeur du span, ou se trouve dedans (email non disponible ou mail disponible ou mail invalide...)
mais je pense mal faire avec ce span...
merci pour votre aide