[Résolu] Parcourir plusieurs objets

Debutant en JS, j'aimerais être capable de parcourir plusieurs objets pour leur assigner un evenement onclick

J'explique
Sur ma page HTML, j'ai un tableau. Chaque ligne du tableau, en + d'afficher des informations, possède en bout de ligne des boutons "d'actions".
L'un deux ouvre une popup (javascript) qui, en gros, affiche des données qui pourront être imprimés

Je voudrais donc pouvuoir parcourir ce tableau html et assigné au bouton "imprimer" un evenement onclick.Ma question est donc, comment parcourir le tableau et avoir l'objet ? (c'est une image avec un lien)

voici une de ces lignes du tableau (actuellement ce n'est pas un popup, mais un lien classique)

 <tr>
      <td><a href="user.php?eid=1&uid=37">Toto</a></td>
      <td>Titi</td>
      <td>Groupe A</td>
      <td><a href="user.php?eid=1&uid=31">admin</a></td>
      <td>17/07/2006</td>
      <td>
        <a href="user_edit.php?eid=1&uid=37">
          <img src="img/edit.png" alt="Editer" title="Editer" /></a>
        <a href="user_ticket.php?eid=1&uid=37">
          <img src="img/print_ticket.png" alt="Imprimer" title="Imprimer" /></a>
      </td>
    </tr>

Voici ce que je pensais faire :

        table = document.getElementById('users_list');
	for (j = 1; j < table.rows.length; j++)
	{
		id_img = table.rows[j].cells[5].???;
		addevent(id_img, "click", myfunc);
	}

Ma logique est-elle bonne ? myfunc fera donc le windows.open

Après il faudra que je trouve comment récuperer les valeurs que je veux encoyé à myfunc, mais c'est une autre histoire
Modifié par nORKy (17 Aug 2006 - 13:31)

Bonjour,
C'est faisable avec les outils mis à disposition par le système DOM : getElementById, getElementsByTagName ... avec ces deux fonctions tu devrais pouvoir t'en sortir.

Ma question se pose justement sur l'utilisation de DOM
Mais c'est pour ma boucle de parcour que je me pose la question

Salut,

Si tu veux en savoir plus sur le DOM, va voir de ce coté (merci koala) ou bien là, très complet également.
Ces sources vont te permettre de comprendre ce qu'est le DOM.

Pour ton problème, il te sera très utile d'avoir l'extension Webdeveloper si tu es sur Firefox ou Mozilla, ou encore la DevToolBar si tu es sur IE.
Ces outils vont te permettre de visualiser l'arborescence de ton document.

Ensuite, en sachant ce que font les méthodes citées par QuentinC, tu devrais avoir une idée plus précise pour parcourir ton tableau et assigner un évènement à un élément particulier.

J'espère que cela t'aidera.

Bonjour,

nORKy a écrit :


Je voudrais assigné au bouton "imprimer" un evenement onclick.Ma question est donc, comment parcourir le tableau et avoir l'objet ? (c'est une image avec un lien)

Tu peux retrouver le bouton dans la hiérarchie DOM par son attibut alt et appliquer l'évènement à son lien parent :

images=document.getElementsByTagName('IMG');
for (im=0;im<images.length;im++){
  if(images[im ].alt=="imprimer"){
    lien=images[im ].parentNode;
    if(!lien.tagName)lien=lien.parentNode;// Gecko
    lien.onclick=myfunc;
  }
}

Modifié par chmel (16 Aug 2006 - 23:49)

chmel a écrit :
Bonjour,

Tu peux retrouver le bouton dans la hiérarchie DOM par son attibut alt et appliquer l'évènement à son lien parent :

images=document.getElementsByTagName('IMG');
for (im=0;im<images.length;im++){
  if(images[im ].alt=="imprimer"){
    lien=images[im ].parentNode;
    if(!lien.tagName)lien=lien.parentNode;// Gecko
    lien.onclick=myfunc;
  }
}

Je ne comprends pas lien //gecko.
Gecko rajoute un neoud vide entre 'img' et 'a' c'est ca ?
sinon, merci beaucoup, c'est ca que je voulais, mais le liens donné avant par dunji sont très interessant et je devrais vite progresser

nORKy a écrit :


Je ne comprends pas lien //gecko.
Gecko rajoute un neoud vide entre 'img' et 'a' c'est ca ?
sinon, merci beaucoup, c'est ca que je voulais, mais le liens donné avant par dunji sont très interessant et je devrais vite progresser

Oui, Gecko voit probablement un noeud #text comme dans cet éxemple cité par dunji.
Je n'ai pas testé ce bout de code, mais il devrait marcher si tu l'actives par window.onload ou après le code HTML de ton bouton.
Et, si comme moi tu n'est pas spécialement anglophone, je te propose ce lien complémentaire sur la Liste des traductions françaises disponibles des documents W3C
Modifié par chmel (18 Aug 2006 - 00:16)