tableau qui a deux couleur pour les lignes <td>

**abdess6600** · 22/05/2006, 18h20

je suis desesperé

, je veus afficher un tableau qui a des couleures differentes pour deux lignes voisine .
le probleme c est que je fais appel a une collection de donée que j ai récuperer depuis struts et je boucle avec le tag <logic:iterate> donc si je specifie une class CSS pour ma ligne sa va etre pour toutes les ligne se ma table .
je me suis dirigé vers ce forum parce que je veus savoir esqu on peut erriver a faire des lignes a differentes couleurs rien qu avec les CSS ou DHTML ou XHTML ou simlement avec HTML sans faire apel a d'autre langague .

merci

**Swoög** · 22/05/2006, 18h26

il y a de très nombreux exemples sur le forum... cherche un peu

il te suffit de faire, par exemple ceci :

Code :

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

1
2
3
4
5
6
<table>
<tr class="pair">[...]</tr>
<tr class="impair">[...]</tr>
<tr class="pair">[...]</tr>
<tr class="impair">[...]</tr>
[...]</table>

puis de définir deux style différents pour chaque class

**abdess6600** · 22/05/2006, 18h41

oui je sais faire ca , mais le probleme c est que je boucle les <tr> suite a une <logic:iterate> donc je ne peut pas faire le truc de paire et impaire pour les css .
c est quelque chose comme :

<logic:iterate name="listerProcessusForm" property="process" id="processus" >
<TR >
<TD ><bean:write name="processus" property="nom" /></TD>
<TR>
</logic:iterate>

si je met <TR class ="cssclass"> c est toutes les ligne qui seront mis en style

**Swoög** · 22/05/2006, 20h06

si tu en as la possibilité, tu peux toujours faire un petit truc en JS :

Code :

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

1
2
3
4
5
6
7
function set_classes(var id_table, var pair_color, var odd_color)
{
    var liste = document.getElementById(id_table).getElementsByTagName('td');
    for(var i = 0; i &lt; liste.length; ++i)
       if((i % 2) == 0) liste[i].style.backgroundColor = pair_color;
       else liste[i].style.backgroundColor = odd_color;
}

puis

Code :

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

<body onload="set_classes('id_de_la_table', '#FFFFFF', '#000000')">

**MicroPuce** · 23/05/2006, 14h37

Salut,
Je sais pas si le logic:iterate definit un compteur (l'equivalent d'un varstatus pour un c:forEach) que tu utilise avec un modulo 2 comme te l'a présenté Swoög en javascript pour ecrire pair ou impair (je crois que c'est l'attribut indexId, mais à tester).
Et si t'as pas de compteur dispo, alors tu crée un bean (bean:define ?)qui fera office de compteur, à charge pour toi de l'incrémenter...
A pluche

**SpaceFrog** · 23/05/2006, 14h48

oui Swoog +1 jallais proposer une boucle légèrement différente

Code :

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

1
2
3
4
5
6
 function set_classes(id_table, pair_color, odd_color){
    var liste = document.getElementById(id_table).getElementsByTagName('tr');
    for(var i = 0; i < liste.length; i++){
       liste[i].style.backgroundColor = (i%2==0)?pair_color:odd_color;
}
}

à noter qu'on boucle sur les tr et pas les td ...

**abdess6600** · 23/05/2006, 16h50

oui ta raison Micropuce voila ou j ai trouvé la solution
http://www.developpez.net/forums/sho...=ligne+couleur

pour résolu je veus tager mais le compte abdess n est plus actif j espere que le moderateur le fera pour moi .

merci les gars.

tableau qui a deux couleur pour les lignes <td>

HTML

Discussions similaires

Partager

Partager