11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,
Je cherche à créer dynamiquement une liste type select à l'aide de js.cette liste contient des nom de contact que je récupère via AJAX sous forme d'une chaine json. Dans cette chaine le nombre de nom est inconnu (autant qu'on veut)
chaine JSON : "{"nom1":"toto","nom2":"tata","nom3":"tutu",..}"
donc quand je créer ma select list j'utilise ce code. Je voudrai récupérer les nom
voici mon code (qui ne marche pas)

		jqcc("#companycontacts").append('<label for="companycontacts">contacts du groupe</label>'+
	'<select>'+	
	                for(i=1;i<=nbr_elem;i++)
                        {
				jqcc("#companycontacts").append('<option>'+(obj.firstname+i)+'</option>');
			}
				jqcc("#companycontacts").append('</select>');


cette ligne

'<option>'+(obj.firstname+i)+'</option>'

pause problème, je n'arrive pas a appelé les nom[i]..Quelqu'un à une idée?si je ne suis pas clair n'hésité pas à le dire. J'ai regardé sur internet apparement la fonction eval peut aider mais n'est pas la meilleur solution, j'ai vu des topic parler de window['nom'+i] mais je n'ai pas réussi à adapter.. Merci d'avance pour votre aide
[/i]
J'ai vu sa aussi de proposer mais je vois pas trop comment sa peut m'aider...peux tu me mettre sur la voie
je sais ce qu'est un tableau ^^'tu pense que je devrais faire comme sa?
(obj.i est le nombre d'élément dans ma chaine json.

				for(i=0;i<obj.i;i++)
				{
					tab["nom"+i]=???
				}
Hello,

Bon déjà tu pourrais préciser que tu utilises jQuery, tout le monde ne peut pas le deviner… Ensuite, tant qu'à choisir jQuery, autant en profiter et utiliser les fonctions internes de ce framework, c'est à dire le $.each() au lieu d'une boucle for().


Bref, passons au vif du sujet :

Fichier json (data.json) :

{
    "nom1": "toto",
    "nom2": "tata",
    "nom3": "tutu"
}


Le js (mes_fonctions.js) :

// Attention, j'utilise la dénomination "$", alors que tu sembles utiliser "jqcc".
// Ça sort de Joomla apparemment…
jQuery(function ($) {
	
		function constructSelect(data){
			var companyContacts = $(".companyContacts");
			$.each(data,function(key, value){
				var elemSelect = $("<option></option>");
				companyContacts.append(elemSelect);
				companyContacts.find(elemSelect+":last").html(value).attr('value',key);
			});
		}
		
		var lien = "data.json";
		$.ajax({
			url : lien,
			dataType : 'json',
			success: function(data){
				constructSelect(data);
			},
			error: function(){
				alert('file error');
			}
		});
		
	});



Et l'html :


<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Test json</title>
</head>
<body>
<select class="companyContacts" name="companyContacts">
	<option>Please select a contact</option>
</select>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript" src="mes_fonctions.js"></script>
</body>
</html>




Enfin, deux derniers mots : ce serait pas mal de faire un petit effort niveau orthographe Smiley cligne et le titre de ton post n'est pas du tout représentatif de ta question ! Tu devrais le modifier…
Modifié par ZeB_panam (05 Aug 2011 - 23:47)