[DOM] menu dynamique php mysql javascript

**maxland** · 13/03/2009, 18h02

bonjour a tous, voila j'ai fait un menu vertical en php mysql,
les rubriques principales sont ecrites dans le code mais les
sous rubriques, pouvant changer, sont recuperées de la base
grace a un while.

le probleme c'est que c'est pas tres joli, donc j'aurais aimé savoir
comment faire pour cacher/afficher les sous rubriques quand on clique
sur une des rubriques principales ...

merci d'avance

ps: pour ceux qui doutent, oui j'ai cherché sur google et ici mais y a trop de resultats presque identiques et pas de bonnes explications ou les codes ne
fonctionnent pas

voici une partie de mon code :

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
 
<table cellpadding="0" cellspacing="0" width="192">
	<tr></br>
		<td class="rubrique" align=left onmouseover="this.className='on';" onmouseout="this.className='off';" class="off" >
			<font size="3px">
				<a href="rayons/sac.php" target="main" style="color: black;text-decoration:none;"><b> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Sacs à main </b></a>
 
			</font>
		</td>
	</tr>	
 
	<tr>
<?  while ($sam = mysql_fetch_array($reqsam))
{ echo '<tr><td align=left class="sous-rubrique" onmouseover="this.className="on";" onmouseout="this.className="off";" class="off">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
<a href=" rayons/sous-rayons.php?type='. $sam['TYPE_CODE'] .' " target="main" style="color: black;text-decoration:none;"> '.$sam['TYPE_LIBEL'].' </a></td></tr>';
} ?></tr>

**emmanuel.remy** · 14/03/2009, 19h41

Salut,

Peut-être es tu obligé de passer par une structure de table. Voilà un petit code que je viens d'écrire et qui passe par rapport à ce que tu demandes (c'est juste une piste pour te montrer la démarche, ne te contente surtout pas d'un copier-coller de ce code):

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
 
<html>
 
<body>
<script type="text/javascript">
 
 
function dispSSRub(td /* la cellule cliquée */) {
  //la ligne de la rubrique
  tr = td.parentNode;
  //on cherche le TR suivant, celui des sous-rubriques
  while ((tr=tr.nextSibling).tagName != "TR") ;
 
  var disp = tr.style.display;
  tr.style.display = (disp=='' ? 'none' :'');
}
</script>
 
<table border="1">
 <tr>
  <td onclick="dispSSRub(this);">Sport</td>
 </tr>
 <tr>
  <td>
    <table>
     <tr>
      <td>VOLLEY</td>
      <td>TENNIS</td>
      <td>FOOT</td>
     </tr>
    </table>  
  </td>
 </tr>
 
 <tr>
  <td onclick="dispSSRub(this);">Lecture</td>
 </tr>
 <tr>
  <td>
    <table>
     <tr>
      <td>Policier</td>
      <td>Sciences-Fiction</td>
      <td>Poesie</td>
     </tr>
    </table>  
  </td>
 </tr>
 
</table> 
</body> 
</html>

Pour le coup il me semble qu'une structure de liste HTML

Code :

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

1
2
3
4
5
 
UL
  LI
  LI
  LI

Est plus adaptée

Regarde par exemple par ici pour une idée de réalisation: http://msdn.microsoft.com/en-us/libr...46(VS.85).aspx

ERE

**maxland** · 15/03/2009, 13h27

je te remercies pour ta reponse mais je comprends pas ton code

,
et de toutes façons il faut utiliser ajax apparement

bon tant pis et encore merci quand meme

**emmanuel.remy** · 15/03/2009, 14h02

Ajax n'a rien à voir la dedans. C'est uniquement une question de HTML, CSS et Javascript. Et effectivement il reste difficile de réaliser ce genre d'outils sans connaitre le DOM, Javascript, etc...

ERE

[DOM] menu dynamique php mysql javascript

JavaScript

Vue hybride

Discussions similaires

Partager

Partager