changer couleur ligne tableau [Résolu]

xouzi · 18/08/2011, 10h28

Bonjour,

J'aimerai que quand je passe ma souris sur une ligne de mon tableau la couleur change. J'utilise un code simple en JS mais sa ne fonctionne pas.

Code pour changer de couleur

Code :

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

1
2
3
4
5
6
7
8
9
10
11
<script type="text/javascript">
function changeCouleur(ligne)
  {
  ligne.bgColor = '#C0C0C0';
  }
 
function remetCouleur(ligne)
  {
  ligne.bgColor = '#FFFFFF';
  }
</script>

Code tableau ASP :

Code :

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

1
2
response.write"<table  cellspacing='0' cellspacing='0' id='tb' class='tb'>"
response.write"<tr id='aff_"&i&"' onMouseOver=""changeCouleur(this);"" onMouseOut=""remetCouleur(this);"">"

Mon tableau ce rempli grace a une boucle.

Le code source généré

Code :

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

1
2
<table  cellspacing='0' cellspacing='0' id='tb' class='tb'>
<tr id='aff_1' onMouseOver="changeCouleur(this);" onMouseOut="remetCouleur(this);">

andry.aime · 18/08/2011, 11h51

Bonsoir,

Essaye avec

Code :

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

ligne.style.backgroundColor = '#C0C0C0';

A+.

xouzi · 18/08/2011, 11h57

Sa change rien

andry.aime · 18/08/2011, 12h06

Ce code fonctionne chez moi (tester sous IE et FF)

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
html>
<head>
<script type="text/javascript">
function changeCouleur(ligne)
  {
	ligne.style.backgroundColor = '#C0C0C0';
  }
 
function remetCouleur(ligne)
  {
	ligne.style.backgroundColor = '#FFFFFF';
  }
</script>
</head>
<body>
<table>
	<tr onmouseover="changeCouleur(this);" onmouseout="remetCouleur(this)">
		<td>blabla</td>
		<td>blabla</td>
	</tr>
	<tr onmouseover="changeCouleur(this);" onmouseout="remetCouleur(this)">
		<td>blabla</td>
		<td>blabla</td>
	</tr>
</table>
</body>
</html>

xouzi · 18/08/2011, 12h46

Donc le JS et bon sa doit venir de l'ASP alors pourtant la page html généré parrait correct

Mon tableau et dans un scrollbar est ce que sa peut avoir une explication? Sinon sa peut pas venir de l'id?

andry.aime · 18/08/2011, 12h53

ça ne doit pas venir du scrollbar.
Tes balises sont biens fermé? Ton Javascript est dans le même fichier?
Peut-on voir un peu plus sur ton code HTML généré?

PS: met tous tes attributs en minuscule.

A+.

xouzi · 18/08/2011, 13h47

Les lignes doivent changer de couleur dans mon deuxiemes tableaux .
J'ai essayer de faire au plus cour:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<html>
<head>
<title>Principal</title>
<link rel='stylesheet' type='text/css' href='style.css' /> 
<script src='functions_saisie.js' type='text/javascript'></script>
</head>
<body>
 
<script type="text/javascript"> 
function changeCouleur(ligne)
  {
	ligne.style.backgroundColor = '#C0C0C0';
  }
 
function remetCouleur(ligne)
  {
	ligne.style.backgroundColor = '#FFFFFF';
  }
 
 
</script>
 
 
<table  cellpadding='0' cellspacing='0' id='tb_p' class='tb_p'>
	<tr>
		<th class='tb_parc_entete_test'><nobr>Valid</nobr></th>
		<th class='tb_parc_entete_2'><nobr>Jour</nobr></th><th class='tb_p_1'><nobr>Date</nobr></th>
	</tr>
</table>
<div class='scrollbar_vertical'>
	<p style='direction:ltr'>
		<table  cellspacing='0' cellspacing='0' id='tb' class='tb'>
			<tr id='aff_ligne_1' onmouseover="changeCouleur(this);" onmouseout="remetCouleur(this)">
				<td class='tb_2'>
					<a href="javascript:aff_zones('1')" title="Modifier la saisie" ><img src="img/ico_act_modif.gif" /></a>
				<td bgcolor='#FFFFFF'  style=''>
					LUN.
				</td>
			</tr>
			<tr id='aff_ligne_3' onmouseover="changeCouleur(this);" onmouseout="remetCouleur(this)">
				<td class='tb_2'>
					<a href="javascript:aff_zones('3')" title="Modifier la saisie" ><img src="img/ico_act_modif.gif"/></a>
				</td>
				<td bgcolor='#FFFFFF'  style=''>
					MAR.
				</td>
			</tr>
		</table>
	</p>
</div>
</body>
</html>

andry.aime · 18/08/2011, 13h58

Remplace

Citation:

par

Code :

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

<td   style='backgroundColor :#FFFFFF'>

A+.

xouzi · 18/08/2011, 14h19

Je l'ai enlever sa marche Vue que maintenant c'est géré par les fonctions

18/08/2011, 11h51	#2
andry.aime Rédacteur/Modérateur Andry Aimé Inscription : septembre 2007 Messages : 5 129 Détails du profil Informations personnelles : Nom : Andry Aimé Localisation : Ile Maurice Informations forums : Inscription : septembre 2007 Messages : 5 129 Points : 7 260 Points : 7 260	Bonsoir, Essaye avec Code : Sélectionner tout - Visualiser dans une fenêtre à part ligne.style.backgroundColor = '#C0C0C0'; A+.
	00

18/08/2011, 11h57	#3
xouzi Membre régulier Inscription : janvier 2011 Messages : 283 Détails du profil Informations forums : Inscription : janvier 2011 Messages : 283 Points : 96 Points : 96	Sa change rien
	00

18/08/2011, 12h46	#5
xouzi Membre régulier Inscription : janvier 2011 Messages : 283 Détails du profil Informations forums : Inscription : janvier 2011 Messages : 283 Points : 96 Points : 96	Donc le JS et bon sa doit venir de l'ASP alors pourtant la page html généré parrait correct Mon tableau et dans un scrollbar est ce que sa peut avoir une explication? Sinon sa peut pas venir de l'id?
	00

18/08/2011, 12h53	#6
andry.aime Rédacteur/Modérateur Andry Aimé Inscription : septembre 2007 Messages : 5 129 Détails du profil Informations personnelles : Nom : Andry Aimé Localisation : Ile Maurice Informations forums : Inscription : septembre 2007 Messages : 5 129 Points : 7 260 Points : 7 260	ça ne doit pas venir du scrollbar. Tes balises sont biens fermé? Ton Javascript est dans le même fichier? Peut-on voir un peu plus sur ton code HTML généré? PS: met tous tes attributs en minuscule. A+.
	00

18/08/2011, 14h19	#9
xouzi Membre régulier Inscription : janvier 2011 Messages : 283 Détails du profil Informations forums : Inscription : janvier 2011 Messages : 283 Points : 96 Points : 96	Je l'ai enlever sa marche Vue que maintenant c'est géré par les fonctions
	00

Outils de la discussion
Afficher une version imprimable Envoyer un lien vers cette page par email