Vérification données par appel AJAX [Résolu]

richard_sraing · 23/03/2011, 13h49

Bonjour à tous,

Je souhaite réaliser la vérification des données saisies dans mon formulaire par appel à un fichier php (de manière à réaliser la vérification côté serveur). Pour ce faire, je dois utiliser un appel AJAX synchrone. Voici donc ce que j'ai pour l'instant.

Code Javascript :

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
function createConnection(){
	if (window.XMLHttpRequest)
	{// code for IE7+, Firefox, Chrome, Opera, Safari
		xmlhttp=new XMLHttpRequest();
	}
	else
	{// code for IE6, IE5
		xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
 
	return xmlhttp;
}
 
function verificationFormulaire(){
 
	var connection = createConnection();
 
	xmlhttp.onreadystatechange=function() {
		if (xmlhttp.readyState==4 && xmlhttp.status==200)
		{
			alert ('retour de fonction');
		}
	}
 
	connection.open ("POST", "http://www.malmundarium.be/inc/verification.php", false);
	var requete = "groupname="+document.getElementById("groupname").value;
	requete += "&grouppostal="+document.getElementById("grouppostal").value;
	requete += "&langue="+document.getElementById("langue").value;
	requete += "&participants="+document.getElementById("participants").value;
	requete += "&accompagnants="+document.getElementById("accompagnants").value;
	requete += "&datevisite="+document.getElementById("datevisite").value;
	requete += "&heurevisite="+document.getElementById("heurevisite").value;
	requete += "&respfirst="+document.getElementById("respfirst").value;
	requete += "&resplast="+document.getElementById("resplast").value;
	requete += "&respaddr="+document.getElementById("respaddr").value;
	requete += "&resptown="+document.getElementById("resptown").value;
	requete += "&resppostal="+document.getElementById("resppostal").value;
	requete += "&respphone="+document.getElementById("respphone").value;
	requete += "&respmail="+document.getElementById("respmail").value;
 
	connection.send(requete);
}

Au niveau de mon fichier formulaire, j'ai ceci :

Code HTML :

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

1
2
3
4
5
 
<form method="POST" name="reservationform" id="reservationform" action="./inc/reservation.php" >
<!-- tous les champs de mon formulaire -->
<input type="submit" name="" value="Envoyer" onClick="return verificationFormulaire();" id="" tabindex="23" />
</form>

Au niveau de mon fichier servant à la vérification des valeurs, j'ai ceci :

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
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
50
51
52
53
54
55
56
57
58
<?php
 
$groupname = (!empty ($_POST['groupname'])) ? strip_tags($_POST['groupname']) : null;
$groupaddr = (!empty ($_POST['groupaddr'])) ? strip_tags($_POST['groupaddr']) : null;
$grouppostal = (!empty ($_POST['grouppostal'])) ? strip_tags($_POST['grouppostal']) : null;
$langue = (!empty ($_POST['langue'])) ? strip_tags($_POST['langue']) : null;
$participants = (!empty ($_POST['participants'])) ? strip_tags($_POST['participants']) : 0;
$accompagnants = (!empty ($_POST['accompagnants'])) ? strip_tags($_POST['accompagnants']) : -1;
$mobred = (!empty ($_POST['mobred'])) ? strip_tags($_POST['mobred']) : 0;
$datevisite = (!empty ($_POST['datevisite'])) ? strip_tags($_POST['datevisite']) : null;
$heurevisite = (!empty ($_POST['heurevisite'])) ? strip_tags($_POST['heurevisite']) : null;
$guided = (!empty ($_POST['guidee'])) ? strip_tags($_POST['guidee']) : 0;
$carnaval = (!empty ($_POST['carnaval'])) ? strip_tags($_POST['carnaval']) : 0;
$papier = (!empty ($_POST['papier'])) ? strip_tags($_POST['papier']) : 0;
$tresor = (!empty ($_POST['tresor'])) ? strip_tags($_POST['tresor']) : 0;
$respfirst = (!empty ($_POST['respfirst'])) ? strip_tags($_POST['respfirst']) : null;
$resplast = (!empty ($_POST['resplast'])) ? strip_tags($_POST['resplast']) : null;
$respaddr = (!empty ($_POST['respaddr'])) ? strip_tags($_POST['respaddr']) : null;
$resppostal = (!empty ($_POST['resppostal'])) ? strip_tags($_POST['resppostal']) : null;
$resptown = (!empty ($_POST['resptown'])) ? strip_tags($_POST['resptown']) : null;
$respcountry = (!empty ($_POST['respcountry'])) ? strip_tags($_POST['respcountry']) : null;
$respphone = (!empty ($_POST['respphone'])) ? strip_tags($_POST['respphone']) : null;
$respmail = (!empty ($_POST['respmail'])) ? strip_tags($_POST['respmail']) : null;
$montant = 0;
 
// if ( !$groupname || !$grouppostal || !$langue || !$participants || !$accompagnants || !$datevisite || !$heurevisite || !$respfirst || !$resplast || !$respphone ){
	// echo 'false';
	// exit;
// }
$erreur = ";";
if( $groupname == null)
	$erreur .= 'groupname='.$groupname.';';
if( $grouppostal == null)
	$erreur .= 'grouppostal='.$grouppostal.';';
if( $langue == null)
	$erreur .= 'langue='.$langue.';';
if( $participants == 0)
	$erreur .= 'participants='.$participants.';';
if( $accompagnants == 0)
	$erreur .= 'accompagnants='.$accompagnants.';';
if( $datevisite == null)
	$erreur .= 'datevisite='.$datevisite.';';
if( $heurevisite == null)
	$erreur .= 'heurevisite='.$heurevisite.';';
if( $respfirst == null)
	$erreur .= 'respfirst='.$respfirst.';';
if( $resplast == null)
	$erreur .= 'resplast='.$resplast.';';
if( $respphone == null)
	$erreur .= 'respphone='.$respphone.';';
 
if( $erreur==";")
	echo 'true';
else
	echo $erreur;
exit;
 
?>

Au niveau du code ajax, je n'obtiens jamais le message d'alerte 'retour de fonction'.

Qu'est ce que j'ai oublié ? Que dois-je envoyer comme valeur de retour à partir de mon code php de vérification ?

Je suis dans le cake pour l'instant, et ne m'y retrouve plus, quelqu'un peut-il me donner une bougie pour éclairer ma lanterne ?

En vous remerciant pour l'aide que vous pourrez m'apporter, je vous souhaite de passer une bonne après midi.

Nesmontou · 23/03/2011, 22h36

Bonsoir,

Il me semble que le problème vient du fait que tu déclares la variable connection mais tu gères l'état de xmlhttp.

Il faudrait plutôt faire

Code :

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

1
2
3
4
5
6
connection.onreadystatechange=function() {
	if (connection.readyState==4 && connection.status==200)
	{
		alert ('retour de fonction');
	}
}

Bon développement

richard_sraing · 24/03/2011, 08h28

Oups, effectivement, j'ai oublier de mettre cette partie à jour, car l'air de rien, j'ai continuer à chercher une solution, et suis tombé la dessus :

Mon fichier "verification.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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<?php
 
$groupname = (!empty ($_POST['groupname'])) ? strip_tags($_POST['groupname']) : null;
$grouppostal = (!empty ($_POST['grouppostal'])) ? strip_tags($_POST['grouppostal']) : null;
$langue = (!empty ($_POST['langue'])) ? $_POST['langue'] : null;
$participants = (!empty ($_POST['participants'])) ? strip_tags($_POST['participants']) : 0;
$accompagnants = (!empty ($_POST['accompagnants'])) ? strip_tags($_POST['accompagnants']) : 0;
$datevisite = (!empty ($_POST['datevisite'])) ? strip_tags($_POST['datevisite']) : null;
$heurevisite = (!empty ($_POST['heurevisite'])) ? strip_tags($_POST['heurevisite']) : null;
$respfirst = (!empty ($_POST['respfirst'])) ? strip_tags($_POST['respfirst']) : null;
$resplast = (!empty ($_POST['resplast'])) ? strip_tags($_POST['resplast']) : null;
$respaddr = (!empty ($_POST['respaddr'])) ? strip_tags($_POST['respaddr']) : null;
$resppostal = (!empty ($_POST['resppostal'])) ? strip_tags($_POST['resppostal']) : null;
$resptown = (!empty ($_POST['resptown'])) ? strip_tags($_POST['resptown']) : null;
$respphone = (!empty ($_POST['respphone'])) ? strip_tags($_POST['respphone']) : null;
 
$erreur = ";";
if( $groupname == null)
	$erreur .= 'groupname='.$groupname.';';
if( $grouppostal == null)
	$erreur .= 'grouppostal='.$grouppostal.';';
if( $langue == null)
	$erreur .= 'langue='.$langue.';';
if( $participants == 0)
	$erreur .= 'participants='.$participants.';';
if( $accompagnants == 0)
	$erreur .= 'accompagnants='.$accompagnants.';';
if( $datevisite == null)
	$erreur .= 'datevisite='.$datevisite.';';
if( $heurevisite == null)
	$erreur .= 'heurevisite='.$heurevisite.';';
if( $respfirst == null)
	$erreur .= 'respfirst='.$respfirst.';';
if( $resplast == null)
	$erreur .= 'resplast='.$resplast.';';
if( $respphone == null)
	$erreur .= 'respphone='.$respphone.';';
 
if( $erreur === ";")
	echo 'true';
else
	echo $erreur;
 
exit;
?>

Mon fichier ajax.js contient ce qui suit :

Code JAVASCRIPT :

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
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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
function createConnection(){
	var xmlhttp = null; 
	if(window.XMLHttpRequest) // Firefox et autres
	   xmlhttp = new XMLHttpRequest(); 
	else if(window.ActiveXObject){ // Internet Explorer 
	   try {
				xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
			} catch (e) {
				xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
			}
	}
	else { // XMLHttpRequest non supporté par le navigateur 
	   alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest..."); 
	   xmlhttp = false; 
	} 
	return xmlhttp
}
 
function verificationFormulaire(){
 
	var connection = createConnection();
 
	connection.onreadystatechange=function() {
		if (connection.readyState==4 && connection.status==200)
		{
			alert ('valeur retournee : '+connection.response);
			if(connection.responseText != "true"){
				// checkmust(); // ne pas en tenir compte
				alert ('pas bon');
				return false;
			}
			else{
				connection.open("POST", "./inc/reservation.php", false);
				requete = "groupname="+document.getElementById("groupname").value;
				requete += "&grouppostal="+document.getElementById("grouppostal").value;
				requete += "&langue="+document.getElementById("langue").value;
				requete += "&participants="+document.getElementById("participants").value;
				requete += "&accompagnants="+document.getElementById("accompagnants").value;
				requete += "&mobred="+document.getElementById("mobred").value;
				requete += "&datevisite="+document.getElementById("datevisite").value;
				requete += "&heurevisite="+document.getElementById("heurevisite").value;
				requete += "&respfirst="+document.getElementById("respfirst").value;
				requete += "&resplast="+document.getElementById("resplast").value;
				requete += "&respaddr="+document.getElementById("respaddr").value;
				requete += "&resptown="+document.getElementById("resptown").value;
				requete += "&resppostal="+document.getElementById("resppostal").value;
				requete += "&respphone="+document.getElementById("respphone").value;
				requete += "&respmail="+document.getElementById("respmail").value;
				requete += "&guided="+document.getElementById("guided").value;
				requete += "&carnaval="+document.getElementById("carnaval").value;
				requete += "&papier="+document.getElementById("papier").value;
				requete += "&tresor="+document.getElementById("tresor").value;
				requete += "&montant=0";
				requete += "&confirme=0";
				connection.send(requete);
			}
		}
	};
 
	connection.open ("POST", "./inc/verification.php", false);
	var requete = "groupname="+document.getElementById("groupname").value;
	requete += "&grouppostal="+document.getElementById("grouppostal").value;
	requete += "&langue="+document.getElementById("langue").value;
	requete += "&participants="+document.getElementById("participants").value;
	requete += "&accompagnants="+document.getElementById("accompagnants").value;
	requete += "&datevisite="+document.getElementById("datevisite").value;
	requete += "&heurevisite="+document.getElementById("heurevisite").value;
	requete += "&respfirst="+document.getElementById("respfirst").value;
	requete += "&resplast="+document.getElementById("resplast").value;
	requete += "&respaddr="+document.getElementById("respaddr").value;
	requete += "&resptown="+document.getElementById("resptown").value;
	requete += "&resppostal="+document.getElementById("resppostal").value;
	requete += "&respphone="+document.getElementById("respphone").value;
 
	connection.send(requete);
}

Et voici, que avec l'outil Firebug, je récupère systématique la chaine suivante en retour :

Citation:

;groupname=;grouppostal=;langue=;participants=0;datevisite=;heurevisite=;respfirst=;resplast=;respphone=;

Ce qui me laisse penser que le fait d'envoyer les informations en POST dans mon XmlHttpRequest, je ne peut pas les récupérer avec la variable globale $_POST dans mon php (ce qui me semble tout de même très louche).

Quelqu'un aurait donc une idée de pourquoi je ne récupère pas les informations dans mon retour de mon script de vérification php ?

En vous remerciant pour l'information que vous pourrez me fournir.

nadox · 24/03/2011, 10h23

Bonjour,

En appel synchrone, on a pas besoin d'utiliser onreadystatechange.
La fonction send est bloquante tant que la réponse n'est pas revenue.
On peut donc faire ça :

Code javascript :

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
 
	connection.open ("POST", "http://www.malmundarium.be/inc/verification.php", false);
	var requete = "groupname="+document.getElementById("groupname").value;
	requete += "&grouppostal="+document.getElementById("grouppostal").value;
	requete += "&langue="+document.getElementById("langue").value;
	requete += "&participants="+document.getElementById("participants").value;
	requete += "&accompagnants="+document.getElementById("accompagnants").value;
	requete += "&datevisite="+document.getElementById("datevisite").value;
	requete += "&heurevisite="+document.getElementById("heurevisite").value;
	requete += "&respfirst="+document.getElementById("respfirst").value;
	requete += "&resplast="+document.getElementById("resplast").value;
	requete += "&respaddr="+document.getElementById("respaddr").value;
	requete += "&resptown="+document.getElementById("resptown").value;
	requete += "&resppostal="+document.getElementById("resppostal").value;
	requete += "&respphone="+document.getElementById("respphone").value;
	requete += "&respmail="+document.getElementById("respmail").value;
	connection.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); // on précise que le contenu de la requête est bien de type post/formulaire...
	connection.send(requete); // on envoie la requête synchrone
 var serverResponse = connection.responseText;
 alert(serverResponse); // ICI on a la réponse.

richard_sraing · 24/03/2011, 11h38

Ok, merci pour l'info, mais cela ne change malheureusement rien à mon problème que je n'arrive pas, à priori du moins, à lire les données transférées par le POST de mon XmlHttpRequest.

Des idées la dessus ??

nadox · 24/03/2011, 12h22

A quoi ressemble ton code javascript maintenant ?

richard_sraing · 24/03/2011, 13h00

Je ne poste que la partie faisant les appels par send et autres...

Code Javascript :

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
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
50
51
52
53
function verificationFormulaire(){
 
	var connection = createConnection();
 
	connection.open ("POST", "./inc/verification.php", false);
	var requete = "groupname="+document.getElementById("groupname").value;
	requete += "&grouppostal="+document.getElementById("grouppostal").value;
	requete += "&langue="+document.getElementById("langue").value;
	requete += "&participants="+document.getElementById("participants").value;
	requete += "&accompagnants="+document.getElementById("accompagnants").value;
	requete += "&datevisite="+document.getElementById("datevisite").value;
	requete += "&heurevisite="+document.getElementById("heurevisite").value;
	requete += "&respfirst="+document.getElementById("respfirst").value;
	requete += "&resplast="+document.getElementById("resplast").value;
	requete += "&respaddr="+document.getElementById("respaddr").value;
	requete += "&resptown="+document.getElementById("resptown").value;
	requete += "&resppostal="+document.getElementById("resppostal").value;
	requete += "&respphone="+document.getElementById("respphone").value;
 
	connection.send(requete);
 
	var reponserveur = connection.responseText;
	if(reponserveur != "true"){
		checkmust();
		alert ('pas bon');
		return false;
	}
	else{
		connection.open("POST", "./inc/reservation.php", false);
		requete = "groupname="+document.getElementById("groupname").value;
		requete += "&grouppostal="+document.getElementById("grouppostal").value;
		requete += "&langue="+document.getElementById("langue").value;
		requete += "&participants="+document.getElementById("participants").value;
		requete += "&accompagnants="+document.getElementById("accompagnants").value;
		requete += "&mobred="+document.getElementById("mobred").value;
		requete += "&datevisite="+document.getElementById("datevisite").value;
		requete += "&heurevisite="+document.getElementById("heurevisite").value;
		requete += "&respfirst="+document.getElementById("respfirst").value;
		requete += "&resplast="+document.getElementById("resplast").value;
		requete += "&respaddr="+document.getElementById("respaddr").value;
		requete += "&resptown="+document.getElementById("resptown").value;
		requete += "&resppostal="+document.getElementById("resppostal").value;
		requete += "&respphone="+document.getElementById("respphone").value;
		requete += "&respmail="+document.getElementById("respmail").value;
		requete += "&guided="+document.getElementById("guided").value;
		requete += "&carnaval="+document.getElementById("carnaval").value;
		requete += "&papier="+document.getElementById("papier").value;
		requete += "&tresor="+document.getElementById("tresor").value;
		requete += "&montant=0";
		requete += "&confirme=0";
		connection.send(requete);
	}
}

