Discussion :

[amdawb]

Bonjour,

Dans ma page d'acceuil index.php, j'ai un mini formulaire pour s'inscrire à la newsletter avec un seul champ pour saisir son email.

Si cet email est validé par ajax.php, l'utilisateur est renvoyé vers une page newslettersignup.php pour compléter ses données et choisir ses options.

Au submit, si ajax.php ne valide pas l'email saisi, une petite div lui affiche ses erreurs: champ vide, email erroné ou email déjà enregistré dans la bdd.
Je n'arrive pas à faire afficher les erreurs dans la div #error_email, et au submit, le post() du jQuery me redirige vers ajax.php (qui lui, m'affiche les erreurs).

Je débute en ajax et aimerais bien qu'on me donne un coup de pouce. Merci

index.php:

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
<form id="frm_nl" action="ajax.php" method="post">
	<input id="email" name="email" type="text" placeholder="Votre adresse e-mail">
	<input id="submit" name="submit" type="submit" value="OK">
</form>
<div id="error_email"></div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
$(document).ready(function () {
	$("#submit").click(function(){ 
		$.post(
			"ajax.php",
			{email:$('#email').val()},
			function(data){
				$('#error_email').val(data);
			}
		);
	});
});

ajax.php:

Code php :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?php
if(isset($_POST['submit'])){             
	$email=$_POST['email'];
	$_SESSION['email'] = $email;
	require("config-db-newsletter.php");
	mysql_connect($adresse,$nom,$motdepasse);
	mysql_select_db($database); 
	$sql = "SELECT * FROM email_table WHERE email = '".$email."' ";
	$query = mysql_query($sql) or die(mysql_error());
	$row = mysql_num_rows($query);
	if(empty($email)){
		echo "Veuillez renseigner une adresse mail";
	}else if(! filter_var($email,FILTER_VALIDATE_EMAIL))  {
		echo "E-mail non valide. Veuillez recommencer";
	}else if($row>0){
		echo "Adresse mail déjà enregistrée";
	}else{
		header('Location:newslettersignup.php '); 
	}
}		
?>

[Darkaurora]

En fait ici tu essaye d'effectuer une requête ajax alors que tu es déjà en train de soumettre ton formulaire au serveur.

je te conseil de faire ceci:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
$(document).ready(function () {
	$("#submit").submit(function(){ 
		$.post(
			"ajax.php",
			{email:$('#email').val()},
			function(data){
				$('#error_email').val(data);
			}
		);
               return false; // empêche la soumission native du formulaire.
	});
});

[amdawb]

Salut Darkaurora,
Merci de me signaler le return false.
À part que ça empêche la soumission du formulaire, la requête ne s'effectue plus pour espérer un retour du serveur.
N'empêche, j'ai trouvé la solution que je posterais de suite.
Merci

[Golgotha]

Bonsoir,

Le patern pour votre besoin est du type :

Code js :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
  Bouton.click(
 
 
      $.post(
        //...
       )
      .done(function(data){
        if (data.valide)
          // submit form
        else
          // affiche erreur
      });
 
 
    );

[Darkaurora]

Si tu souhaites soumettre le formulaire pourquoi faire de l'AJAX ? De plus je t'ai mis sur la piste mais je ne t'ai pas dis que ça aller fonctionner En fait tu effectues tes tests dans le ajax.php uniquement si une variable $_POST['submit'] est reçus, au niveau de ta requête ajax tu passes une variable email mais pas une variable submit.

Maintenant si tu souhaites soumettre ton formulaire par la suite, je suis désolé de te dire que ça ne rime à rien de mon point de vue

[ABCIWEB]

@Darkaurora Il souhaite transmettre le formulaire uniquement après avoir vérifier la validité du mail, d'où la requête ajax.

Mais c'est vrai que d'un autre côté, un pirate pourrait néanmoins envoyer le formulaire avec un mail non vérifié par cette requête. Il faudra donc systématiquement revérifier cette adresse à réception du formulaire. Et donc effectivement on peut douter de l'utilité de cette requête ajax.