Dynamically populate a drop-down navigation menu

[Dbast]

I have some nice CSS to develop a horizontal drop-down navigation menu similar to what's used on this site. But I cannot figure out how to dynamically populate the menu and submenu items.

The parent and child items are stored in a single table with this structure:

TopNavId
TopNavParentId (for all parents, this is 0; for all children, this is TopNavId for the parent)
TopNavName
TopNavOrder
TopNavURL
TopNavStatus

I should be able to write a query to get the information from the table, and then somehow loop over that query to put the pieces (parent and children) into the menu structure, right? I can't figure out how to go about doing this.

Help? Thanks!

-------------

[scooter5791]

Even though you already have something in mind to use, you might try looking at commercial packages that have dynamic database population capabilities built-in. We have tried a few different ones (Milonic and others) but one I like is:

http://www.sothink.com/product/dhtmlmenu/index.htm

This is only a personal opinion btw, I am not connected to the product in any way. You can download and try for free but must buy for commercial usage. Take a look at the Coldfusion samples.

There are many others available as well. You can find these by searching for dhtml menu systems. Some charge per site usage - the one above you can use with an unlimited number of sites for a single price.

[Dbast]

scooter5791: thanks for the advice! I've downloaded the trial version of the SoThink product and really like it. The only thing I'm struggling with now is writing the query to dynamically populate my submenus -- parent menus are working fine, but can't seem to figure out how to loop through a query to pull the children for each parent. Brain freeze, I guess -- thoughts?

[insuractive]

Your best bet is probably a carefully formatted initial query and some elegant CF coding. Barring that, you could always do the brute force way and pull everything back for all parents in an initial query and then perform a CF Query of a Query for each parent to retrieve the appropriate data.

[Dbast · Accepted solution]

Thanks, Michael. The Sothink product scooter5791 recommended actually made this pretty easy. Parent query works just as

SELECT *
FROM TopNav
WHERE topNavParentId=0
AND TopNavStatus=1
ORDER BY topNavOrder

Child query is simply

SELECT *
FROM TopNav
WHERE topNavParentId <> 0
AND topNavStatus=1
AND #getTopNav.topNavId#=topNavParentId


and then the output just loops through the GetTopNavDropdown query, basically:

<CFLOOP query="getTopNavDropdown">
"#topNavName#" #topNavURL#
</CFLOOP>


The Sothink product does all of the formatting etc.

Thanks, everyone, for the help. --Dbast