Problème avec JSON

Résolu/Fermé

Réception

Mac11 Messages postés 145 Date d'inscription samedi 15 juin 2013 Statut Membre Dernière intervention 6 novembre 2020 - 8 avril 2018 à 17:45
jordane45 Messages postés 38288 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 15 novembre 2024 - 8 avril 2018 à 22:23

Bonjour,
Bonjour,
Je suis perdu, et j'ai du mal à comprendre. Lorsque je mets ce code dans le fichier JSON cela fonctionne :


{
	"couleur": "noir",
	"voiture": "porsche",
	"annee": "1997"
}

Et lorsque je mets ce code dans le fichier JSON cela ne fonctionne plus (voir image ci-dessous).

Quelqu'un peut-il m'aider ? je voudrais afficher également les données de l'Opel.

Merci

Mac

A voir également:

Fichier json google photo
Google maps satellite - Guide
Dns google - Guide
Fichier rar - Guide
Google traduction photo - Guide
Google earth - Télécharger - 3D

4 réponses

Réponse 1 / 4

jordane45 Messages postés 38288 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 15 novembre 2024 4 703
8 avril 2018 à 18:08

Bonjour,

Pour commencer... ici on poste son code directement. On n'en met pas des images.... car ça ne nous permet pas d'en faire des copier/coller.
Voir ici comment utiliser les balises de code : https://codes-sources.commentcamarche.net/faq/10686-le-nouveau-codes-sources-comment-ca-marche#balises-code

Ensuite, dans ton second exemple.. tu as deux "objets" json.
Il te faut donc boucler dessus.

$.each(donnees, function (index, voiture) {
   //ici ton code pour utiliser le contenu de ta boucle...   
   //par exemple
   console.log(voiture);
}

Mac11 Messages postés 145 Date d'inscription samedi 15 juin 2013 Statut Membre Dernière intervention 6 novembre 2020 12
8 avril 2018 à 18:53


<!DOCTYPE html>
<html lang="fr">
	<head>
		<meta charset="utf-8" />
		<title>Concerts</title>

		<script src="js/jquery-3.3.1.min.js"></script>
		<script src="js/concert.js"></script>
	</head>

	<body>
		<button id="charger">Charger</button> <!-- afficher losqu'on appui sur le bouton -->
		<div id="r">

		</div>
	</body>
</html>


$(function() {
	$('#charger').click(function() { 
		$.getJSON('json/concert.json', function(donnees) {
			$('#r').html('<p><b>Couleur</b> : ' + donnees.couleur + '</p>');
			$('#r').append('<p><b>Voiture</b> : ' + donnees.voiture + '</p>');
			$('#r').append('<p><b>Année</b> : ' + donnees.annee + '</p>');
		});
	}); 
});


{
	"couleur": "noir",
	"voiture": "porsche",
	"annee": "1997"
},
{
	"couleur": "bleu",
	"voiture": "opel",
	"annee": "1996"
}

Mac11 Messages postés 145 Date d'inscription samedi 15 juin 2013 Statut Membre Dernière intervention 6 novembre 2020 12
8 avril 2018 à 18:54

mais, je ne vois pas où mettre cette boucle

Réponse 2 / 4

Mac11 Messages postés 145 Date d'inscription samedi 15 juin 2013 Statut Membre Dernière intervention 6 novembre 2020 12
8 avril 2018 à 20:54

La console m'affiche cela

jordane45 Messages postés 38288 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 15 novembre 2024 4 703
8 avril 2018 à 21:01

ok. je n'étais pas sûr.
Bon.. et ce code là :

$(function() {
    $('#charger').click(function(){ 
      console.log('chargement en cours...');
      var url = 'json/concert.json';
      $.ajax({
        dataType: "json",
        url: url,
        success: function(donnees) {
            console.log('les donnees du fichier :');
            console.log(donnees);
            $.each(donnees, function (index, voiture){
              console.log('boucle : ' + index);
              console.log(voiture);
              $('#r').append('<p><b>Couleur</b> : ' + voiture.couleur + '</p>');
              $('#r').append('<p><b>Voiture</b> : ' + voiture.voiture + '</p>');
              $('#r').append('<p><b>Année</b> : ' + voiture.annee + '</p>');
            });
          },
        error :function(jqXHR, textStatus, errorThrown) {
            console.log("error ! " + textStatus + ' : '   + jqXHR.responseText);
          }
      });
    });
  });

Réponse 3 / 4

Mac11 Messages postés 145 Date d'inscription samedi 15 juin 2013 Statut Membre Dernière intervention 6 novembre 2020 12
8 avril 2018 à 21:26

Voila

jordane45 Messages postés 38288 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 15 novembre 2024 4 703
8 avril 2018 à 22:02

Ton fichier JSON n'est pas correct.
Essaye avec ça

[
  {
    "couleur": "noir",
    "voiture": "porsche",
    "annee": "1997"
  },
  {
    "couleur": "bleu",
    "voiture": "opel",
    "annee": "1996"
  }
]

jordane45 Messages postés 38288 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 15 novembre 2024 4 703
8 avril 2018 à 22:13

Une fois ton fichier json corrigé, tu peux remettre ton ancien code

	$('#charger').click(function() { 
		
		$.getJSON('json/concert.json', function(donnees) {
			$.each(donnees, function (index, voiture) {
				console.log(voiture);
				$('#r').append('<p><b>Couleur</b> : ' + voiture.couleur + '</p>');
				$('#r').append('<p><b>Voiture</b> : ' + voiture.voiture + '</p>');
				$('#r').append('<p><b>Année</b> : ' + voiture.annee + '</p>');
			});
		});
	}); 
});

mais perso.. je préfère la syntaxe du $.ajax qui permet d'avoir une méthode "error" et donc savoir lorsqu'il y a un souci de quoi il retourne.

Réponse 4 / 4

Mac11 Messages postés 145 Date d'inscription samedi 15 juin 2013 Statut Membre Dernière intervention 6 novembre 2020 12
8 avril 2018 à 22:16

Bravo jordane45 ça fonctionne... merci. Juste par un manque d'une paire de crochet... whoa.
Merci encore pour ton aide

jordane45 Messages postés 38288 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 15 novembre 2024 4 703
8 avril 2018 à 22:23

Pense à mettre le sujet en résolu.

Discussions similaires

Probleme de récupération de mon JSON dans mon java

Pb réception le cube canalsat

Erreur 408

J'ai reçu un email de menace après avoir regardé du porno

Mail : hacker et menace de diffusion vidéo

Menace par email bitcoin