Json dans option box html [Résolu]

Signaler
Messages postés
10
Date d'inscription
lundi 21 septembre 2020
Statut
Membre
Dernière intervention
17 novembre 2020
-
Messages postés
30338
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 novembre 2020
-
Bonjour,

Je cherche à mettre mon json dans une option box.

Mon json ressemble à ca :
{
  "people" : [
    {
     
      "id": 12322,
      "name" : Charles,
      "age" : 28,
    },
   {

      "id" : 29832,
      "name" : Etienne,
      "age" : 54,

   }

  ]
}


Et je voudrais récupérer "name" pour les mettre dans une option box ou select list ou je sais pas comment on appelle ça et lorsque qu'on clique dessus, récupérer l'id associé.

Pour l'instant je récupère mon json depuis ma servlet et j'ai essayé plusieurs code qui ne marche pas :


   
var data ='<%= (String) request.getAttribute("people")%>';   
var list = JSON.parse(data);

//var list = data['people'];


var sel = document.getElementById('my_select');
for(var i = 0; i < list.length; i++) {
}
    var opt = document.createElement('option');
    opt.innerHTML = list[i]['id'] + list[i]['full-name'];
    sel.appendChild(opt);





EDIT : Correction des balises de code.
Le langage à indiquer ici est le js (pour javascript) et non le html.

Merci d'avance.

3 réponses

Messages postés
30338
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 novembre 2020
3 025
Bonsoir,

Déjà, ta question concernant le javascript, je la déplace donc dans le forum .... javascript.

Ensuite, tu fermes ton FOR trop top...
for(var i = 0; i < list.length; i++) {
}
 


Et enfin, tu devrais ajouter des console.log dans ton code pour essayer de voir ce que contiennent tes variables..
Ligne 5 , par exemple, faire
console.log('LIST', list);

et voir ce que ça t'affiche dans la console...

Puis éventuellement essayer ensuite de faire un
console.log('PEOPLE' , list.people );


Pour info :
https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/JSON/parse

.

Cordialement,
Jordane
Messages postés
10
Date d'inscription
lundi 21 septembre 2020
Statut
Membre
Dernière intervention
17 novembre 2020

Bonjour,

Merci de ta réponse,


Je retrouve çà dans mon :
   console.log('PEOPLE' , list.people ); 


Je ne sais pas comment le parser et le mettre dans une liste de selection
Messages postés
30338
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 novembre 2020
3 025
Et bien, il faut boucler dessus
par exemple
var PEOPLE = list.people;
for(var i = 0; i < PEOPLE.length; i++) {
   console.log("i" , PEOPLE[i]);
}


par contre, d'où proviennent tes données ?
Par ce que javascript n'aime pas les noms de variables avec des tirets (qu'il considère comme le signe mathématique "-" )

Si tu as moyens de modifier le nom de ce que contient ton json ça serait préférable...
Messages postés
10
Date d'inscription
lundi 21 septembre 2020
Statut
Membre
Dernière intervention
17 novembre 2020

Je récupère bien toutes les données pour chaque personne mais j'aimerai récupérer seulement un champs (ex : "last-name) et le mettre dans une liste de selection.

Je crois avoir qqch qui fonctionne pour la liste, mais c'est comme si je n'arrivais pas à parser mon json :




 <select id="student" name="student" class="form-control">
    <option value="">Select Store</option>
</select>


var data ='<%= (String) request.getAttribute("people")%>';   
var list = JSON.parse(data);
//console.log('LIST', list);
console.log('PEOPLE', list.people);


$.each(list, function (index, record) {

        var stud_address2 = record.id;
  
    
    $('<option>', {
        value: record.id,
        text: record.full-name + ", " + record.id
    }).appendTo("#student");
});



Quand j'affiche par exemple : list.id il m'affiche un UNDEFINED

Pour ce qui est des tirets, non je ne peux malheureusement pas y faire grand chose...
Messages postés
30338
Date d'inscription
mercredi 22 octobre 2003
Statut
Modérateur
Dernière intervention
26 novembre 2020
3 025
Tu as lu ce que je t'ai marqué ??

1 - C'est sur list.people que tu dois faire ta boucle
2 - Il ne faut pas de tiret dans le nom de tes variables