Cacher ligne de tableau avec 2 cellules

Version imprimable

bonjours,

voici mon code 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
<script type="text/javascript">
function show_form(){
	hide_form();
	var Tpe = document.getElementById("0").value;
 
	if (Tpe=="team"){
		document.getElementById("5").style.visibility="visible";
		document.getElementById("5").style.display="block";
 
	}
	else if (Tpe=="player"){
		document.getElementById("6").style.visibility="visible";
		document.getElementById("6").style.display="block";
	}
}
 
function hide_form(){
 
	document.getElementById("5").style.visibility="hidden";
	document.getElementById("5").style.display="none";
	document.getElementById("6").style.visibility="hidden";
	document.getElementById("6").style.display="none";
}
</script>

et mon code html:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
<table width=100%>
		<tr><td>Vous cherchez: <br><br></td><td>
		<select name="type" onChange="show_form()" id="0">
		<option></option>
		<option name="team" value="team">Une &eacute;quipe</option>
		<option name="player" value="player">Un joueur</option>
		<option name="coach" value="coach">Un coach</option>
		<option name="agent" value="agent">Un agent</option>
		</select></td></tr>
		<tr id="5"><td>test1</td><td><input type="text" name="title" size=50%></td></tr>
		<tr id="6"><td>test2</td><td><input type="text" name="title" size=50%></td></tr>
<tr><td width=10%>Message: </td><td ><textarea name="content" cols=100% rows=35></textarea></td></tr>
<tr><td></td><td align="left"><input type="submit" value="Publier"></td></tr></table>

pas de promlème lors du onload ca cache bien les 2 ligne mais malheureusement lorsque je choisi team par exemple la ligne apparai bien mais s'affiche complètement décalé comme si tout la ligne ne se mettai que dans une seule cellule.

Que faire?

D'avance merci

EDIT:
en image
avant:
http://www.hecpirate.ch/pdf/toto1.png
après:
http://www.hecpirate.ch/pdf/toto2.png

Salut,

Et comme ça:

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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
 
<html>
<head>
<title></title>
<script type="text/javascript">
function show_form(){
	hide_form();
	var Tpe = document.getElementById("0").value;
 
	if (Tpe=="team"){
		//document.getElementById("5").style.visibility="visible";
		document.getElementById("5").style.display="";
 
	}
	else if (Tpe=="player"){
		//document.getElementById("6").style.visibility="visible";
		document.getElementById("6").style.display="";
	}
}
 
function hide_form(){
 
	//document.getElementById("5").style.visibility="hidden";
	document.getElementById("5").style.display="none";
	//document.getElementById("6").style.visibility="hidden";
	document.getElementById("6").style.display="none";
}
</script>
</head>
<body onload="hide_form()">
   <table width="100%" border="1">
		<tr>
            <td>Vous cherchez: <br><br>
            </td>
            <td>
        		<select name="type" onChange="show_form()" id="0">
            		<option></option>
            		<option name="team" value="team">Une &eacute;quipe</option>
            		<option name="player" value="player">Un joueur</option>
            		<option name="coach" value="coach">Un coach</option>
            		<option name="agent" value="agent">Un agent</option>
        		</select>
          </td>
        </tr>
		<tr id="5">
            <td>test1</td>
            <td><input type="text" name="title" size="50%"></td>
        </tr>
		<tr id="6">
            <td>test2</td>
            <td><input type="text" name="title" size="50%"></td>
        </tr>
        <tr>
            <td width="10%">Message: </td>
            <td ><textarea name="content" cols="100" rows="35"></textarea></td>
        </tr>
        <tr>
            <td></td>
            <td align="left"><input type="submit" value="Publier"></td>
        </tr>
  </table>
</body>
</html>

12/07/2008, 17h27
Auteur
pour compléter ce qu'à écrit jlmag :
- Utilise soit l'attribut visibility ou display mais pas les deux.
- Les cellules ne sont pas des objets block comme les div par exemple. Donc il est préférable comme jlmag l'a écrit dans son code de faire :
Code:

1 2 document.getElementById("6").style.display="";
pour que la cellule prenne son style par défaut.
13/07/2008, 14h46
swissmade

merci beaucoup a vous 2 :king: