Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1809 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Menu dynamique

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

Menu dynamique

n°1316777
jenny50
Posté le 02-03-2006 à 10:46:00  profilanswer
 

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 :
  1. <script language="javascript">
  2. window.onload = montre;
  3. function montre(id)
  4. {
  5. var d = document.getElementById(id);
  6. for (var i=1; i<=10; i++)
  7.  {
  8.  if (document.getElementById('smenu'+ i))
  9.   {
  10.   document.getElementById('smenu'+ i).style.display = 'none';
  11.   }
  12.  }
  13.  if(d)
  14.   {
  15.   d.style.display = 'block';
  16.   }
  17. }
  18. </script>


Et voici celui qui se trouve dans mon body :  

Code :
  1. <dl id="menu">
  2.          <?
  3.          $sql = " SELECT cat_cle, cat_lib FROM categorie WHERE cat_lib LIKE '%20%' ORDER BY cat_lib DESC ";
  4.          $qry = pg_query($conn, $sql);
  5.          while ($result = pg_fetch_assoc($qry))
  6.           {
  7.          ?>
  8.           <dt onClick="javascript:montre('smenu');"><a href="#"><?=$result['cat_lib']?></a></dt>
  9.           <?
  10.           $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 ";
  11.           $qry2 = pg_query($conn, $sql2);
  12.           while ($result2 = pg_fetch_assoc($qry2))
  13.            {
  14.            $clefile = $result2['doc_file'];
  15.           ?>
  16.            <dd id="smenu">
  17.             <ul>
  18.              <li>
  19.               <a href="../admin/file.php?cle=<?=$result2['doc_cle']?>&oid=<?=$clefile?>&doc_type=<?=$result2['doc_type']?>" target="bodemer">
  20.                <?=$result2['doc_lib']?>
  21.               </a>
  22.              </li>
  23.             </ul>
  24.            </dd>
  25.           <?
  26.            }
  27.           }
  28.           ?>
  29.         </dl>


 
Avez-vous une solution??

mood
Publicité
Posté le 02-03-2006 à 10:46:00  profilanswer
 

n°1316790
Bidem
Posté le 02-03-2006 à 11:01:42  profilanswer
 

Montre nous plutot le code HTML généré (celui que tu obtients en faisant "Afficher la source" )

n°1316822
jenny50
Posté le 02-03-2006 à 11:37:38  profilanswer
 

ok le voici  
 

Code :
  1. <dl id="menu">
  2.                     <dt onClick="javascript:montre('smenu');"><a href="#"> 2006 </a></dt>
  3.            <dd id="smenu">
  4.             <ul>
  5.                           <li>
  6.               <a href="../admin/file.php?cle=5&oid=0&doc_type=1" target="bodemer">
  7.                n° 24 - Février               </a>
  8.              </li>
  9.                          </ul>
  10.            </dd>
  11.                      <dt onClick="javascript:montre('smenu');"><a href="#"> 2005  </a></dt>
  12.            <dd id="smenu">
  13.             <ul>
  14.                           <li>
  15.               <a href="../admin/file.php?cle=30&oid=42159&doc_type=1" target="bodemer">
  16.                n° 23 - Décembre                </a>
  17.              </li>
  18.                           <li>
  19.               <a href="../admin/file.php?cle=9&oid=42158&doc_type=1" target="bodemer">
  20.                n° 22 - Septembre               </a>
  21.              </li>
  22.                           <li>
  23.               <a href="../admin/file.php?cle=4&oid=42118&doc_type=1" target="bodemer">
  24.                n° 21 - Juin               </a>
  25.              </li>
  26.                           <li>
  27.               <a href="../admin/file.php?cle=2&oid=42117&doc_type=1" target="bodemer">
  28.                n° 20 - Avril               </a>
  29.              </li>
  30.                           <li>
  31.               <a href="../admin/file.php?cle=6&oid=42116&doc_type=1" target="bodemer">
  32.                n° 19 - Février               </a>
  33.              </li>
  34.                          </ul>
  35.            </dd>
  36.                      <dt onClick="javascript:montre('smenu');"><a href="#"> 2004  </a></dt>
  37.            <dd id="smenu">
  38.             <ul>
  39.                           <li>
  40.               <a href="../admin/file.php?cle=8&oid=42163&doc_type=1" target="bodemer">
  41.                n° 18 - Décembre               </a>
  42.              </li>
  43.                           <li>
  44.               <a href="../admin/file.php?cle=10&oid=42166&doc_type=1" target="bodemer">
  45.                n° 17 - Septembre                </a>
  46.              </li>
  47.                           <li>
  48.               <a href="../admin/file.php?cle=11&oid=42164&doc_type=1" target="bodemer">
  49.                n° 16 - Juin                </a>
  50.              </li>
  51.                           <li>
  52.               <a href="../admin/file.php?cle=12&oid=42162&doc_type=1" target="bodemer">
  53.                 n° 15 - Avril                </a>
  54.              </li>
  55.                           <li>
  56.               <a href="../admin/file.php?cle=13&oid=42161&doc_type=1" target="bodemer">
  57.                 n° 14 - Février                </a>
  58.              </li>
  59.                          </ul>
  60.            </dd>
  61.                      <dt onClick="javascript:montre('smenu');"><a href="#"> 2003 </a></dt>
  62.            <dd id="smenu">
  63.             <ul>
  64.                           <li>
  65.               <a href="../admin/file.php?cle=14&oid=42115&doc_type=1" target="bodemer">
  66.                n° 13 - Octobre               </a>
  67.              </li>
  68.                           <li>
  69.               <a href="../admin/file.php?cle=17&oid=42114&doc_type=1" target="bodemer">
  70.                n° 11 - Janvier               </a>
  71.              </li>
  72.                           <li>
  73.               <a href="../admin/file.php?cle=16&oid=42160&doc_type=0" target="bodemer">
  74.                 n° 12 - Juin                </a>
  75.              </li>
  76.                          </ul>
  77.            </dd>
  78.                      <dt onClick="javascript:montre('smenu');"><a href="#"> 2002  </a></dt>
  79.            <dd id="smenu">
  80.             <ul>
  81.                           <li>
  82.               <a href="../admin/file.php?cle=27&oid=33929&doc_type=1" target="bodemer">
  83.                n°10 - Septembre                </a>
  84.              </li>
  85.                           <li>
  86.               <a href="../admin/file.php?cle=28&oid=33928&doc_type=1" target="bodemer">
  87.                n° 9 - Juin                </a>
  88.              </li>
  89.                           <li>
  90.               <a href="../admin/file.php?cle=26&oid=33930&doc_type=1" target="bodemer">
  91.                n° 8 - Avril                </a>
  92.              </li>
  93.                           <li>
  94.               <a href="../admin/file.php?cle=25&oid=42113&doc_type=1" target="bodemer">
  95.                n° 7 - Février                </a>
  96.              </li>
  97.                          </ul>
  98.            </dd>
  99.                      <dt onClick="javascript:montre('smenu');"><a href="#"> 2001 </a></dt>
  100.            <dd id="smenu">
  101.             <ul>
  102.                           <li>
  103.               <a href="../admin/file.php?cle=24&oid=42112&doc_type=1" target="bodemer">
  104.                n° 6 - Décembre                </a>
  105.              </li>
  106.                           <li>
  107.               <a href="../admin/file.php?cle=23&oid=42111&doc_type=1" target="bodemer">
  108.                n° 5 - Septembre                </a>
  109.              </li>
  110.                           <li>
  111.               <a href="../admin/file.php?cle=22&oid=42110&doc_type=1" target="bodemer">
  112.                n° 4 - Juin                </a>
  113.              </li>
  114.                           <li>
  115.               <a href="../admin/file.php?cle=20&oid=42109&doc_type=1" target="bodemer">
  116.                n° 3 - Avril               </a>
  117.              </li>
  118.                          </ul>
  119.            </dd>
  120.                      <dt onClick="javascript:montre('smenu');"><a href="#"> 2000 </a></dt>
  121.            <dd id="smenu">
  122.             <ul>
  123.                           <li>
  124.               <a href="../admin/file.php?cle=19&oid=42107&doc_type=1" target="bodemer">
  125.                n° 2 - Décembre                </a>
  126.              </li>
  127.                           <li>
  128.               <a href="../admin/file.php?cle=29&oid=42157&doc_type=1" target="bodemer">
  129.                n° 1 - Septembre                </a>
  130.              </li>
  131.                          </ul>
  132.            </dd>


 
Il faut que j'indique un chiffre ici "onClick="javascript:montre('smenu???');"" mais il faut que ce soit dynamique et non en dure c'est là que je bloque


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  Menu dynamique

 

Sujets relatifs
[Résolu][Html/Javascript] Liens dans menu déroulant dynamiquerendre un menu dynamique et non statique
[MFC] Menu dynamiquePb menu + site dynamique (tableaux)
Menu dynamique besoin d'aide !améliorer mon menu dynamique
menu dynamiqueHELP, Menu déroulant dynamique avec PHP [RESOLU]
Menu déroulant dynamique mysql 
Plus de sujets relatifs à : Menu dynamique


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR