[AJAX] Récupérer variable php en ajax

**hannibal974** · 10/06/2013, 14h11

Bonjour, voilà je vous explique mon problème. J'ai créé un code en jscript depuis lequel j'appel un fichier php. Dans cette fonction je voudrais récupérer la variable $trouve de mon code php pour pouvoir la tester par la suite mais je ne vois pas comment faire. Cette fonction est appelé lors du onsubmit de mon formulaire et elle doit donc renvoyer true ou false.
Je vous montre mon code ainsi que mon fichier php

Code jscript :

Code jscript :

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
 
<script>
// test vérif bdd
function createRequestObject()
{
    var http;
    if(window.XMLHttpRequest)
        http = new XMLHttpRequest();
    else if(window.ActiveXObject)
        http = new activeXObject("Microsoft.XMLHTTP");
    return http;
}
var http;
function gestionSubmit()
{
    http = createRequestObject();
    http.open('POST', 'Config/PHP/Validator2.php?id=depart', true);
    http.onreadystatechange = handleAJAXreturn;
    http.send($('#depart').val());
}
function handleAJAXreturn()
{
    if(http.readyState == 4 && http.status == 200)
    {
            if(http.responseText =='false' && $('#depart').val() != '')
            {
                alert("Veuillez saisir un nom de département valide");
                return false;
            }
            else return true;
    }
}
</script>

code 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
 
<?php
try
{
    $bdd = new PDO('mysql:host=localhost;dbname=orange2', 'root', '');
}
catch(Exception $e)
{
    die('Erreur : '.$e->getMessage());
}
 
$term=$_POST['term'];
$req=$bdd->prepare('SELECT DISTINCT NomDept FROM test WHERE NomDept= :term');
$req->execute(array('term' => $term));
$donnees = $req->fetch();
if(COUNT($donnees['NomDept'])>0)
    return $trouve=true;
else return $trouve=false;
    $req->closeCursor();

appel de ma fonction :

Code html :

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

1
2
3
4
 
 
<form method="post" id="formdept" action="Bilan.php?dept=1" onsubmit="gestionSubmit();return false;">
<input class="colorange" type="submit" value="Envoyer" onSubmit="gestionSubmit()" />

**andry.aime** · 10/06/2013, 14h20

Bonjour,

1-

Code :

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

 http.send($('#depart').val());

La syntaxe correcte pour envoyer des valeurs avec une méthode post est

Code :

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

http.send("nomvar=valeur&nomvar2=valeur2");

.
2- Pour envoyer le résultat du php vers javascript, tu dois faire un echo mais pas return.
3- Tu utilise jQuery, rien que pour récupérer une valeur d'un élément

, pourquoi ne pas l'utiliser aussi pour la requête Ajax

A+.

**hannibal974** · 10/06/2013, 14h37

J'ai modifié la ligne dont tu me parles par :

Code :

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

http.send("term=$('#depart'.val()");

J'ai aussi remplacé les return par des echo dans mon fichier php. Par contre je ne vois pas trop comment récupérer ma variable php dans mon jscript

**andry.aime** · 10/06/2013, 14h47

Code :

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

http.send("term="+$('#depart').val());

Pourquoi ne pas utiliser jQuery pour la requête AJAX?

**hannibal974** · 10/06/2013, 15h00

Je ne vois pas comment faire cela

**andry.aime** · 10/06/2013, 15h15

http://api.jquery.com/category/ajax/.

**hannibal974** · 10/06/2013, 15h19

j'ai essayé d'utiliser jQuery.post mais j'ai pas réussi à m'en servir comme il le faut

**andry.aime** · 11/06/2013, 16h29

Tu nous montres ton code actuel?
Tu dois aussi controler si t'as une erreur dans la requête (status !=200 et 0).

A+.

**hannibal974** · 11/06/2013, 16h36

Voilà mon script :