Eric2a · 24/03/2011, 13h07

Salut,

Ajoute la ligne (présente dans le code de nadox) faisant appel à la méthode setRequestHeader

Code :

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

1
2
connection.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); // on précise que le contenu de la requête est bien de type post/formulaire...
connection.send(requete); // on envoie la requête synchrone

pour voir.

nadox · 24/03/2011, 13h37

Oui Eric2a, c'est pour ça que je demandais le code à jour

richard_sraing · 24/03/2011, 14h59

Mais il semblerait que ça marche.

Je n'ai pas encore tout vérifier, mais j'ai entre aperçu une valeur true en retour, ....

Sauf que maintenant, on me demande une fois de plus de changer le formulaire..., donc je retourne dans le HTML / PHP.

Je vais toujours mettre le message en résolu, jusqu'au prochain soucis.

richard_sraing · 25/03/2011, 14h58

Voilà, je confirme que tout fonctionne correctement.

J'ai enfin fini de réaliser les vérifications de mes données.

Maintenant, il ne me reste qu'à vérifier l'ajout dans ma base de données, et tout sera bon.

24/03/2011, 11h38	#5
richard_sraing Membre habitué Raphaël Responsable de service informatique Inscription : avril 2005 Messages : 374 Détails du profil Informations personnelles : Nom : Raphaël Localisation : Belgique Informations professionnelles : Activité : Responsable de service informatique Secteur : Administration - Collectivité locale Informations forums : Inscription : avril 2005 Messages : 374 Points : 121 Points : 121	Ok, merci pour l'info, mais cela ne change malheureusement rien à mon problème que je n'arrive pas, à priori du moins, à lire les données transférées par le POST de mon XmlHttpRequest. Des idées la dessus ?? __________________ First step: F.A.Q. Second step: Forum -> Recherche Thrid step: Forum -> Poser une question Fourth step: Forum -> Attendre une réponse Fifth step: Forum -> Remercier les personnes ayant répondu et signaler comme résolu Simple non ? l'utilisation de developpez.com
	00

