div id et affichage de tableau javascript + Struts

**littlebear** · 27/01/2009, 12h12

Bonjour,

Mon souci étant que je souhaiterais afficher un deuxième tableau juste en dessou d'un premier tableau. Ce deuxième tableau apparaitrait lorsque l'on click sur une colonne lien du premier tableau.

J'ai essayé de faire un test (AffichePopup('popup1','OK')

mais il ne semble pas vouloir cacher l'élément dans le div.
Voici mon code javascript :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<script language="javascript">
function AffichePopup(id, action) {
	var d = document.getElementById(id);
	if (d.style.display == "")	{
			d.style.display = "block";
		} else {
			d.style.display = "";
		} 
 
}
</script>

Voici mon code jsp:

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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
 
<tbody>
  <tr>
     <logic:iterate id="MIFetatACAV" name="ListEtatACAV" >
  <tr>
     <td align="center"><bean:write name="MIFetatACAV" property="idsupport"/></td>
     <td align="center"><bean:write name="MIFetatACAV" property="libellecourt"/></td>				
     <td align="center"><bean:write name="MIFetatACAV" property="valeur"/></td>					
     <td align="center"><bean:write name="MIFetatACAV" property="montantacavp"/></td>
     <td align="center"><bean:write name="MIFetatACAV" property="montantacava"/></td>	
     <td align="center">
        <a href="#" onclick="javascript:AffichePopup('TableauFluxAcav','OK');return false;">
       <html:link action="initEtatACAV" paramName="MIFetatACAV" paramId="idacavattente" paramProperty="idacavattente">		
	<bean:write name="MIFetatACAV" property="montantacavattente"/>
       </html:link></a></td>
       <logic:present name="cache" scope="session">
	<td align="center"><bean:write name="MIFetatACAV" property="idacavattente"/></td>	
       </logic:present>					   
     </tr>
       </logic:iterate>
     </tr>							
</tbody>	
<tfoot>
     <tr class="tdhead">
        <td colspan="1" class="table-page:1 cursor:pointer text-align:right" width="5%" id="first"><<</td>
        <td colspan="1" class="table-page:previous cursor:pointer text-align:right" width="5%" id="previous"><</td>
        <td colspan="2" style=text-align:center;>Page <script language="javascript">document.write(t1page+"/"+t1pages)</script></td>
        <td colspan="1" class="table-page:next cursor:pointer;text-align:right;" width="5%" id="next">></td>
        <td colspan="1" class="table-page:t1pages cursor:pointer;text-align:right;" width="5%" id="end">>></td>
     </tr>
