building dynamic menu problem ??

PHPycho

Hello forums!!
I am getting bit problem in displaying dynamic css menus which uses <li><ul> tags.
I had the table with structure as:
tbl_cat

|id|title|parent_id|
|1|Item 1| 0 |
|2|Item 2| 0 |
|3|Item 3| 0 |
|4|Item 4| 0 |
|5|Item Item 2.1| 2 |
|6|Item Item 2.2| 2 |
|7|Item Item 3.1| 3 |
|8|Item Item 3.2| 3 |
|9|Item Item 3.3| 3 |

I have to show these values as following in order to display the proper multilevel menu.

<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a>
<ul>
<li><a href="#">Item 2.1</a></li>
<li><a href="#">Item 2.2</a></li>
</ul>
</li>
<li><a href="#">Item 3</a>
<ul>
<li><a href="#">Item 3.1</a></li>
<li><a href="#">Item 3.2</a>
<ul>
<li><a href="#">Item 3.2.1</a></li>
<li><a href="#">Item 3.2.2</a></li>
<li><a href="#">Item 3.2.3</a></li>

</ul>
</li>
</ul>
</li>
<li><a href="#">Item 4</a></li>

Has anybody some idea in generating proper <li><ul> tags for the fields so that it becomes as above ..
Note it can be n level deep.
Thanks in advance for any tips and suggestions.

northstjarna

Hi there,

looks like you are missing a closing

</li>

no the thrid line and no start or end tag after the inner list...

<ul> and </ul>

, ie you are trying to nest list items

<ul>
<li>header 1</li>
           <ul>
           <li>sub heading 1.1</li>
           <li>sub heading 1.2</li>
           </ul>
<li>header 2</li>
           <ul>
           <li>sub heading 2.1</li>
           <li>sub heading 2.2</li>
           </ul>
</ul>

Your code...

<li><a href="#">Item 1</a></li>
<li><a href="#">Item 2</a>[COLOR="Red"]</li>[/COLOR]

<ul>
<li><a href="#">Item 2.1</a></li>
<li><a href="#">Item 2.2</a></li>
</ul>
[COLOR="red"]</li> [/COLOR] [COLOR="PaleGreen"][COLOR="DarkGreen"]<!-- you do not need this her should go up to close off the above -->[/COLOR]

<li><a href="#">Item 3</a> [COLOR="Red"]</li>[/COLOR]
<ul>
<li><a href="#">Item 3.1</a></li>
<li><a href="#">Item 3.2</a> [COLOR="Red"]</li>[/COLOR]
[COLOR="red"]</ul>[/COLOR]


etc...

You can also put in a general class in your css file to format list items. IE


li { 
background-color: #000; 
colour: #fff; 
text-align:center; 
display: block;
}

You can then also put in styes for nested li like this


li li { 

color: orange;
text-decoration: italic;

}

hope this helps

Cheers,
Andi