24/03/2011, 14h59	#10
richard_sraing Membre habitué Raphaël Responsable de service informatique Inscription : avril 2005 Messages : 374 Détails du profil Informations personnelles : Nom : Raphaël Localisation : Belgique Informations professionnelles : Activité : Responsable de service informatique Secteur : Administration - Collectivité locale Informations forums : Inscription : avril 2005 Messages : 374 Points : 121 Points : 121	Mais il semblerait que ça marche. Je n'ai pas encore tout vérifier, mais j'ai entre aperçu une valeur true en retour, .... Sauf que maintenant, on me demande une fois de plus de changer le formulaire..., donc je retourne dans le HTML / PHP. Je vais toujours mettre le message en résolu, jusqu'au prochain soucis. __________________ First step: F.A.Q. Second step: Forum -> Recherche Thrid step: Forum -> Poser une question Fourth step: Forum -> Attendre une réponse Fifth step: Forum -> Remercier les personnes ayant répondu et signaler comme résolu Simple non ? l'utilisation de developpez.com
	00

25/03/2011, 14h58	#11
richard_sraing Membre habitué Raphaël Responsable de service informatique Inscription : avril 2005 Messages : 374 Détails du profil Informations personnelles : Nom : Raphaël Localisation : Belgique Informations professionnelles : Activité : Responsable de service informatique Secteur : Administration - Collectivité locale Informations forums : Inscription : avril 2005 Messages : 374 Points : 121 Points : 121	Voilà, je confirme que tout fonctionne correctement. J'ai enfin fini de réaliser les vérifications de mes données. Maintenant, il ne me reste qu'à vérifier l'ajout dans ma base de données, et tout sera bon. __________________ First step: F.A.Q. Second step: Forum -> Recherche Thrid step: Forum -> Poser une question Fourth step: Forum -> Attendre une réponse Fifth step: Forum -> Remercier les personnes ayant répondu et signaler comme résolu Simple non ? l'utilisation de developpez.com
	00

24/03/2011, 12h22	#6
nadox Membre expérimenté Développeur Inscription : février 2010 Messages : 360 Détails du profil Informations personnelles : Sexe : Localisation : France, Calvados (Basse Normandie) Informations professionnelles : Activité : Développeur Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : février 2010 Messages : 360 Points : 545 Points : 545	A quoi ressemble ton code javascript maintenant ?
	00

24/03/2011, 13h37	#9
nadox Membre expérimenté Développeur Inscription : février 2010 Messages : 360 Détails du profil Informations personnelles : Sexe : Localisation : France, Calvados (Basse Normandie) Informations professionnelles : Activité : Développeur Secteur : High Tech - Multimédia et Internet Informations forums : Inscription : février 2010 Messages : 360 Points : 545 Points : 545	Oui Eric2a, c'est pour ça que je demandais le code à jour
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email