How can a recursive function be used to generate a multi-level HTML menu tree from a hierarchical MySQL database table?

Echoing Menu Tree with Recursive Function

Problem:
Constructing a recursive function for a specific data structure is a common challenge. Here's a situation where a recursive function is needed to display a hierarchical menu.

Situation:
Given a MySQL database table where the root column indicates the parent category for each record, create an HTML menu tree with multiple levels. The desired HTML structure is:

<code class="html"><li><a href="#"><p class="Tier0">Datori</p></a>
    <ul style="display: block">
        <li><a href="#"><p class="Tier1">Cookies</p></a></li>
        <li><a href="#"><p class="Tier1">Events</p></a></li>
        <li><a href="#"><p class="Tier1">Forms</p></a></li>
        <li><a href="#"><p class="Tier1">Games</p></a></li>
        <li><a href="#"><p class="Tier1">Images</p></a>
            <ul>
                <li><a href="#"><p class="Tier2">CSS</p></a></li>
                <li><a href="#"><p class="Tier2">JavaScript</p></a></li>
                <li><a href="#"><p class="Tier2">JQuery</p></a></li>
            </ul>
        </li>
        <li><a href="#"><p class="Tier1">Navigations</p></a>
            <ul>
                <li><a href="#"><p class="Tier2">CSS</p></a></li>
                <li><a href="#"><p class="Tier2">JavaScript</p></a></li>
                <li><a href="#"><p class="Tier2">JQuery</p></a></li>
            </ul>
        </li>
        <li><a href="#"><p class="Tier1">Tabs</p></a></li>
    </ul>
</li>
<li><a href="#"><p class="Tier0">Washing Machines</p></a></li></code>

Function:
A recursive function to generate the HTML tree structure is as follows:

<code class="php">function recurse($categories, $parent = null, $level = 0)
{
    $ret = '<ul>';
    foreach($categories as $index => $category)
    {
        if($category['root'] == $parent)
        {
            $ret .= '<li><a href="#"><p class="Tier' . $level . '">' . $category['name'] . '</p></a>';
            $ret .= $this->recurse($categories, $category['id'], $level+1);
            $ret .= '</li>';
        }
    }
    return $ret . '</ul>';
}</code>

Execution:

<code class="php">// Fetch categories from the database
$categories = { get from database into a multi-dimensional array };

// Generate HTML tree
$Tree = $this->recurse($categories);

// Output the result
echo $Tree;</code>

Optimizations:
To prevent empty nested

elements for parent categories without child categories, modify the function as follows:

<code class="php">function recurse($categories, $parent = null, $level = 0)
{
    $ret = '<ul>';
    foreach($categories as $index => $category)
    {
        if($category['root'] == $parent)
        {
            $ret .= '<li><a href="#"><p class="Tier' . $level . '">' . $category['name'] . '</p></a>';
            $sub = $this->recurse($categories, $category['id'], $level+1);
            if($sub != '<ul></ul>')
                $ret .= $sub;
            $ret .= '</li>';
        }
    }
    return $ret . '</ul>';
}</code>

For optimal performance, consider adding a ChildCount column to the database table, indicating the number of child categories for each parent, and modify the function accordingly. This avoids unnecessary database lookups during recursion.

The above is the detailed content of How can a recursive function be used to generate a multi-level HTML menu tree from a hierarchical MySQL database table?. For more information, please follow other related articles on the PHP Chinese website!