</tfoot>
<!-- Fin du tableau ACAV-->
<!-- Début du tableau FLUXACAV-->
<!-- Debut Test Div -->          
<td><a href="#" onclick="javascript:AffichePopup('popup1','OK');return false;">999.999.999,99</a></td>
<div id="popup1" > test </div> 				
<!-- Fin Test Div -->
<!-- Affichage du tableau -->
<logic:equal property="hasResultFlux" name="mifRechercheFluxActionForm"  value="true" > 
<div id="TableauFluxAcav">
						<table class="table-autopage:6 table-page-number:t1page table-page-count:t1pages table-stripeclass:alternative tablelist">
					                 <thead>
					                 <p></p>
					                 <p></p>
					           		<tr class="tdhead1">
										<td colspan="14"><i>Support 1 : Flux comptabilisés pour l'ACAV en attente</i></td>
									</tr>	
					                 <tr class="tdhead">
 
									<td colspan="2"><bean:message key="num.flux"/></td>
									<td><bean:message key="type.date.valeur"/></td>
									<td><bean:message key="label.montant"/></td>
									<td><bean:message key="parts.pro"/></td>
									<td><bean:message key="cours.pro"/></td>
									<td><bean:message key="parts.def"/></td>
									<td><bean:message key="cours.def"/></td>
									<td><bean:message key="label.di"/></td>
									<td><bean:message key="label.rf"/></td>
									<td><bean:message key="label.statut"/></td>
									<td><bean:message key="label.type"/></td>
									<td colspan="2"><bean:message key="label.support"/></td>
								</tr>
		                   	    </thead>
							<logic:notEmpty name="mifRechercheFluxActionForm" property="listResult" >
 
		                   	   <tbody>
									<tr>
										<logic:iterate id="ligneFlux" name="mifRechercheFluxActionForm" property="listResult" type="intCommunBean.flux.MifResultRechercheFluxBean" indexId="index" >
										<tr>
									<td colspan="2">
									<html:link action="initEtatACAV" paramName="ligneFlux" paramId="numeroFlux" paramProperty="numeroFlux">
										<bean:write name="ligneFlux" property="numeroFlux"/></html:link> </td>
									<td><bean:write name="ligneFlux" property="strValeur"/></td> 
									<td><bean:write name="ligneFlux" property="montant"/></td>
									<td><bean:write name="ligneFlux" property="partsPro"/></td>
									<td><bean:write name="ligneFlux" property="coursPro"/></td>
									<td><bean:write name="ligneFlux" property="partsDef"/></td>
									<td><bean:write name="ligneFlux" property="coursDef"/></td>
									<td><bean:write name="ligneFlux" property="di"/></td>
									<td><bean:write name="ligneFlux" property="rf"/></td>
									<td><bean:write name="ligneFlux" property="typeStatut"/></td>
 
									<td><bean:write name="ligneFlux" property="type"/></td>
									<td colspan="2"><bean:write name="ligneFlux" property="support"/></td> 
									</tr>
        				                </logic:iterate>
								</tr>
							</tbody>	
 
							</logic:notEmpty>
 
							<tfoot>
								<tr class="tdhead">
									<td colspan="1" class="table-page:1 cursor:pointer text-align:right" width="5%" id="first"><<</td>
									<td colspan="1" class="table-page:previous cursor:pointer text-align:right" width="5%" id="previous"><</td>
									<td colspan="10" style=text-align:center;>Page <script language="javascript">document.write(t1page+"/"+t1pages)</script></td>
									<td colspan="1" class="table-page:next cursor:pointer;text-align:right;" width="5%" id="next">></td>
									<td colspan="1" class="table-page:t1pages cursor:pointer;text-align:right;" width="5%" id="end">>></td>
								</tr>
							</tfoot>
						</table>
 
					</div>

Quelqu'un pour m'expliquer où est l'erreur svp?

**Bovino** · 27/01/2009, 12h27

D'abord, merci de poster le code HTML généré.
Ensuite :

Code :

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

1
2
3
4
5
if (d.style.display == "none")	{
			d.style.display = "block";
		} else {
			d.style.display = "none";
		}

**littlebear** · 27/01/2009, 12h56

Envoyé par Bovino

D'abord, merci de poster le code HTML généré.
Ensuite :

Code :

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

1
2
3
4
5
if (d.style.display == "none")	{
			d.style.display = "block";
		} else {
			d.style.display = "none";
		}

Bonjour,

Alors le code html généré de la page partielle:

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
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
 
					<div>
						<div >
							<table class="table-autopage:6 table-page-number:t1page table-page-count:t1pages table-stripeclass:alternative tablelist">
								<thead>
									<tr class="tdhead">
 
										<td>N° / 2    lignes</td>  
										<td>Support</td>
										<td>VL</td>										
										<td>Passif</td>
										<td >Actif</td>
										<td >En attente</td>
