Lecture d'un objet JSON

Version imprimable

Hello !

je souhaite lire le résultat d'une requête sql dans un fichier js. Pour cela, j'ai utiliser le fameux $.ajax ... et json_encode. J'arrive à récupérer ma variable, mais c'est au moment de la parcourir que ce pose un problème.
Je ne pense pas que vous ayez besoin du code php, par contre voici le code de mon 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 $.ajax( { // Paramètres de la requête ajax url:'../controllers/config.php', type: 'GET', datatype: 'json', async: 'false', // Pour envoyer une variable vers le php data:{reloadPage: 1}, }) // Récupère la variable "document_commun" .done(function(document_commun) { console.log(document_commun); /*for(key in document_commun) { console.log(document_commun[key]); }*/ $.each(document_commun, function(index, valeur) { console.log(valeur); }); console.log("success"); }); /* la suite est inutile */
Lorsque j'essaye de lire ma variable "document_commun" avec une boucle for, j'obtiens chaque lettre et non chaque mot. Malheureusement, avec $.each, je récupère l'erreur suivante :

Citation:

Uncaught TypeError: Cannot use 'in' operator to search for '49' in ["document_mutuelle","document_rentree"]

J'ai lu pas mal de post sur ce sujet, mais comme je ne m'y connais pas trop en ajax, je n'ai pas réussi à m'en sortir.
Vos commentaires/remarques sont les bienvenues ;)

05/02/2014, 17h14
SpaceFrog

que donne un console.log(document_commun) sur le retour d'ajax ?
05/02/2014, 18h23
steackfrite

la console renvoie : ["document_mutuelle","document_rentree"]
Ce sont les deux seules noms qui sont dans ma BDD.
05/02/2014, 19h39
thunder75

Je pense que le résultat renvoyé devrait être de la forme

Code:

[{"document_mutuelle"},{"document_rentree"}]

pour que ça fonctionne
06/02/2014, 00h25
steackfrite

Je n'ai pas mis de :
header('Content-type: text/json'); ou header('Content-type: application/json');
Serait ce à cause de ça ? Si oui, où devrais le mettre dans mon php car j'ai essayé de le mettre avant le json_encode(maVariable);, mais ça n'a pas fonctionné. De même si je le met tout en haut de la page.
06/02/2014, 08h22
SpaceFrog

ton retour n'est pas un json mais un array ...
06/02/2014, 11h11
thunder75
Le problème vient de votre fichier config.php, il n'est pas necessaire de mettre de header(), il faut passer en paramètre de la fonction json_encode un tableau correctement formé.
Par exemple vous écrivez ca dans config.php
Code:

1 2 3 4 $tab=array(); array_push($tab,array('nom'=>'Folini','prenom'=>'Gerard')); array_push($tab,array('nom'=>'Durand','prenom'=>'Maurice')); echo json_encode($tab);
Le resultat de json_encode sera

Code:

[{"nom":"Folini","prenom":"Gerard"},{"nom":"Durand","prenom":"Maurice"}]

Avec ce résultat ca devrait mieux fonctionner dans JQuery

Aah, le problème viendrait donc de mon array en php...
J'ai écris mon tableau comme ceci :
Code:

1 2 3 4 5 6 7 8 9 function organiseResultatRequeteSQL($SQLRequest){ // Tableau qui contiendra tous les éléments récupérés dans la BDD $docs = array(); while ($element = $SQLRequest->fetch()){ array_push($docs, $element['NOM_DOCUMENT']); //echo $element['NOM_DOCUMENT']; } return $docs; }
Je vais essayer autrement, et je vous tiens au courant.
Merci pour les conseils :ccool:

EDIT : Voilaaa, j'ai un peu changé mon tableau et je récupère du JSON a priori :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 public function getdocumentCommunName() { // Requête SQL récupérant les documents communs aux promos $this->SQLRequest = $this->bdd->query($this->SELECT_ALL_DOCUMENT_COMMUN); $this->documentCommunName = array(); while ($element = $this->SQLRequest->fetch()) { array_push($this->documentCommunName, array('nomDocument'=>$element[$this->NOM_DOCUMENT])); } $this->SQLRequest->closeCursor(); return $this->documentCommunName; }
et je récupère :

Code:

[{"nomDocument":"document_mutuelle"},{"nomDocument":"document_rentree"}]

Malheureusement, j'obtiens : Uncaught TypeError: Cannot use 'in' operator to search for '81' in [{"nomDocument":"document_mutuelle"},{"nomDocument":"document_rentree"}]
Est ce encore du à un problème de conversion (JSON vers JS Object, vice versa etc...) ?

[{"nomDocument":"document_mutuelle"},{"nomDocument":"document_rentree"}]est un tableau d'objet, concrètement à chaque indice du tableau tu as un objet de type: {"nomDocument":"ton_nom_de_document"}lorsque tu fais:
Code:

1 2 3 4 5 for( var key in document_commun ){ console.log( document_commun[key] ) // retourne {"nomDocument":"ton_nom_de_document"} console.log( document_commun[key].nomDocument ) // retourne "ton_nom_de_document" }

06/02/2014, 14h54
steackfrite
Effectivement, c'est le résultat que j'aimerais obtenir, mais console.log( document_commun[key]) retourne les caractères un par un :
Code:

1 2 3 4 5 6 7 8 9 10 11 [ { " n o m D o c etc..
Tandis que le deuxième console.log me renvoie un "undefined" =/
06/02/2014, 15h52
Darkaurora

tu reçois donc une chaîne de caractère et non un objet JSON.

peux tu afficher le code PHP ou tu retourne tes données avec la fonction json_encode ?

Voici le code :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
function miseAJourDocument(){
        // Instance de la classe BDD
        $bdd = new BDD();
        // Connexion à la BDD
        $bdd->connexionBDD();
        // On récupère les noms des documents communs contenus dans la BDD
        $document_commun = $bdd->getdocumentCommunName();
        // Envoie de la variable vers le fichier "config.js"
        echo json_encode($document_commun);
        // Destruction de l'objet BDD
        unset ($bdd);
}

Et pour ce qui est de la fonction getDocumentCommunName :

Code:

1
2
3
4
5
6
7
8
9
10
11
public function getdocumentCommunName(){
        // Requête SQL récupérant les documents communs aux promos
        $this->SQLRequest = $this->bdd->query($this->SELECT_ALL_DOCUMENT_COMMUN);
        $this->documentCommunName = array();
        while ($element = $this->SQLRequest->fetch()){
                array_push($this->documentCommunName, array('nomDocument'=>$element[$this->NOM_DOCUMENT]));
                echo $element[$this->NOM_DOCUMENT];
        }
        $this->SQLRequest->closeCursor();
        return $this->documentCommunName;
}

06/02/2014, 16h01
SpaceFrog

que dit le console js ?
tu dois en principe voir ton objet en console et pas un string ...

si tu vois un string c'est que ton php ne retourne pas le format !

tu n'as aucune erreur en console?

Pour ce code :

Code:

1
2
3
4
5
 
	for(var key in document_commun)
	{
		console.log(document_commun[key]);
        }

J'obtiens :

Code:

1
2
3
4
5
6
7
8
9
10
 
d
o
c
u
m
e
n
t
etc...

Et pour ce code

Code:

1
2
3
4
5
 
$.each(document_commun, function(index, valeur)
{
	console.log(valeur);
});

J'ai :

Code:

1
2
3
 
Uncaught TypeError: Cannot use 'in' operator to search for '114' in 
document_mutuelledocument_rentree[{"nomDocument":"document_mutuelle"},{"nomDocument":"document_rentree"}]

06/02/2014, 17h10
SpaceFrog

Code:

console.log(document_commun);

donne quoi en dehors de ta boucle ?

le but étant de savoir ce que tu reçois en réponse ... un string ou un objet
06/02/2014, 17h19
Darkaurora

Essaye en modifiant ton paramètre datatype en dataType
06/02/2014, 18h03
steackfrite

Effectivement, merci.
Du coup

Code:

console.log(document_commun);

Renvoie "error"

Si le PHP te renvoie un String ou lieu d'un objet JSON essayes ca

Code:

1
2
3
4
5
6
7
8
9
$.each(JSON.parse(document_commun), function(index, valeur) {
	console.log(valeur.nomDocument);
});
 
ou 
 
$.each($.parseJSON(document_commun), function(index, valeur) {
	console.log(valeur.nomDocument);
});

06/02/2014, 19h58
steackfrite
Depuis que j'ai changé le "datatype" en "dataType", le js part dans :
Code:

1 2 3 4 5 .fail(function() { console.log("error"); })
et me retourne donc "error". :cry:
06/02/2014, 20h49
Darkaurora

Essaye de refaire le test inverse en remplaçant dataType par datatype mais je serais vraiment surpris que ce soit ça ( cf: ici )

Ne développant que sur chrome je n'ai pas d'autre méthodes que celle ci pour voir si le script PHP retourne bien quelque chose et pas une erreur.

Donc sur chrome, F12 => ouverture du developer tools, onglet Network, tu vas visualiser l'ensemble des fichiers chargés par ta page.

Donc lorsque ta requête AJAX sera exécuté tu devrais voir dans la liste "ton_fichier.php" en cliquant dessus tu auras beaucoup d'informations intéressante te permettant de mettre le doigt sur les problèmes que tu rencontres.

J'ai refais le test inverse et donc ma page "config.php", dans l'onglet "preview", je récupère ceci :
Code:

1 2 3 4 5 6 [{"nomDocument":"document_mutuelle"},{"nomDocument":"document_rentree"}] 0: {nomDocument:document_mutuelle} nomDocument: "document_mutuelle" 1: {nomDocument:document_rentree} nomDocument: "document_rentree"
et dans l'onglet "response", j'ai :
Code:

1 2 [{"nomDocument":"document_mutuelle"},{"nomDocument":"document_rentree"}]
Ce qui semble être bon signe, mais lorsque je parcours avec le for, la console me retourne des caractères et avec le $.each, ça fail. J'ai le même résultat dans "network" quelque soit la boucle que j'utilise.

07/02/2014, 13h38
Kaamo

Est-ce que tu parse la réponse comme c'est indiqué ici par thunder ?
Il faut qu'elle soit transformé en objet JavaScript. Là tu sembles appliquer un for ou un $.each sur une chaîne.
07/02/2014, 13h38
Darkaurora

Quelle version de jQuery utilises tu ?

je viens de faire le test pour m'en assurer, il faut bien écrire dataType: 'json',
sinon par défaut tu récupère du plain text.

Si tu passe dans le fail() d'ajax c'est tout simplement qu'une erreur a été retourné par le serveur.

Tu pourras constater cette erreur toi même via la console de développement.
07/02/2014, 14h10
steackfrite
J'utilise la version : v1.10.2

En parsant, la console me renvoie une erreur également.
En revanche, en réécrivant datatype en dataType, j'obtiens quelque chose de cohérent :
Code:

1 2 3 4 5 6 7 8 9 10 [ Object nomDocument: "document_mutuelle" __proto__: Object , Object nomDocument: "document_rentree" __proto__: Object ]
Serait ce le début d'une bonne nouvelle ? =)

C'est bon, j'arrive à récupérer mes éléments sans problème.
Merci à tous, j'aurais eu du mal sans votre aide ! :ccool:

Pour ceux qui auraient un problème similaire voici le code de mon 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
 
$.ajax(
{
	// Paramètres de la requête ajax
	url:'../controllers/config.php',
	type: 'GET',
	dataType: 'json',
	async: 'false',
	// Pour envoyer une variable vers le php
	data:{reloadPage: 1},
})
// Récupère la variable "document_commun"
.done(function(document_commun)
{
	console.log(document_commun);
	for(var key in document_commun)
	{
		console.log(document_commun[key].nomDocument);
	}
	console.log("success");
	})
 
	// Affiche un message d'erreur en cas d'échec
	.fail(function()
	{
		console.log("error");
	})
 
	// Affiche un message lorsque le traitement est terminé
	.always(function()
	{
		console.log("complete");
	});

Et le code de ma page php :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
public function getDocumentCommunName()
{
    $this->SQLRequest = $this->bdd->query('SELECT * FROM DOCUMENT');
 
    $this->documentCommunName = array();
    while($element = $this->SQLRequest->fetch())
    {
        array_push($this->documentCommunName, array('nomDocument', $element['NOM_DOCUMENT']));
    }
 
    $this->SQLRequest->closeCursor();
    return $this->documentCommunName;
}

Merci encore =)