Code :

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
<script>
function valider()
	{
	var str = document.forms["formdept"].elements["depart"].value;
	str = str.replace(/[^a-z]/gi, '');
	var xhr = null;
	if(window.XMLHttpRequest)
		xhr = new XMLHttpRequest ();
	else if (window.ActiveXObject("Microsoft.XMLHTTP")
		xhr = new ActiveXObject("Microsoft.XMLHTTP");
	else 
	{	
		alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
		return;
	}
	var filename = "Config/PHP/Validator.php";
	var s1 = str;
	var data = null;
	if(s1 != "")
		data = "s1="+str+"&id=depart";
	xhr.open("POST", filename,true);
	xhr.onreadystatechange = function() {
		if(xhr.readyState == 4 && (xhr.status == 200|| xhr.status == 0))
		{
			var tmp = xhr.responseText;
			if(typeof(tmp) != "undefined")
				alert("tmp");
		}
	}
	xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	xhr.send(data);
		if(tmp == ""|| tmp == "false")
			alert("nom inexistant");
		if(str != '')
			return true;
		else
		{
			alert("champ vide");
			return false;
		}
	}
	</script>

Et là mon code 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
<?php
 
try 
{
	$bdd = new PDO('mysql:host=localhost;dbname=orange2', 'root', '');
}
catch(Exception $e)
{
	die('Erreur : '.$e->getMessage());
}
 
echo var_dump($_POST);
 
	if(isset($_POST['data']))
	{
	$data=$_POST['data'];
	$req=$bdd->prepare('SELECT DISTINCT NomDept FROM test WHERE NomDept= :data');
	$req->execute(array('data' => $data));
	$donnees = $req->fetch();
	if(COUNT($donnees['NomDept'])>0)
		echo 'true';
	else echo 'false';
	$req->closeCursor();
	}
	else echo 'pas de data';

**andry.aime** · 11/06/2013, 16h43

if(tmp == ""|| tmp == "false")
alert("nom inexistant");
if(str != '')
return true;
else
{
alert("champ vide");
return false;
}

cela ne sert à rien car tu travailles en mode asynchrone.
Dans le "xhr.onreadystatechange = function()", tu dois aussi tester si le status n'est pas à 200 ou 0 pour afficher l'erreur.

Code :

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

xhr.send(data);

Assure que data n'est pas null en arrivant à cette instruction pour tester.

A+.

**hannibal974** · 12/06/2013, 09h42

Effectivement en mettant la condition, je retrouve bien true/false en affichant directement ma page php. Maintenant je souhaiterais savoir comment et quand récupérer ce true/false dans mon script pour pouvoir tester cette valeur et envoyer ou non mon formulaire ?

**andry.aime** · 12/06/2013, 11h54

Tu le récupère au moment ou tu l'affiches dans la page, et c'est là aussi que tu envoies ou non ton formulaire.

**hannibal974** · 12/06/2013, 13h01

D'accord. Voilà le code que j'ai essayé d'implémenté mais sans résultat escompté. Je sais que ma varible est bien récupéré dans mon fichier php mais je n'arrives pas à faire le retour.

Code jscript :

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
function valider()
    {
    var str = document.forms["formdept"].elements["depart"].value;
    str = str.replace(/[^a-z]/gi, '');
    if( str === '')
        alert("champ vide");
    var xhr = null;
    if(window.XMLHttpRequest)
        xhr = new XMLHttpRequest ();
    else if (window.ActiveXObject("Microsoft.XMLHTTP"))
        xhr = new ActiveXObject("Microsoft.XMLHTTP");
    else
    {  
        alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
        return;
    }
    var filename = "Config/PHP/Validator.php?id=depart";
    var s1 = str;
    var data = null;
    if(s1 != "")
        data = "s1="+str+"&amp;id=depart";
    xhr.open("POST", filename,true);
    xhr.onreadystatechange = function() {
        if(xhr.readyState == 4 && (xhr.status == 200|| xhr.status == 0))
        {
        if(xhr.responseText == 'true')
            return true;
        else
        {
            alert("Champ non posté");
return false;
        }
            var tmp = xhr.responseText;
            if(typeof(tmp) != "undefined")
                alert("tmp");
        }
        xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        if(data != null)
            xhr.send(data);
        else alert ("data null");
    }
 
}

Et voici l'appel à ma fonction depuis de mon formulaire et le bouton submit :

Code :

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

1
2
3
<form method="post" id="formdept" action="Bilan.php?dept=1" onsubmit="return valider()">
 
<input class="colorange" type="submit" value="Envoyer" onsubmit="valider()"/>

**andry.aime** · 12/06/2013, 13h07

Si tu veux faire un return dans une fonction AJAX, tu dois travailler en mode synchrone. Fait une recherche sur ce forum, tu tomberas sur pas mal de discussions résolues.

A+.

**hannibal974** · 12/06/2013, 13h31

J'ai modifié

Code :

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

xhr.open("POST", filename,true);

par

Code :

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

xhr.open("POST", filename,false);

pour le passer en mode synchorne mais toujours le même résultat

**andry.aime** · 12/06/2013, 13h44

En gros:

Code :

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

1
2
3
4
5
6
xrh=getXhr();
xhr.open("post", "url.php",false);
xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xhr.send(data);
if (xhr.response.Text=="true") {return true}
else {return false;}

A+.

**hannibal974** · 12/06/2013, 13h56

Voici le code que j'ai essayé. Peux-tu me dire ou sont les erreurs ?

Code :

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
function valider()
	{
	var str = document.forms["formdept"].elements["depart"].value;
	str = str.replace(/[^a-z]/gi, '');
	if( str === '')
		alert("champ vide");
	var xhr = getXhr();;
	var filename = "Config/PHP/Validator.php?id=depart";
	// var s1 = str;
	var data = null;
	// if(s1 != "")
		// data = "s1="+str+"&amp;id=depart";
	xhr.open("POST", filename,false);
	xhr.onreadystatechange = function() {
		if(xhr.readyState == 4 && (xhr.status == 200|| xhr.status == 0))
		{
		xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
		if(data != null)
			xhr.send(data);
		else alert ("data null");
		if(xhr.response.Text == "true")
			return true;
		else
		{ 
			alert("Champ non posté");
			return false;
		}
		}
 
	}
 
	}

**andry.aime** · 12/06/2013, 14h04

J'ai utilisé un onreadystatechange dans mon exemple?
un xhr.send et xhr.setRequestHeader dans un onreadystatechange

.

Je te conseille de voir cet article.

A+.

**hannibal974** · 12/06/2013, 14h14

Voilà le code que j'ai à présent. Je sens qu'on touche au but car maintenant il n'envoi plus du tout le formulaire.

Code :

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
<script type="text/javascript">
// test vérif bdd
function valider()
{
	var str = document.forms["formdept"].elements["depart"].value;
	str = str.replace(/[^a-z]/gi, '');
	if( str === '')
		alert("champ vide");
	if(window.XMLHttpRequest)
		xhr = new XMLHttpRequest ();
	else if (window.ActiveXObject("Microsoft.XMLHTTP"))
		xhr = new ActiveXObject("Microsoft.XMLHTTP");
	else 
	{	
		alert("Votre navigateur ne supporte pas les objets XMLHTTPRequest...");
		return;
	}
	var filename = "Config/PHP/Validator.php?id=depart";
	var s1 = str;
	var data = null;
	if(s1 != "")
		data = "s1="+str+"&amp;id=depart";
	xhr.open("POST", filename,false);
	xhr.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
	xhr.send(data);
	if(xhr.responseText == "true")
		{return true;}
	else
	{ 
		alert("Veuillez saisir un nom de DEPARTEMENT valide !");
		return false;
	}
}
</script>

**andry.aime** · 12/06/2013, 14h18

Vérifie les variables que tu postes depuis js et ce que tu tentes de récupérer du côté php.

[AJAX] Récupérer variable php en ajax

AJAX

Discussions similaires

Partager

Partager