Rendre une colonne invisible en javascript

**benkunz** · 06/11/2008, 16h13

salut,

j'essaie en javascript de rendre une colonne d'un tableau invisible. avec une ligne pas de probleme, ca marche bien :

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
 
<html>
 
<head>
<script type="text/javascript">
function hideIt()
{
document.getElementById("col2").style.visibility="collapse";
}
</script>
</head>
 
<body>
 
 
	<table border='1'>
		<tr id='col2'>
			<td>1</td>
			<td>2</td>
			<td>3</td>
			<td>4</td>
		</tr>
		<tr>
			<td>_1</td>
			<td>_2</td>
			<td>_3</td>
			<td>_4</td>
		</tr>		
		<tr>
			<td>1_</td>
			<td>2_</td>
			<td>3_</td>
			<td>4_</td>
		</tr>		
	</table>
 
<form>
<input type="button" onclick="hideIt()" value="Hide">
</form>
 
</body>
 
</html>

mais les colones je n'arrive pas a les cacher. si vous avez une idée, je suis preneur

merci

**SpaceFrog** · 06/11/2008, 17h26

une boucle avec pour depart le nr de la colonne concernée, un step egal au nombre de colonne, et cette boucle scanne la collection des td pour les basculer en display:none

**bigboomshakala** · 06/11/2008, 23h07

piste

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
<html>
	<head>
		<script>
function load(){
	var table = document.getElementById("maTable");
	if (table.attachEvent){
		table.attachEvent("onclick",toggle);
	}
	else{
		table.addEventListener("click",toggle,false);
	}
}
 
function toggle(e){
	var i = 0;
	var rows = document.getElementById("maTable").rows;
	while(rows[i]){
		var style = rows[i].cells[1].style;
		style.display = style.display=="none" ? "block" : "none";
		i++;
	}
}
 
(function(){
	if (window.attachEvent){
		window.attachEvent("onload",load);
	}
	else{
		window.addEventListener("load",load,false);
	}
})();
		</script>
	</head>
	<body>
			<table id="maTable">
				<tr>
					<td>un tableau 1</td>
					<td>un tableau 2</td>
					<td>un tableau 3</td>
				</tr>
				<tr>
					<td>un tableau 1</td>
					<td>un tableau 2</td>
					<td>un tableau 3</td>
				</tr>
				<tr>
					<td>un tableau 1</td>
					<td>un tableau 2</td>
					<td>un tableau 3</td>
				</tr>
				<tr>
					<td>un tableau 1</td>
					<td>un tableau 2</td>
					<td>un tableau 3</td>
				</tr>
				<tr>
					<td>un tableau 1</td>
					<td>un tableau 2</td>
					<td>un tableau 3</td>
				</tr>
				<tr>
					<td>un tableau 1</td>
					<td>un tableau 2</td>
					<td>un tableau 3</td>
				</tr>
			</table>
	</body>
</html>

Rendre une colonne invisible en javascript

JavaScript

Discussions similaires

Partager

Partager