Self Populating Navigation

[lil_bugga]

On the image below are the results im trying to achieve both visually and operationally. When books is clicked the navigation panel expands to show 2nd level navigation. When another link is clicked on it will close books and if it has 2nd level navigation will expand.

 

This navigation was achieved using this tutorial http://www.tutorials-db.com/articles/Coding_a_Smooth_CSS_Expanding_Navigation/

 

 

The lower of the 2 part image shows my actual results. I've got as far as I can with it so am hoping that someone can help steer me down the right path. I'm new to PHP so I'm happy to have got this far.

 

My thinking for the code below was

 

[*]create $max to store highest id no. from store_cats

[*]create $counter = 1

[*]start loop whilst $counter <= $max

[*]start building display block[]

[*]add in 1st level navigation with the javascrtipt link (as tutorial)

[*]add 2nd level navigation inside div (as tutorial)

[*]incriment $counter by 1

[*]end loop

[*]repeat process until $counter equals $max

 

<?php
//connect to server and select database; you may need it
$mysqli = mysqli_connect("localhost", "***", "***", "test") or die("There was an error trying to connect to the database");

//show categories first

echo "php start<br /><br />";

// sets up queries
$max_id_qry = "SELECT MAX(id) as \"max\" FROM store_categories";
$cat_title_qry ="SELECT cat_title FROM store_categories";

// sets up query calls
$max_id_res = mysqli_query($mysqli, $max_id_qry) or die("There was an error trying to send a query to the database");
$cat_title_res = mysqli_query($mysqli, $cat_title_qry) or die("There was an error trying to send a query to the database");

// sets up my variables
$max = 0;
$counter = 1;

// retrieve the highest value id listed in store_categories
if (mysqli_num_rows($max_id_res) > 0) {
     $tmp = mysqli_fetch_array($max_id_res);
     $max = $tmp['max'];

 // release query to free up memory
 mysqli_free_result($max_id_res);

 //display result for testing
 echo "max id value is ".$max."<br />";

 // retrieve nav text
 if (mysqli_num_rows($cat_title_res) > 0) {
 	$temp = mysqli_fetch_array($cat_title_res);
 	$link_title = $temp['cat_title'];
 }
}


// prints counter and link_title
echo "<br />".$counter." ".$link_title."<br />";


// sets up while loop used to create display block
while ($counter <= $max) {
$display_block = "<a href=\"javascript:display('".$cat_title."')\" class=\"Normal\">>>" .$cat_title. "<<</a><br />";
$display_block .= "	<div class=\"hide\" id=\"".cat_title."\">";
$display_block .= "test data hard coded for now to provide 2nd level nav";
$display_block .= "</div>";
$counter = $counter + 1;
}

//close connection to MySQL
mysqli_close($mysqli);
?>

 

Whilst I remember these are my two tables

store_categories

id    cat_title    cat_desc 

1    Hats          Funky hats in all shapes and sizes!

2    Shirts        From t-shirts to sweatshirts to polo shirts and be...

3    Books        Paperback, hardback, books for school or play

 

and store_subcategories

subcat_id    cat_id    subcat_title 

1                3            Adult Books

2                3            Childrens Books

3                3            Educational Books

4                3            Reference Books

5                2            Mens Tops

6                2            Boys T-ops

7                2            Ladies Tops

8                2            Grils Tops

9                1            Causal Hats

10              1            Party Hats

11              1            Fishing Hats

12              1            Sports Hats

 

If this thread doesn't make sence then please ask for more info

[RussellReal]

use <li>s and <ul> and inside each expanding menu add an onclick event and onclick make the inner <ul> visible