[c#] Changer la couleur d'éléments d'une table html

Version imprimable

bonsoir,
j'aurais besoin, sur un click d'un CheckBoxList de changer la couleur de fond de lignes d'une table html.

J'ai défini les éléments de la table html comme ceci :
Code:

1 2 3 4 5 6 7 <table style="..."> <tr> <td style="..."> <id="t_cbl_q_01_11"> ... </td> <td style="..." id="t_cbl_q_01_12"> ...
J'ai défini un événement javascript onclick sur le CheckBoxList :
Code:

1 2 3 4 <asp:CheckBoxList ID="cbl_q_01" onclick="PassageCbl('cbl_q_01')" runat="server" TabIndex="3" Width="286px"> <asp:ListItem Value="0">Non</asp:ListItem> <asp:ListItem Value="1">Oui </asp:ListItem> </asp:CheckBoxList>
J'ai écrit la fonction javascript dans la section html comem ceci :
Code:

1 2 3 4 5 function PassageCbl(Source) { document.all("t_" + Source + "_11").bgColor="magenta"; document.all("t_" + Source + "_11").bgColor="magenta"; }
Là il ne se passe rien quand on clique sur le CheckBoxList.

Quelqu'un a-t-il déjà fait ça ?

Merci ;)

12/12/2006, 08h26
pcdj

l'événement javascript onclick " n'appartient pas " par défaut au control CheckBoxList.
Il faut l'ajouter dans le code par exemple dans le form_load de cette manière :

Code:

this.cbl_q_01.Attributes.Add("onclick", "PassageCbl('cbl_q_01')")

et tu le supprimes du code HTML.

Par contre dans ta fonction javascript, tu effectues deux fois la même action,
et comme tu codes en dure le numéro "_11" le changement de couleur se fera toujours sur la même cellule...
12/12/2006, 09h18
Filippo
Citation:

Envoyé par pcdj

l'événement javascript onclick " n'appartient pas " par défaut au control CheckBoxList.
Il faut l'ajouter dans le code par exemple dans le form_load de cette manière :

Code:

this.cbl_q_01.Attributes.Add("onclick", "PassageCbl('cbl_q_01')")

et tu le supprimes du code HTML.

Par contre dans ta fonction javascript, tu effectues deux fois la même action,
et comme tu codes en dure le numéro "_11" le changement de couleur se fera toujours sur la même cellule...

Merci pcdj,
je me suis trompé le premier appel portait sur le numéro_11, l'autre sur _12.

J'ai déjà utilisé le déclenchement de onclick d'un CheckBoxList pour appeler une fonction javascript qui produisait une alerte.

Avec l'ajout de

Code:

this.cbl_q_01.Attributes.Add("onclick", "PassageCbl('cbl_q_01')")

dans le form load j'obtiens un message "error on page" sur click dans cbl_q_01.

Sans cet ajout dans le form load mais en modifiant la fonction comme ceci ça marche, mais juste pour le checkboxlist. Je cherche à atteindre la ligne du tableau dans laquelle le CheckBoxList est situé.
Code:

1 2 3 4 function PassageCbl(Source) { document.all(Source).bgColor="magenta"; document.all(Source).fgColor="white"; }
12/12/2006, 10h38
pcdj

C'est bizarre, je l'ai testé et je n'ai pas cette erreur chez moi.

teste ce bout de code les éléments importants sont dans le js

Code:

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
 
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<script>
function laction(child)
{
<div style="margin-left:40px">//la case à cocher
child.setAttribute("style","background-color:green;");
 
//la cellule
cellule = child.parentNode;
cellule.setAttribute("style","background-color:Yellow;color:Green;");
//la ligne
ligne = cellule .parentNode;
ligne.setAttribute("style","background-color:Blue;color:Green;");</div>}
</script>
 
</head>
<body>
<form>
<table id="table">
<div style="margin-left:40px"><tr id="tr1">
<div style="margin-left:40px"><td id="td1">
td1
</td>
<td id="td2">
td2
<input type="checkbox" id="pass" onclick="laction(this)"/>
</td></div></tr>
<tr id="tr2">
<div style="margin-left:40px"><td id="td3">
td3
</td>
<td id="td4">
td4
</td></div></tr></div></table>
    </form>
</body>
</html>

je suppose que c sa que tu veux