Parsing un tableau compliqué avec getJSON Jquery

Question

TLDR:

1. Commencez avec this question simplifié après obtenu une partie de ce travail et en continuant ici.
2. J'ai besoin de 'GET' le tableau JSON
3. Formatez-le correctement et pour chacun dans le tableau placez-le dans le DIV correspondant.
4. ??
5. Il fonctionne.

---

C'est un suivi de this question pour simplifier et continuer.

J'ai besoin de certaines données JSON compliquées d'un tableau. Avec cela, j'ai besoin du titre et de sa valeur. La raison pour laquelle je fais ceci est parce que je saurai ce que le tableau est appelé mais pas les données qui sont générées à l'intérieur.

Disons que ce nouveau tableau se présente comme suit:

{"Days": 
[{"day": "Sunday", "time": "10.00"}, 
{"day": "Monday", "time": "12.00"}, 
{"day": "Tuesday", "time": "09.00"}, 
{"day": "Wednesday", "time": "10.00"}, 
{"day": "Thursday", "time": "02.00"}, 
{"day": "Friday", "time": "05.00"}, 
{"day": "Saturday", "time": "08.00"} 
]} 

fixes grâce à (Matthew Flaschen)

je besoin pour obtenir dimanche & 10.00 ainsi que le même pour tous les autres .

Mon code pour analyser ce au moment est la suivante:

$.getJSON(url, 
    function(data){ 
     $.each(data, function(i,item){ 
     $('.testfield').append('<p>' + item + '</p>'); 
     }); 
    }); 

Sans les fois ajouté à chaque date analysera les données comme suit:

Sunday, Monday, Tuesday, Wednesday, Thursday, Friday, Saturday 

Avec le temps ajouté à les jours dans le tableau Firebug ne le reconnaît plus comme une chaîne JSON. Donc je devine que j'ai formaté quelque chose de mal ici. , Je dois aussi chaque jour & le temps d'être sur une nouvelle ligne je pensais que

$('.testfield').append('<p>' + item + '</p>' + '<br />'); 

aurait été appliqué chacun à une nouvelle ligne, mais cela ne fonctionne pas.

1. Comment puis-je obtenir chaque jour ou élément sur une nouvelle ligne?
2. Comment puis-je obtenir le getJSON de $ pour analyser correctement les données jour et sa valeur, dans un div?

Answer 1

Essayez ceci (reformaté JSON - la prochaine fois vérifier votre JSON avec JSONLint):

{ 
    "Days": [ 
     { 
      "Sunday": "10.00", 
      "Monday": "12.00", 
      "Tuesday": "09.00", 
      "Wednesday": "10.00", 
      "Thursday": "02.00", 
      "Friday": "05.00", 
      "Saturday": "08.00" 
     } 
    ] 
} 

Script pour travailler avec le:

$.getJSON(url, function(data){ 
    $.each(data.Days[0], function(key,value){ 
    $('.testfield').append('<p>' + key + ' : ' + value + '</p>'); 
    }); 
}); 

Answer 2

Ce n'est pas valide JSON. Faites quelque chose comme:

{"Days": 
[{"day": "Sunday", "time": "10.00"}, 
{"day": "Monday", "time": "12.00"}, 
{"day": "Tuesday", "time": "09.00"}, 
{"day": "Wednesday", "time": "10.00"}, 
{"day": "Thursday", "time": "02.00"}, 
{"day": "Friday", "time": "05.00"}, 
{"day": "Saturday", "time": "08.00"} 
]} 

Utilisez toujours JSONLint ou d'une autre validateur pour vérifier la syntaxe.

Answer 3

Un peu hors sujet, mais si vous n'avez pas le contenu sûr, vous devez utiliser une méthode sûre pour insérer des données à DOM. Sinon, votre code a une vulnérabilité XSS. Et en plus d'être un problème de sécurité, toutes les données telles que "Foo Bar <foo.bar@example.com>" ne seront pas rendues comme vous le souhaitiez (probablement).

Par exemple, vous pouvez utiliser la méthode du texte jQuery():

$('.testfield').append($('<p></p>').text(item));