<!-- 										<td >id acav attente</td>  -->
 
									</tr>
			                   	</thead>
 
			                   	<tbody>
									<tr>
 
 
											<tr>
				<!-- 							   <td>INTetatACAV.etatACAV.metier.entite.MIFetatACAVPk@145c414</td>  -->
 
 
												<td align="center">1</td>
											   <td align="center">support1</td>										   
											   <td align="center">10</td>											   
											   <td align="center">123.0</td>
											   <td align="center">4137435.45</td>	
											   <td align="center">
											   <a href="#" onclick="javascript:AffichePopup('AfficheTableauAcav','OK');return false;">
												<a href="/INTCLINFOC/initEtatACAV.do?idacavattente=1"><!-- 											   <a href="#" onclick="javascript:afficherListFluxEtatAcav(--><!-- %=2%>);return false;">  -->										   
<!-- 											    456545.45</a></td>  -->
<!-- 												456545.45 -->
												456545.45</a></a></td>
 
 
 
											</tr>
 
 
											<tr>
				<!-- 							   <td>INTetatACAV.etatACAV.metier.entite.MIFetatACAVPk@14c02d4</td>  -->
 
 
												<td align="center">2</td>
											   <td align="center">support2</td>										   
											   <td align="center">10</td>											   
											   <td align="center">2.0</td>
											   <td align="center">4.555554444E9</td>	
											   <td align="center">
											   <a href="#" onclick="javascript:AffichePopup('AfficheTableauAcav','OK');return false;">
												<a href="/INTCLINFOC/initEtatACAV.do?idacavattente=2"><!-- 											   <a href="#" onclick="javascript:afficherListFluxEtatAcav(--><!-- %=2%>);return false;">  -->										   
<!-- 											    6.54546546464E11</a></td>  -->
<!-- 												6.54546546464E11 -->
												6.54546546464E11</a></a></td>
 
 
 
											</tr>
 
									</tr>									
								</tbody>	
 
 
							<tfoot>
								<tr class="tdhead">
									<td colspan="1" class="table-page:1 cursor:pointer text-align:right" width="5%" id="first"><<</td>
									<td colspan="1" class="table-page:previous cursor:pointer text-align:right" width="5%" id="previous"><</td>
									<td colspan="2" style=text-align:center;>Page <script language="javascript">document.write(t1page+"/"+t1pages)</script></td>
									<td colspan="1" class="table-page:next cursor:pointer;text-align:right;" width="5%" id="next">></td>
									<td colspan="1" class="table-page:t1pages cursor:pointer;text-align:right;" width="5%" id="end">>></td>
								</tr>
							</tfoot>
                		<div id="espace">&nbsp;</div>
 
                		<!-- Fin du tableau ACAV-->
 
                		<!-- Début du tableau FLUXACAV-->
				<!-- Debut Moteur de recherche -->          
				<td><a href="#" onclick="javascript:AffichePopup('popup1','OK');return false;">999.999.999,99</a></td> 
 
				<div id="popup1" style="display:visible"> test </div> 				
 
				<!-- Fin Moteur de recherche -->
 
				<!-- Affichage du tableau -->
 
 
 
      					<div id="AfficheTableauAcav">
						<table class="table-autopage:6 table-page-number:t1page table-page-count:t1pages table-stripeclass:alternative tablelist">
					                 <thead>
					                 <p></p>
					                 <p></p>
					           		<tr class="tdhead1">
										<td colspan="14"><i>Support 1 : Flux comptabilisés pour l'ACAV en attente</i></td>
									</tr>	
					                 <tr class="tdhead">
 
									<td colspan="2">Numéro</td>
									<td>Valeur</td>
									<td>Montant</td>
									<td>Parts Pro</td>
									<td>Cours pro</td>
									<td>Parts Def</td>
									<td>Cours Def</td>
									<td>D.I.</td>
									<td>R.F.</td>
									<td>Statut</td>
									<td>Type</td>
									<td colspan="2">Support</td>
								</tr>
		                   	    </thead>
 
 
		                   	   <tbody>
									<tr>
 
										<tr>
									<td colspan="2">
									<a href="/INTCLINFOC/initEtatACAV.do?numeroFlux=3">3</a> </td>
									<td>05/01/2009</td> 
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>A Négocier                                                                                                                                                                                                                                                     </td>
 
									<td>1                                                                                                                                                                                                                                                              </td>
									<td colspan="2">support2</td> 
									</tr>
 
										<tr>
									<td colspan="2">
									<a href="/INTCLINFOC/initEtatACAV.do?numeroFlux=4">4</a> </td>
									<td>06/01/2009</td> 
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>A Négocier                                                                                                                                                                                                                                                     </td>
 
									<td>1                                                                                                                                                                                                                                                              </td>
									<td colspan="2">support2</td> 
									</tr>
 
										<tr>
									<td colspan="2">
									<a href="/INTCLINFOC/initEtatACAV.do?numeroFlux=7">7</a> </td>
									<td>07/01/2009</td> 
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>1.0</td>
									<td>A Négocier                                                                                                                                                                                                                                                     </td>
 
									<td>1                                                                                                                                                                                                                                                              </td>
									<td colspan="2">support2</td> 
									</tr>
 
								</tr>
							</tbody>	
 
 
 
							<tfoot>
								<tr class="tdhead">
									<td colspan="1" class="table-page:1 cursor:pointer text-align:right" width="5%" id="first"><<</td>
									<td colspan="1" class="table-page:previous cursor:pointer text-align:right" width="5%" id="previous"><</td>
									<td colspan="10" style=text-align:center;>Page <script language="javascript">document.write(t1page+"/"+t1pages)</script></td>
									<td colspan="1" class="table-page:next cursor:pointer;text-align:right;" width="5%" id="next">></td>
									<td colspan="1" class="table-page:t1pages cursor:pointer;text-align:right;" width="5%" id="end">>></td>
								</tr>
							</tfoot>
						</table>
 
					</div>
 
					<!-- Fin du tableau -->

