[PostGreSQL] menu dynamique php-postgre-css

**tyrann** · 01/11/2005, 13h04

Bonjour a tous, debutant en php, c'est un cours que je recois a l'ecole...

j'ai un projet a faire pour fin decembre. j'ai decidé de "refaire" un ebay. toute facon c'est a titre privé.

Venons-en au fait, je voudrais faire un joli menu vertical dynamique qui contiendra les categories et lorsqu'on clique, les sous categories.

ma base de donnée est en postgreSql, j'utilise des styles css.

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
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
<?php session_start();?>
<head>
<title>Menu vertical</title>
<link rel="stylesheet" href="./style.css" />
 
<script type="text/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>
</head>
 
<body>
 
<dl id="menu">
<?php 		
	include ('connect.php');
	$queryparent = "select * from projet.categorie where id_categorie = id_categorie_parent";
	$resultparent = pg_exec($cnx,$queryparent);
	if(!$resultparent)
	{
		echo("Echec de la requete: $queryparent");
		exit();
	}
	else
	{
		$i=0;
		while($listeparent = @pg_fetch_array($resultparent,$i++))
		{
			echo("<dt onClick=\"javascript:montre('smenu$listeparent[id_categorie]');\">$listeparent[nom]</dt>");
			$queryenfant = "select * from projet.categorie where id_categorie_parent = $listeparent[id_categorie] AND id_categorie <> id_categorie_parent";
			$resultenfant = pg_exec($cnx,$queryenfant);
			if(!$resultenfant)
			{
				echo("Echec de la requete: $queryenfant");
				exit();
			}
			else
			{
				echo("");
				echo("<dd id=\"smenu+$i\">
				<ul>
				");
				$j=0;
				while($listeenfant = @pg_fetch_array($resultenfant,$j++))
				{
					echo("<li><a href=\"tagada.html\">$listeenfant[nom]</a></li>
					");
				}
				echo("</ul>
				</dd>
				");
			}
		}
	}
	?>
</dl>
 
</body>
</html>

ma feuille de style :

mon probleme :

mon menu est "ouvert" des l'ouverture de la page alors qu'il faudrait cliquer sur la categorie principale pour que ca s'ouvre... je comprends pas pourquoi ca fait ca!
Je pense que le code est assez simple, et ca fonctionne lorsqu'il n'y a pas de php dedans! donc c'est bien moi qui ai mis le souc mais je ne trouve pas comment

Je peux poster un screenshot du resultat si c'est nécessaire.

Un grand merci d'avance

**tyrann** · 02/11/2005, 09h57

personne???????

**vg33** · 02/11/2005, 10h41

Il faut que tes sous-menus soient en 'display:none' à l'ouverture de la page. A la rigueur, tu peux faire un javascript affectant ce style à tous les sous-menus lors de l'événement onLoad.
Mais le mieux à mon avis est la solution suivante :
1) Tu récupères toutes les données concernant les menus en une seule requête, et tu les stoque dans une variable. Au passage, cela va t'économiser un bon nombre de requêtes.
2) Tu affectes tout le code html du menu dans une variable. A chaque nouvel id, tu affectes la variable contenant les css avec :

Code :

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

$css.='#ton_id {display:none;}'

3) Tu affiches ensuite ta variable css dans le <head>, et ton menu à la bonne place.
Cela t'évite d'afficher puis de cacher tous les sous-menus au chargement de la page, ce qui visulellement est beaucoup plus agréable.

**tyrann** · 02/11/2005, 11h35

Meci beaucoup pour ta reponse,

Je suis tres debutant dans tout ca, j'apprends seulement a l'ecole... j'ai été repiquer un code gratuit sur le net et modifié a ma guise avec le php.

Ceci voulant dire que tu viens de me parler en russe avec ce que tu me proposes de faire!

Je n'attends aucunement qu'on le fasse a ma place, par contre si t'as un p'tit exemple sous la main, ce serait super

En attandant, je cherche toujours, j'ai vu que tu me disais que je devais appliquer 'display:none' a l'ouverture, mais c'est ce que j'ai fait il me semble!
a l'ouverture :

Code :

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

window.onLoad=montre; // j'appelle la fonction sans identifiant

dans la fonction montre :

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
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'; //tout est "refermé" dans cette boucle
         } 
      } 
   if (d) // si j'ai envoyé un sous menu
   { 
      d.style.display='block'; // je l'affiche
   } 
}

On sait deboguer du javascript???

Si oui, avec quel outil? comme ca je pourrais voir qu'est-ce qu'il envoi reellement dans cette fonction!

**tyrann** · 02/11/2005, 11h44

C'est bon, on laisse tomber :trouve:

admirez l'erreur de M****

J'adore le PHP car il a pas besoin de mettre des petits "+" dans les chaines pour dire qu'on met une variable...

Je suis un javateur moi

Code :

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

echo("<dd id=\"smenu+$i\">

C'est mieux comme ceci

Code :

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

echo("<dd id=\"smenu$i\">

autrement dit, lors de la verification dans la fonction, pour le premier sous menu par exemple, j'envoyait smenu+1 au lieu de smenu1

de votre aide et a bientot surement

**vg33** · 02/11/2005, 11h51

Envoyé par tyrann

En attandant, je cherche toujours, j'ai vu que tu me disais que je devais appliquer 'display:none' a l'ouverture, mais c'est ce que j'ai fait il me semble!
a l'ouverture :

Code :

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

window.onLoad=montre; // j'appelle la fonction sans identifiant

On sait deboguer du javascript???

Si oui, avec quel outil? comme ca je pourrais voir qu'est-ce qu'il envoi reellement dans cette fonction!

Tu dois appeller une fonction de la façon suivante :

Code :

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

nom_fonction(arg1, arg2...);

S'il n'y a pas d'argument, tu dois quand même indiquer les parenthèses (c'est la seule façon pour javascript de différencier une fonction d'une variable).
Tu dois donc écrire :

Code :

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

montre();

Ensuite, je te conseille de mettre l'événement onLoad dans le body :

Code :

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

<body onload="montre();">

Envoyé par tyrann

On sait deboguer du javascript???

Si oui, avec quel outil? comme ca je pourrais voir qu'est-ce qu'il envoi reellement dans cette fonction!

Js est très dur à débugger. Mais tu peux utiliser la console javascript de Firefox, et le débugger javascript du même Firefox. Ce sont 2 extensions gratuites à télécharger. Bref, si tu n'as pas encore FireFox, tu sais ce qu'il te reste à faire

**tyrann** · 02/11/2005, 17h23

merci merci, mais ca fonctionne tres bien comme ca tu sais!!!

je vais t'ouver que j'ai plus envie de chipoter

por firefox... bien sur que j'utilise ca! pourquoi faire compliqué quand on sait faire simple

core merci, je vais aller chercher apres les extensions... @++

[PostGreSQL] menu dynamique php-postgre-css [PostgreSQL]

PHP & Base de données

Discussions similaires

Partager

Partager