Cacher/Afficher une ligne de tableau

Version imprimable

Bonjour

J'ai le code JS suivant :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
function cacher(){
			var champs = document.getElementsByTagName('input');
			for(var i=0;i<champs.length;i++) {
				var c = champs[i];
				if(c.type.toLowerCase( )== 'checkbox' && c.name == 'demi' && c.checked){
					document.getElementById('test').style.display = "block";
				}
				else{
					document.getElementById('test').style.display = "none";
				}
			}
		}

Normalement il me permet de cacher/afficher la ligne d'un tableau lorsque je coche/décoche une checkbox :

Code:

1
2
3
4
5
6
7
...
matin <input type="checkbox" name="demi" value="matin" onClick="javascript:cacher();" /> apr&egrave;s-midi <input type="checkbox" name="demi" value="am" onClick="javascript:cacher();" />
						</td>
					</tr>
					<tr id="test">
						<td>Date de fin</td>
...

Le fait de cocher une case me cache bien la ligne. Par contre le fait de la décocher n'affiche pas à nouveau la ligne.

Que faut-il faire?

Merci

28/11/2011, 18h41
Bovino

Code:

document.getElementById('test').style.display = "block";

Le display d'une balise <tr> ,'est pas block mais table-row, qui n'est pas reconnu par tous les navigateurs.
Le plus simple est d'attribuer une chaine vide qui rétablira la valeur par défaut :

Code:

document.getElementById('test').style.display = "";

Ceci dit, je doute fort que le code fonctionne si tu coches le premier checkbox...
29/11/2011, 08h38
Baldy

Le fait de mettre une chaîne vide ne change rien, la ligne du tableau ne s'affiche toujours pas. Même chose avec "table-row".

Du coup je me demande si il faudrait que je cache autre chose que le TR du tableau ...
29/11/2011, 10h35
bigboomshakala

mets des alert() dans ton code et tu comprendras tout de suite le problème :aie:

ta ligne ne réapparaîtra que si tu coches les 2 checkbox
29/11/2011, 10h45
Bovino

Reste aussi à savoir si "test" est bien un id unique dans la page.
29/11/2011, 10h51
Baldy

On m'avait que les tableaux HTML c'était le démon!

Finalement j'ai revu ma mise en page, j'utilise maintenant les P et DIV et évidemment ça marche beaucoup mieux.

Je vous ai embêté pour rien.
29/11/2011, 11h19
bigboomshakala

:roll: je ne suis pas certain que tu ais compris l'erreur. ça n'est pas une question de tableau démoniaque.

tu boucles sur tous les checkbox "demi" de la page et tu affiches la ligne si le checkbox est checké, sinon tu masques la ligne. ton code s'applique chaque fois aux 2 checkbox... le display de la ligne est modifiée 2 fois à chaque sélection/désélection de checkbox (par exemple une fois pour faire afficher la ligne et une fois pour la masquer direct derrière. donc tu as l'impression qu'elle ne réapparait jamais)