Problème avec $.getJSON

Mac11 Messages postés 158 Statut Membre -  
Mac11 Messages postés 158 Statut Membre -
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

  1.
    jordane45 Messages postés 30427 Date d'inscription   Statut Modérateur Dernière intervention   4 831
     
    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 ?

    0
    1. Mac11 Messages postés 158 Statut Membre 12
       
      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.
      0
    2. jordane45 Messages postés 30427 Date d'inscription   Statut Modérateur Dernière intervention   4 831
       
      Pourquoi me parles tu de balises meta ??
      Tu as été voir le lien que je t'ai donné ???!!
      0
    3. Mac11 Messages postés 158 Statut Membre 12
       
      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é.
      0
    4. jordane45 Messages postés 30427 Date d'inscription   Statut Modérateur Dernière intervention   4 831
       
      Et pour mes autres questions ?
      0
    5. Mac11 Messages postés 158 Statut Membre 12
       
      Le version : jquery-3.2.1.js.
      Oui tous les fichiers sont dans le même dossier
      0
  2. Mac11 Messages postés 158 Statut Membre 12
     
    console

    0
    1. Mac11 Messages postés 158 Statut Membre 12
       
      après avoir cliqué sur le bouton qui est censé faire apparaître les données
      0
  3. jordane45 Messages postés 30427 Date d'inscription   Statut Modérateur Dernière intervention   4 831
     
    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); 
    });
        
  });
});

    0
  4. Mac11 Messages postés 158 Statut Membre 12
     
    Réponse

    0
    1. jordane45 Messages postés 30427 Date d'inscription   Statut Modérateur Dernière intervention   4 831
       
      Tu as donc un souci sur ton fichier source.
      Tu peux me montrer (via une capture ecran) son contenu exacte ainsi que son encodage ?
      0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. Mac11 Messages postés 158 Statut Membre 12
     
    ..


    0
    1. jordane45 Messages postés 30427 Date d'inscription   Statut Modérateur Dernière intervention   4 831
       
      J voulais parler du fichier json
      0
  7. Mac11 Messages postés 158 Statut Membre 12
     
    Ok, excuse moi.



    0