Discussion :

[jenny50]

Bonjour à tous,

Je suis en train de faire un menu verticale dynamique aliant javascript, CSS et php... Le menu s'affiche bien avec mes catégorie et sous catégories (issues de ma bdd). La mise en page est OK avec mes CSS. Le hic : le JS!!

Voici mon problème. Quand je clique sur 1 catgéorie le principe et que toutes les autres se ferment et celle cliquée s'ouvre. Là elle sont toutes ouvertes. Alors qu'au départ tout devrait être fermé.

Voici mon code JS :

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
<script language="javascript">
window.onload = montre;
function montre(id)
	{
	var d = document.getElementById(id);
	for (var i=1; i<=10; i++)
		{
		if (document.getElementById('smenu'+ i))
			{
			document.getElementById('smenu'+ i).style.display = 'none';
			}
		}
		if(d)
			{
			d.style.display = 'block';
			}
	}
</script>

Et voici celui qui se trouve dans mon body :

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
<dl id="menu">
										<?
										$sql = " SELECT cat_cle, cat_lib FROM categorie WHERE cat_lib LIKE '%20%' ORDER BY cat_lib DESC ";
										$qry = pg_query($conn, $sql);
										while ($result = pg_fetch_assoc($qry))
											{
										?>
											<dt onClick="javascript:montre('smenu');"><a href="#"><?=$result['cat_lib']?></a></dt>
											<?
											$sql2 = " SELECT doc_cle, doc_lib, doc_type, doc_file, doc_date, doc_cat FROM documents WHERE doc_cat=".$result['cat_cle']." ORDER BY doc_lib DESC ";
											$qry2 = pg_query($conn, $sql2);
											while ($result2 = pg_fetch_assoc($qry2))
												{
												$clefile = $result2['doc_file'];
											?>
												<dd id="smenu">
													<ul>
														<li>
															<a href="../admin/file.php?cle=<?=$result2['doc_cle']?>&oid=<?=$clefile?>&doc_type=<?=$result2['doc_type']?>" target="bodemer">
																<?=$result2['doc_lib']?>
															</a>
														</li>
													</ul>
												</dd>
											<?
												}
											}
											?>
									</dl>

Avez-vous une solution??[/code]

[denisC]

<dd id="smenu">

Il faut rajouter un nombre ici.....

cf
http://www.developpez.net/forums/viewtopic.php?t=463967

[jenny50]

oui je me doute bien mais j'ai du mal. Merci pour le lien je vais voir ce que je peux faire.

[NeHuS]

Salut ,

en effet tu fais une boucle pour tout cacher ( style.display = 'none'; )

mais tes menus ont tous le meme id
document.getElementById('smenu'+ i) en loccurence i = 1 ne correpond a aucun id ...
il faudrait comme l'a dit denisC que tu leur rajoutes quelquechose pour les diferencier un index serait une bonne idée

Code :

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

1
2
3
4
5
6
7
8
9
10
 
 $i = 1;
 while ($result2 = pg_fetch_assoc($qry2))
                                    {
 
                                    $clefile = $result2['doc_file'];
                                 ?>
                                    <dd id="smenu <? $i ?>"> 
                                      <? $i++; ?>
...

Quelque chose dans le genre... j'suis pas un pro du php

(c'est rare de voir des personnes utiliser les tags dl dt et dd )