Problème avec $.getJSON

Mac11 -  
Bonjour,

Je suis en train de bloquer. J'utilise la technologie "Wamp" pour la partie serveur.

Mon problème, c'est que je n'arrive pas à récupérer les données dans le fichier fichier.json 



<!DOCTYPE html>
<html lang="fr">
	<head>
		<meta charset="utf-8" />
		<title>Charger des Données Codées en JSON</title>
	</head>

	<body>
		<button id="charger">Charger et traiter les données</button>
		<div id="r">Cliquez sur "Charger et traiter les données" pour lancer la lecture et le traitement des données JSON</div>

		<script src="jquery.js"></script>
		<script>
		  $(function() {
		    $('#charger').click(function() {
		        $.getJSON('fichier.json', function(donnees) {
		        $('#r').html('<p><b>Nom</b> : ' + donnees.nom + '</p>');
		        $('#r').append('<p><b>Age</b> : ' + donnees.age + '</p>');
		        $('#r').append('<p><b>Ville</b> : ' + donnees.ville + '</p>');
		        $('#r').append('<p><b>Domaine de compétences</b> : ' + donnees.domaine + '</p>');
		      });
		    });  
		  });
		</script>
	</body>
</html>


 



{
  "nom": "Pierre Durand",
  "age": "27",
  "ville": "Paris",
  "domaine": "HTML5, CSS3, JavaScript"
}


Merci pour votre aide.

Mac

6 réponses

  • Votes
  • Date
  • Date décroissante
  1. jordane45 Modérateur
    Bonjour,
    Le script fonctionne parfaitement.
    Tes fichiers sont-ils bien encodés en utf8 sans bom ?
    Quelle version de jquery as tu ?
    Le script est-il bien dans le même dossier que ton fichier html ?

    N'aurais tu pas des espaces en trop dans ton json avant la première accolade ?
    Ton fichier devrait ne contenir que : 
    {
  "nom": "Pierre Durand",
  "age": "27",
  "ville": "Paris",
  "domaine": "HTML5, CSS3, JavaScript"
}


    Pour vérifier l'encodage des fichiers, voir chapitre 1 de ce lien :
    https://forums.commentcamarche.net/forum/affich-37584944-php-html-caracteres-accentues-et-l-utf8

    Si malgré ça ça ne fonctionne toujours pas, peux tu regarder dans la console de ton navigateur si tu n'aurais pas des messages d'erreur ?

    1. Mac11 Auteur
      Merci de me répondre.

      Le fichier charger-des-donnees-codees-en-json.html est bien en utf-8.
      L' autre fichier (fichier.json) où se trouve les données n'a pas de balise <meta>.
      Le version : jquery-3.2.1.js.
      Je ne pense pas qu'il y ait des espaces en trop.
    2. jordane45 Modérateur
      Pourquoi me parles tu de balises meta ??
      Tu as été voir le lien que je t'ai donné ???!!
    3. Mac11 Auteur
      Oui mes fichiers sont bien encodés en utf-8. Au début, je pensais que tu faisais allusion à la balise <meta charset="utf-8 />.
      Oui je suis allé le lien que tu m'as donné.
    4. jordane45 Modérateur
      Et pour mes autres questions ?
    5. Mac11 Auteur
      Le version : jquery-3.2.1.js.
      Oui tous les fichiers sont dans le même dossier
  2. Mac11 Auteur
    console

    1. Mac11 Auteur
      après avoir cliqué sur le bouton qui est censé faire apparaître les données
  3. jordane45 Modérateur
    Tu peux remplacer tout ton js par ça et me montrer le résultat dans la console stp : 
    console.log('Avant le debut du script....');
$(function() {
  console.log('jquery ready !');
  $('#charger').click(function() {
    console.log('click sur le bouton');
      
    $.getJSON('fichier.json', function(donnees){
      console.log('getJson runing...');
    })
    .done(function() { 
      console.log('getJSON request succeeded!'); 
      $('#r').html('<p><b>Nom</b> : ' + donnees.nom + '</p>');
      $('#r').append('<p><b>Age</b> : ' + donnees.age + '</p>');
      $('#r').append('<p><b>Ville</b> : ' + donnees.ville + '</p>');
      $('#r').append('<p><b>Domaine de compétences</b> : ' + donnees.domaine + '</p>');
     })
    .fail(function(jqXHR, textStatus, errorThrown) { 
      alert('getJSON request failed! ' + textStatus); 
    });
        
  });
});

    1. Mac11 Auteur
      Réponse

      1. jordane45 Modérateur
        Tu as donc un souci sur ton fichier source.
        Tu peux me montrer (via une capture ecran) son contenu exacte ainsi que son encodage ?