IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

jQuery Discussion :

Décoder une structure json


Sujet :

jQuery

  1. #1
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut Décoder une structure json
    Bonjour,

    Je dois récupérer une structure de données depuis un script php vers du javascript en passant par du json mais ne sais pas trop comment m'y prendre. Cela fait plusieurs jours que je cherche des exemples pour m'inspirer mais ne trouve que des trucs super compliqués ^^

    alors voilà si j'ai bien compris mon script php retourne ma structure data via json comme suit :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    echo json_encode($data);
    mais du côté javascript je ne sais pas du tout comment m'y prendre, qqn pourrait-il m'expliquer s'il vous plait ?

    et sinon qqn saurait me dire la différence entre json et serialize() ? existe-t'il une fonction javascript permettant de convertir une variable au préalable "serializée" ?

    vaut-il mieux utiliser json ou serialize?

    Merci.

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    les deux méthodes les plus simples sont JSON.parse et getJSON de jquery ...


    JSON.parse
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    stringjson='<?php echo json_encode($data); ?>';
    //json parse
    JSON.parse(stringjson, function(json){ console.log(json) });
    Attention à l'ordre des " et ' dans le string json ...

    avec JQUERY

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    json=$.getSJON( "pagephpquifaisechojosonencode.php", function(json) {
      console.log( json );
    })

  3. #3
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut
    Merci beaucoup.

    Je n'arrive pas à implémenter vos deux exemples.

    Voilà comment je m'y prends pour le 1er exemple :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    				function envoyerFichier(filename) {
    					$.ajax({
    						type: "POST",
    						url: "envoyerFichier.php",
    						dataType: 'json',
    						data: ({filename: filename}),
    						success: function(out) { 
    							JSON.parse(out, function(json){ console.log(json) });
    							$("#container").html(out);
    							}
    						});}
    avec dans envoyerFichier.php
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    	echo json_encode($data);
    ça ne génère pas d'erreur mais ça n'affiche rien sur ma page ni en console

    et pour le 2ème exemple, voilà comment je m'y suis prise :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    				function envoyerFichier(filename) {
    					$.ajax({
    						type: "POST",
    						url: "envoyerFichier.php",
    						dataType: 'json',
    						data: ({filename: filename}),
    						success: function(out) { 
    							json=$.getSJON( "envoyerFichier.php", function(json) {
    								console.log( json );
    								})
    							$("#container").html(json);
    							}
    						});}
    ça ne fait rien du tout mais je me doute bien que je m'y prends mal.

    pardon je ne suis pas du tout au point c'est très confus dans ma tête...

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    Dans ton premier exemple ...
    TON dataTyoe est json ... donc ton retour est déjà formaté

    regarde en console

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    function envoyerFichier(filename) {
    					$.ajax({
    						type: "POST",
    						url: "envoyerFichier.php",						dataType: 'json',
    						data: ({filename: filename}),
    						success: function(out) { 
    							 console.log(out);
                                                             $("#container").html(out.key1);  // si ton json a une clef key1=> { key1: 'coucou' }
     });
     
    							}		
    				});}
    Dans ton exemple 2 ... inutile de refaire un getJSON dans le success de ton ajax ... il suffit de remplacer ton ajax par le getJSON
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    function envoyerFichier(filename) {
    					$.getJson({"envoyerFichier.php",{filename: filename}), function(out) { 
    							JSON.parse(out, function(json){ console.log(json) });
    							$("#container").html(out);
    							}
    						)

  5. #5
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut
    MERCI !!!

    voici le contenu de ma structure :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
     
    1 : 
    Cle : Jour; Valeur : 04/10/2015<br />
    Cle : ...
    Cle : ...
    ...
    2 : 
    Cle : Jour; Valeur : 04/10/2015<br />
    Cle : ...
    Cle : ...
    ...
    3 :
    ...
    (je sais que $data est bien renseigné car je l'affiche dans un fichier avant de sortir de mon script mais je n'ai encore rien réussi à afficher dans ma page html ni même dans la console (et est-ce que c'est normal que je vois rien en console car quand je fais un echo serialize($data); je vois bien la structure de données dans la console via firebug mais avec echo json_encode($data); la console est muette.

    ce bout de code ne m'affiche rien :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    				function envoyerFichier(filename) {
    					$.ajax({
    						type: "POST",
    						url: "envoyerFichier.php",
    						dataType: 'json',
    						data: ({filename: filename}),
    						success: function(out) { 
    							console.log(out);
    							$("#container").html(out);
    							}
    						});}
    et ceci :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    					function envoyerFichier(filename) {
    						$.getJson("envoyerFichier.php", {filename: filename}, function(out) { 
    							JSON.parse(out, function(json){ console.log(json) });
    							$("#container").html(out);
    							}
    							)
    					}
    génère une erreur
    TypeError: $.getJson is not a function
    $.getJson("envoyerFichier.php", {filename: filename}, function(out) {
    Merci.

  6. #6
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    js est case sensitive ...

  7. #7
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut
    Je te remercie.

    En modifiant la structure de données que j'exporte de php vers javascript ton bout de code fonctionne très bien.
    voici en exemple le tableau que j'arrive sans souci à récupérer via json
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    $tablo = [
        "foo" => "bar",
        "bar" => "foo",
    ];
    Mais en gardant mon tableau $dtata tel quel aucune donnée n'arrive à transiter.

    Je pense que je dois faire erreur dans ma façon d'implémenter mon tableau $data.

    J'indique ici la structure du tableau $data au cas où cela inspirerait qqn

    0: (1ère ligne du tableau)
    Clé1 : xxx ; Valeur1 : xxx
    Clé2 : xxx ; Valeur2 : xxx
    Clé3 : xxx ; Valeur3 : xxx
    etc...Clé20...

    1: (2ème ligne du tableau)
    Clé1 : xxx ; Valeur1 : xxx
    Clé2 : xxx ; Valeur2 : xxx
    Clé3 : xxx ; Valeur3 : xxx
    etc...Clé20...
    .
    .
    .
    c'est un tableau de tableaux associatifs, je pense que je m'y prends mal mais ne sais pas bien à quel niveau.

    Encore merci : )

  8. #8
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    a quoi ressemble ton json si tu le mets en console sur le sur le callback (success) de ton ajax ?

  9. #9
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut
    je ne suis pas sûre de comprendre..

    je n'ai pas réussi à faire fonctionner ton 2ème exemple ça me génère une erreur
    SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data
    JSON.parse(out, function(json){ console.log(json) }); )
    donc voici comment c'est actuellement implémenté au niveau ajax :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    				function envoyerFichier(filename) {
    					$.ajax({
    						type: "POST",
    						url: "envoyerFichier.php",
    						dataType: 'json',
    						data: ({filename: filename}),
    						success: function(out) { 
    							console.log(out);
    							$("#container").html(out);
    							}
    						});
    lorsque je passe mon tableau $data la console n'affiche rien. par contre lorsque je lui demande de passer $tablo = ["foo" => "bar", "bar" => "foo",]; la console affiche bien l'objet Object { foo="bar", bar="foo"}

    Merci.

  10. #10
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    l'erreru vient du format du json reçu
    SyntaxError: JSON.parse: unexpected character at line 1 column 2 of the JSON data
    JSON.parse(out, function(json){ console.log(json) }); )
    Veut dire qu'il n'arrive pas à parser le string qu'il reçoit car il ne le reconnait pas comme étant un string json ...

    poru voir ce que tu reçoit, change le dataType en text
    et regarde ce que tu reçois en console

  11. #11
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut
    j'ai donc mis le dataType à 'text' et j'obtiens dans la console :
    (une chaîne vide)
    (par contre lorsque je fais depuis mon script php je vois bien le contenu de $data dans la console... (juste pour préciser que $data existe et n'est pas vide ^^)

  12. #12
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 644
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 644
    Points : 66 671
    Points
    66 671
    Billets dans le blog
    1
    Par défaut
    Je crois que l'on ne parle pas du meêm code ...
    on verra pour faire le getJSON une fois que l'on sera sur d'avoir la bonne réponse du serveur

    Que donne le code suivant ?
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    function envoyerFichier(filename) {
    					$.ajax({
    						type: "POST",
    						url: "envoyerFichier.php",
    						dataType: 'text',
    						data: ({filename: filename}),
    						success: function(out) { 
    							console.log(out);
    							$("#container").html(out);
    							}
    						});

  13. #13
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut
    voici ce que donne le code indiqué plus haut dans la console :

    Merci.

  14. #14
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut
    up

    je suis toujours sur le même problème : impossible de faire transiter ma structure de données depuis php vers ajax, la console n'affiche jamais rien.

    voici comment côté php j'implémente ma structure $data que j'essaye de récupérer en ajax :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    while (($row = fgetcsv($handle,2048,";")) !== FALSE) {
        // lecture de la 1ere ligne pour récupérer les noms des champs
        if ($numRow == 0) {
            $cols = $row;
            }
        else {
            // lecture des autres lignes
            $data[] = array_combine($cols, $row);
            }
        $numRow++;
        }
    Côté ajax j'ai l'impression d'avoir tout essayé je ne sais plus comment m'y prendre...si je mets dataType='json'; ou JSON.parse(out); ça ne fait rien du tout, je n'arrive jamais à visualiser ma structure en console ou sur ma page html

    SpaceFrog : le bout de code que tu m'as demandé d'essayer plus haut ne m'affiche rien en console (chaine vide)

    QQn aurait une idée ?

    Merci.

  15. #15
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 135
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 135
    Points : 44 923
    Points
    44 923
    Par défaut
    Bonjour,
    QQn aurait une idée ?
    il te faut commencer par regarder si tu génères quelque chose coté serveur, car si tu n'envoies rien tu ne recevras rien.

  16. #16
    Membre à l'essai
    Femme Profil pro
    Développeur Web
    Inscrit en
    Septembre 2015
    Messages
    20
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 43
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Septembre 2015
    Messages : 20
    Points : 12
    Points
    12
    Par défaut
    Bonjour,

    Juste avant de retourner $data, j'écris son contenu dans un fichier :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    		$fichier=fopen('test.log','w'); 	
    		foreach ($data as $element) {
    			fwrite($fichier, "\n");  
    			while (list($key, $value) = each($element)) {
    				fwrite($fichier, "Cle : $key; Valeur : $value<br />\n");
    				}
    			}
    le tableau data est défini et bien renseigné.
    Juste après je fais :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    	header('Content-Type: application/json');
    	echo json_encode($data);
    mais ça ne retourne rien, la console n'affiche absolument rien si ce n'est
    POST http://localhost/promo_locale/envoyerFichier.php

    200 OK
    41ms
    jquery-1.11.3.js (ligne 9664)
    (une chaîne vide)
    (lorsque je mets le dataType à 'text')

    Merci.

Discussions similaires

  1. sizeof() d'une structure
    Par tut dans le forum MFC
    Réponses: 12
    Dernier message: 29/08/2006, 19h21
  2. Comment mettre en place une structure 3 tiers.
    Par WOLO Laurent dans le forum Débats sur le développement - Le Best Of
    Réponses: 13
    Dernier message: 27/07/2003, 23h01
  3. [toFAQ][socket] Envoi d'une structure
    Par julien20vt dans le forum C++
    Réponses: 15
    Dernier message: 23/04/2003, 16h47
  4. longueur d'une structure
    Par bohemianvirtual dans le forum C
    Réponses: 6
    Dernier message: 28/05/2002, 19h31

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo