Discussion :

[manu_71]

Bonjour,

Je construis du HTML de manière dynamique (avec PHP). Dedans, j'ai un certain nombre de DIV avec un id dynamique (du genre champ-xx avec xx = un numéro de 0 à 99). Ce nombre de div et les numéros sont variables. Mais je les maîtrise et j'ai leur liste dans un array javascript.
J'ai ensuite besoin de faire un traitement JQuery sur ces div (un append() tout simple). Je parcours alors mon array qui contient le numéros des div... Mais ensuite, comment je sélectionne ce champ dynamique ??

Je sais si j'ai été clair... Alors un p'tit bout de code (mon array avec la liste des numéros est listIdChamp. Je l'ai vérifié avec un alert() et il est ok.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
[...]
for (var i=0; i < listIdChamp.length; i++)
{
  var idDiv = "champ-" + listIdChamp[i];
  $("#idDiv").append("etc...");
}
[...]

Evidemment, ce code ne convient pas vu que la mon sélecteur va rechercher <div id="idDiv">... Mais je ne sais pas comment mettre une valeur dynamique dans le sélecteur...

[SpaceFrog]

le selecteur est un string ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 var idDiv = "champ-" + listIdChamp[i];
  $("#"+idDiv).append("etc...");

[manu_71]

J'ai bien essayé ce genre de combinaisons avant de poser ma question ici mais sans succès (alors que le alert(idDiv) m'affiche bien champ-xx).
Faut que je cherche le problème ailleurs du coup...
Merci pour ta réponse rapide... Je vais enquêter sur mon problème mais au moins je sais qu'il ne vient pas de là.

[kohsaka]

le selecteur est un string ...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 var idDiv = "champ-" + listIdChamp[i];
  $("#"+idDiv).append("etc...");

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 var idDiv = "#champ-" + listIdChamp[i];
  $(idDiv).append("etc...");

(ce que spaceFrog a mis est sensé fonctionner)

Sinon il y a la fonction .eq() http://api.jquery.com/eq/ si ta liste d'id démarre à 0

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$("#champ").eq(listIdChamp[i]).append("etc...");

[manu_71]

Ma liste ne démarre pas à 0 et n'est pas forcément une suite (par exemple il peut y avoir 3 valeurs dans l'ordre suivant : 56, 12, 88).
J'ai trouvé mon soucis qui ne venait en effet pas de la partie javascript mais de la partie PHP dans la construction dynamique de la page. J'étais passé à côté lors de ma première vérif à cause d'une petite subtilité dans ce foutu bug.
Ca fonctionne bien maintenant. Merci pour l'aide !

[SpaceFrog]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$("#champ").eq(listIdChamp[i]).append("etc...");

Heu un id étant unique sur la page ton code n'a aucun sens !!
eq() c'est pour l'indice dans la collection
Or id => un seule element
tu ne peux pas atteindre un pseudo indice dans l'id à mois de faire

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$("[id^='champ']").eq(listIdChamp[i]).append("etc...");

a condition que tu n'aies pas de "trous " de nommage dans tes ids ...

[kohsaka]

Heu, oui tout a fait j’étais à coté de la plaque la
Enfin dans mon esprit j'imaginais une class et non un id

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<div id="content">
   <div class="champ">blabla</div>
   <div class="champ">blabla</div>
   <div class="champ">blabla</div>
   <div class="champ">blabla</div>
   <div class="champ">blabla</div>
</div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
 
$("#content .champ").eq(listIdChamp[i]).append("etc...");

[SpaceFrog]

Et moi :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
<div id="content">
   <div id ="champs0">blabla</div>
   <div id ="champs1">blabla</div>
   <div id ="champs2">blabla</div>
   <div id ="champs3">blabla</div>
   <div id ="champs4">blabla</div>
</div>

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

$("[id^='champs']").eq(i).append("etc...");

avec i entre 0 et 4

[manu_71]

Oui, j'ai pas capté mais en effet.
C'est spacefrog qui a raison pour mon code qui ressemble à :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
<div id="content">
   <div id ="champs0">blabla</div>
   <div id ="champs1">blabla</div>
   <div id ="champs2">blabla</div>
   <div id ="champs3">blabla</div>
   <div id ="champs4">blabla</div>
</div>

Sauf qu'au lieu de 0, 1, 2, 3, 4... c'est des chiffres plus "aléatoires" (en fait ils n'ont rien d'aléatoire mais ils ne se suivent pas). En tout cas la méthode de spacefrog me convient parfaitement.