2
Hi,
I am trying to make a multi-level drop-down menu similar to what is seen here: http://www.cssplay.co.uk/menus/simple_vertical.html. My problem is that some of the menu will be populated from a database.
My menu will be structured as follows:
The first setion of the menu is hard-coded (the home and management sections). The rest of the menu will be populated from a database.
The top level links (categories) will come from one table in the database. When you hover over these categories, the second level list of genuses that come under that category will appear (the gnuses are in another table of the database). Then, when you hover over the genuses, the third level list of species filed under that genus will appear (the species are also in their own table).
Currently, I am just viewing it as a list, with the CSS to make it into a menu. I got the menu working with only two levels, but when I added the code for the third level, the list displayed correctly for the first top-level category, the first genus to come under that category and the species that came under that genus. The rest of the list displays in the right order down the page, but not in the right hierarchical order due to code being put in the wrong place by the php script.
This is the code that I am using:
[PHP]
<?php require_once('Connections/plantDB.php'); ?>
<?php
mysql_select_db($database_plantDB, $plantDB);
$menu_categories = mysql_query("SELECT `CategoryID`,`CategoryName` FROM `pdb_categories`")
or die(mysql_error());
?>
<ul id="nav">
<li><a href="index.php">Home</a></li>
<li>Management
<ul>
<li>Insert
<ul>
<li><a href="insert/insert_category.php">Insert Category</a></li>
<li><a href="insert/insert_genus.php">Insert Genus</a></li>
<li><a href="insert/insert_species.php">Insert Species</a></li>
</ul>
</li>
<li>Update
<ul>
<li><a href="update/update_category.php">Update Category</a></li>
<li><a href="update/update_genus.php">Update Genus</a></li>
<li><a href="update/update_species.php">Update Species</a></li>
</ul>
</li>
</ul>
</li>
<?
while ($resultset = mysql_fetch_assoc($menu_categories))
{
$Category=$resultset['CategoryName'];
CategoryID=$resultset['CategoryID'];
echo "<li>";
echo "<a href='category_details.php?CategoryID=$CategoryID' >$Category</a>";
echo "<ul>";
/* Get list of genus */
$menu_genus = mysql_query("SELECT `GenusID`,`GenusName`,`GenusCategoryID` FROM `pdb_genus` WHERE GenusCategoryID='$CategoryID'");
while ($resultset2 = mysql_fetch_assoc($menu_genus))
{
$GenusID=$resultset2['GenusID'];
$GenusName=$resultset2['GenusName'];
echo "<li>";
echo "<a href='genus_details.php?GenusID=$GenusID'>$GenusNa me</a>";
/* Get list of species */
$menu_species = mysql_query("SELECT `PlantID`,`PlantScientificName`,`PlantGenusID` FROM `pdb_species` WHERE PlantGenusID='$GenusID'");
while ($resultset3 = mysql_fetch_assoc($menu_species))
{
$PlantID=$resultset3['PlantID'];
$PlantName=$resultset3['PlantScientificName'];
echo "<ul>";
echo "<li>";
echo "<a href='plant_details.php?PlantID=$PlantID'>$PlantNa me</a>";
echo "</li>";
}
echo "</ul>";
echo "</li>";
echo "</ul>";
}
echo "</li>";
}?>
</ul>
[/PHP]
Below is the code that is rendered in the browser:
[HTML]
<ul id="nav">
<li><a href="index.php">Home</a></li>
<li>Management
<ul>
<li>Insert
<ul>
<li><a href="insert/insert_category.php">Insert Category</a></li>
<li><a href="insert/insert_genus.php">Insert Genus</a></li>
<li><a href="insert/insert_species.php">Insert Species</a></li>
</ul>
</li>
<li>Update
<ul>
<li><a href="update/update_category.php">Update Category</a></li>
<li><a href="update/update_genus.php">Update Genus</a></li>
<li><a href="update/update_species.php">Update Species</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='category_details.php?CategoryID=1'>Category 1</a>
<ul>
<li><a href='genus_details.php?GenusID=1'>G1C1</a>
<ul>
<li><a href='plant_details.php?PlantID=1'>Species1G1C1</a></li>
</ul>
</li>
</ul>
<li><a href='genus_details.php?GenusID=2'>G2C1</a>
</ul>
</li>
</ul>
</li>
<li><a href='category_details.php?CategoryID=2'>Category 2</a>
<ul>
<li><a href='genus_details.php?GenusID=3'>G1C2</a>
</ul>
</li>
</ul>
</li>
<li><a href='category_details.php?CategoryID=3'>Category 3</a>
<ul>
<li><a href='genus_details.php?GenusID=4'>G1C3</a>
</ul>
</li>
</ul>
<li><a href='genus_details.php?GenusID=5'>G2C3</a>
<ul>
<li><a href='plant_details.php?PlantID=2'>Species1G2C3</a></li>
</ul>
</li>
</ul>
<li><a href='genus_details.php?GenusID=6'>G3C3</a>
</ul>
</li>
</ul>
</li>
<li>
<a href='category_details.php?CategoryID=4'>Category 4</a>
<ul>
</li>
</ul>
[/HTML]
This is the code that I need the browser to render for the menu to work:
[HTML]
<ul id="nav">
<li><a href="index.php">Home</a></li>
<li>Management
<ul>
<li>Insert
<ul>
<li><a href="insert/insert_category.php">Insert Category</a></li>
<li><a href="insert/insert_genus.php">Insert Genus</a></li>
<li><a href="insert/insert_species.php">Insert Species</a></li>
</ul>
</li>
<li>Update
<ul>
<li><a href="update/update_category.php">Update Category</a></li>
<li><a href="update/update_genus.php">Update Genus</a></li>
<li><a href="update/update_species.php">Update Species</a></li>
</ul>
</li>
</ul>
</li>
<li><a href='category_details.php?CategoryID=1'>Category 1</a>
<ul>
<li><a href='genus_details.php?GenusID=1'>G1C1</a>
<ul>
<li><a href='plant_details.php?PlantID=1'>Species1G1C1</a></li>
</ul>
</li>
<li><a href='genus_details.php?GenusID=2'>G2C1</a>
</ul>
</li>
<li><a href='category_details.php?CategoryID=2'>Category 2</a>
<ul>
<li><a href='genus_details.php?GenusID=3'>G1C2</a>
</ul>
</li>
<li><a href='category_details.php?CategoryID=3'>Category 3</a>
<ul>
<li><a href='genus_details.php?GenusID=4'>G1C3</a></li>
<li><a href='genus_details.php?GenusID=5'>G2C3</a>
<ul>
<li><a href='plant_details.php?PlantID=2'>Species1G2C3</a></li>
</ul>
</li>
<li><a href='genus_details.php?GenusID=6'>G3C3</a>
</ul>
</li>
<li> <a href='category_details.php?CategoryID=4'>Category 4</a> </li>
</ul>
[/HTML]
I am hoping that it is possible for this to work. I just can't work out what to do to fix it.
Any help is appreciated. Thanks,
Joel