Et en rajoutant none, ça ne fait pas de changement. ça reste affiché sans même avoir clické sur le lien.

**Bovino** · 27/01/2009, 13h39

Code :

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

<div id="popup1" style="display:visible"> test </div>

display: visible, ça n'existe pas, c'est block, inline ou none pour les propriétés les plus courantes.

**littlebear** · 27/01/2009, 14h34

Envoyé par Bovino

Code :

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

<div id="popup1" style="display:visible"> test </div>

display: visible, ça n'existe pas, c'est block, inline ou none pour les propriétés les plus courantes.

D'accord mais ce que je ne comprend pas c'est que le script est le suivant :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<script language="JavaScript">
function AffichePopup(id, action) {
	var d = document.getElementById(id);
if (d.style.display == "none")	{
			d.style.display = "block";
		} else {
			d.style.display = "none";
		}
}
 
 
</script>

La ligne qui permet d'appeler la fonction est la suivante :

Code :

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

1
2
3
4
5
6
7
8
 
											   <a href="#" onclick="javascript:AffichePopup('AfficheTableauAcav','OK');return false;">
												<html:link action="initEtatACAV" paramName="MIFetatACAV" paramId="idacavattente" paramProperty="idacavattente">											  
												<bean:write name="MIFetatACAV" property="montantacavattente"/>
												</html:link></a></td>
												<logic:present name="cache" scope="session">
												<td align="center"><bean:write name="MIFetatACAV" property="idacavattente"/></td>	
												</logic:present>

Et le contenu du div qui devrait apparaitre après un click sur le lien est le suivant :

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
 
	   					<div id="AfficheTableauAcav">
						<table class="table-autopage:6 table-page-number:t1page table-page-count:t1pages table-stripeclass:alternative tablelist">
					                 <thead>
					                 <p></p>
					                 <p></p>
					           		<tr class="tdhead1">
										<td colspan="14"><i>Support 1 : Flux comptabilisés pour l'ACAV en attente</i></td>
									</tr>	
					                 <tr class="tdhead">
 
									<td colspan="2"><bean:message key="num.flux"/></td>
									<td><bean:message key="type.date.valeur"/></td>
									<td><bean:message key="label.montant"/></td>
									<td><bean:message key="parts.pro"/></td>
									<td><bean:message key="cours.pro"/></td>
									<td><bean:message key="parts.def"/></td>
									<td><bean:message key="cours.def"/></td>
									<td><bean:message key="label.di"/></td>
									<td><bean:message key="label.rf"/></td>
									<td><bean:message key="label.statut"/></td>
									<td><bean:message key="label.type"/></td>
									<td colspan="2"><bean:message key="label.support"/></td>
								</tr>
		                   	    </thead>
							<logic:notEmpty name="mifRechercheFluxActionForm" property="listResult" >
 
		                   	   <tbody>
									<tr>
										<logic:iterate id="ligneFlux" name="mifRechercheFluxActionForm" property="listResult" type="intCommunBean.flux.MifResultRechercheFluxBean" indexId="index" >
										<tr>
									<td colspan="2">
									<html:link action="initEtatACAV" paramName="ligneFlux" paramId="numeroFlux" paramProperty="numeroFlux">
										<bean:write name="ligneFlux" property="numeroFlux"/></html:link> </td>
									<td><bean:write name="ligneFlux" property="strValeur"/></td> 
									<td><bean:write name="ligneFlux" property="montant"/></td>
									<td><bean:write name="ligneFlux" property="partsPro"/></td>
									<td><bean:write name="ligneFlux" property="coursPro"/></td>
									<td><bean:write name="ligneFlux" property="partsDef"/></td>
									<td><bean:write name="ligneFlux" property="coursDef"/></td>
									<td><bean:write name="ligneFlux" property="di"/></td>
									<td><bean:write name="ligneFlux" property="rf"/></td>
									<td><bean:write name="ligneFlux" property="typeStatut"/></td>
 
									<td><bean:write name="ligneFlux" property="type"/></td>
									<td colspan="2"><bean:write name="ligneFlux" property="support"/></td> 
									</tr>
        				                </logic:iterate>
								</tr>
							</tbody>	
 
							</logic:notEmpty>
 
							<tfoot>
								<tr class="tdhead">
									<td colspan="1" class="table-page:1 cursor:pointer text-align:right" width="5%" id="first"><<</td>
									<td colspan="1" class="table-page:previous cursor:pointer text-align:right" width="5%" id="previous"><</td>
									<td colspan="10" style=text-align:center;>Page <script language="javascript">document.write(t1page+"/"+t1pages)</script></td>
									<td colspan="1" class="table-page:next cursor:pointer;text-align:right;" width="5%" id="next">></td>
									<td colspan="1" class="table-page:t1pages cursor:pointer;text-align:right;" width="5%" id="end">>></td>
								</tr>
							</tfoot>
						</table>
 
					</div>

Pour tester l'affichage d'un div j'ai fait ça :

Code :

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

1
2
3
 
				<td><a href="#" onclick="javascript:AffichePopup('popup1','OK');return false;">999.999.999,99</a></td> 
				<div id="popup1" > test </div>

normalement si je click sur le lien 999.999.999,99 il devrait m'afficher test, n'est ce pas? Or moi, test est déjà affiché quand je vais sur la page.

J'ai essayé de mettre

Code :

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

1
2
 
<div id="popup1" style="display:none;"> test </div>

Mais toujours rien, il ne s'affiche pas lorsque l'on click.

**Matthieu2000** · 27/01/2009, 15h03

As tu autorisé l'application des feuille de style?

**Bovino** · 27/01/2009, 15h08

Alors, quelques conseils :
* Lorsque tu postes du code, étant donné que nous sommes dans la section JavaScript, le code serveur ne nous intéresse pas, il nous faut le code HTML généré (qui permet d'ailleurs de déceler des erreurs de syntaxe en langage serveur)
* Fais attention à l'indentation, j'imagine que tu comprendras facillement que les morceaux de code que tu as postés plus haut ne donnent pas très envie de les regarder... puisqu'on ne les voit pas.

Concernant ton souci, ce code fonctionne très bien chez moi...

Code html :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<style type="text/css">
</style>
<script type="text/javascript"> 
<!--// [CDATA[ 
function AffichePopup(id, action) {
        var d = document.getElementById(id);
        if (d.style.display == "none")  {
                        d.style.display = "block";
                } else {
                        d.style.display = "none";
                } 
 
}
// ]] -->
</script> 
</head>
<body>
<div id="container">
<a href="#" onclick="AffichePopup('popup1','OK');return false;">999.999.999,99</a>
<div id="popup1" style="display:none"> test </div>
</div>
</body>
</html>

**littlebear** · 27/01/2009, 15h17

Envoyé par Matthieu2000

As tu autorisé l'application des feuille de style?

bonjour,

que veux tu dire par là? Appeler le fichier contenant les CSS?
comme ceci?

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
 
<head>
	<title><bean:message key="title.name"/></title>
 
	<link rel="stylesheet" type="text/css" media="screen" title="1024x768"
		href="./styles/MIF_main.css" />
	<link rel="stylesheet" type="text/css" media="screen" title="cadre"
		href="./styles/MIF_cadre.css" />
	<link rel="stylesheet" type="text/css" media="screen" title="menu"
		href="./styles/MIF_menu.css" />
	<link rel="stylesheet" type="text/css" href="./styles/datepicker.css" />
 
	<script type="text/javascript" src="./scripts/datepicker.js"></script>
	<script type="text/javascript" src="./scripts/styleswitcher.js"></script>
	<script type="text/javascript" src="./scripts/table.js"></script>
	<script type="text/javascript" src="./scripts/script.js"></script>
</head>

oui.. enfin si ça répond à ta question.

**littlebear** · 27/01/2009, 15h21

Envoyé par Bovino

Alors, quelques conseils :
* Lorsque tu postes du code, étant donné que nous sommes dans la section JavaScript, le code serveur ne nous intéresse pas, il nous faut le code HTML généré (qui permet d'ailleurs de déceler des erreurs de syntaxe en langage serveur)
* Fais attention à l'indentation, j'imagine que tu comprendras facillement que les morceaux de code que tu as postés plus haut ne donnent pas très envie de les regarder... puisqu'on ne les voit pas.

Concernant ton souci, ce code fonctionne très bien chez moi...

Code html :

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
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Test</title>
<style type="text/css">
</style>
<script type="text/javascript"> 
<!--// [CDATA[ 
function AffichePopup(id, action) {
        var d = document.getElementById(id);
        if (d.style.display == "none")  {
                        d.style.display = "block";
                } else {
                        d.style.display = "none";
                } 
 
}
// ]] -->
</script> 
</head>
<body>
<div id="container">
<a href="#" onclick="AffichePopup('popup1','OK');return false;">999.999.999,99</a>
<div id="popup1" style="display:none"> test </div>
</div>
</body>
</html>

Ok pour le code côté client
et ok pour faire ressortir la partie la plus importante du code par rapport à la question.
Ok ton code fonctionne bien sous une page html quelconque par contre dans ma page jsp quenéni... , test tout comme mon second tableau enfin sans le contenu s'affiche dès l'arrivée sur la page.
Je vais essayer de décortiquer ça pour voir où c'est à la ramasse.

Ok, si je met le code avant le </body>, test apparait lorsque l'on click sur le lien par contre mon second tableau s'affiche toujours directement dès l'ouverture de la page..

**Bovino** · 27/01/2009, 16h14

test tout comme mon second tableau enfin sans le contenu s'affiche dès l'arrivée sur la page.

Il faut leur affecter un display none dès le départ. (Dans les feuilles de style ou dans un attribut style).
Ensuite, si ça ne fonctionne pas, vérifie qu'il n'y ai pas de doublon au niveau des id ou des déclarations CSS.

**littlebear** · 27/01/2009, 17h24

Envoyé par Bovino

Il faut leur affecter un display none dès le départ. (Dans les feuilles de style ou dans un attribut style).
Ensuite, si ça ne fonctionne pas, vérifie qu'il n'y ai pas de doublon au niveau des id ou des déclarations CSS.

Pour l'affectation à un display none c'est fait :
style="display:none"

Ce que je constate c'est que je n'arrive pas à faire afficher la
<div id="popup2" style="display:none"> popup2 </div>

lorsque <div id="popup2" style="display:none"> popup2 </div> se trouve en dessou du </tr>

exemple :

Code html :

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
 
<tbody>
<tr>
<tr>
<td align="center">1</td>
<td align="center">support1</td>					<td align="center">10</td>					<td align="center">123.0</td>
             <td align="center">4137435.45</td>	
             <td align="center">
		<a href="#" onclick="javascript:AffichePopup('AfficheTableauAcav1','OK');return false;">
		<a href="/INTCLINFOC/initEtatACAV.do?idacavattente=1">456545.45</a></a></td>
 
//  -->	<div id="container">
//  -->    <a href="#" onclick="AffichePopup('popup2','OK');return false;">999.999.999,991</a>
//  -->    </div>
	</tr>
<tr>
<td align="center">2</td>
<td align="center">support2</td>				
<td align="center">10</td>					
<td align="center">2.0</td>
<td align="center">4.555554444E9</td>	
<td align="center">
<a href="#" onclick="javascript:AffichePopup('AfficheTableauAcav1','OK');return false;">
<a href="/INTCLINFOC/initEtatACAV.do?idacavattente=2">6.54546546464E11</a></a></td>
 
//  -->	<div id="container">
//  -->    <a href="#" onclick="AffichePopup('popup2','OK');return false;">999.999.999,991</a>
//  -->     </div>
</tr>
</tr>	
//  --> <div id="popup2" style="display:none"> popup2 </div> 			</tbody>

**Bovino** · 27/01/2009, 17h44

Tu ne lui aurais pas affecté un visibility: hidden en plus par hasard ?

**littlebear** · 27/01/2009, 18h19

Envoyé par Bovino

Tu ne lui aurais pas affecté un visibility: hidden en plus par hasard ?

Nope. Pas de visibility:hidden, juste

Code :

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

1
2
 
<div id="popup2" style="display:none"> popup2 </div>

**littlebear** · 28/01/2009, 12h01

Envoyé par Bovino

Tu ne lui aurais pas affecté un visibility: hidden en plus par hasard ?

Alors c_nvy ma suggéré ceci :

Code :

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

<div id="AfficheTableauAcav" style="visibility:hidden">

et dans la fonction Javascript :

Code :

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

document.getElementById(id).style.visibility="visible";

[/

Mais aucun changement. C'est étrange.

**Bovino** · 28/01/2009, 12h03

Tu as un exemple en ligne ?

**littlebear** · 28/01/2009, 15h35

Envoyé par Bovino

Tu as un exemple en ligne ?

Un exemple? De?
ça revient au même si j'utilise du display:none ou du visibility: hidden
hormis la place réservée.

Je sais pas pourquoi mais ça doit merder au niveau des div ou tr, td.
Pourtant je ne pense pas avoir oublié de fermer une balise.

**Bovino** · 28/01/2009, 16h44

Envoyé par Bovino

Tu as un exemple en ligne ?

De ta page qui fonctionne pas

**littlebear** · 28/01/2009, 17h16

Envoyé par Bovino

De ta page qui fonctionne pas

En ligne non, mais il se pourrait que ce soit à cause d'une réinitialisation de liste qui me manque dans un actionform enfin faut que je vois si ça vient de ça.

**Matthieu2000** · 29/01/2009, 10h17

div id et affichage de tableau javascript + Struts

JavaScript

Discussions similaires

Partager

Partager