创建导航菜单

debugcn 发表于 Dev

用户名

我正在尝试采用以下数组，并创建与导航的静态HTML版本相同的版本。我添加了HTML，以显示类别中没有任何子项且本身是什么样子，以及当类别中有子项时的外观。我已经开始，但现在尝试使用hasSubmenu。

数据库查询结果

array(3) {
    [0]=> object(stdClass)#24 (3) {
        ["category_id"]=> string(1) "1"
        ["category_name"]=> string(9) "Dashboard"
        ["category_class"]=> string(9) "dashboard"
    }
    [1]=> object(stdClass)#24 (3) {
        ["category_id"]=> string(1) "2"
        ["category_name"]=> string(5) "Users"
        ["category_class"]=> string(5) "users"
    }
    [2]=> object(stdClass)#24 (3) {
        ["category_id"]=> string(1) "3"
        ["category_name"]=> string(5) "Pages"
        ["category_class"]=> string(5) "pages"
        ["links"]=> array(2) {
            [0]=> object(stdClass)#24 (2) {
                ["item_id"]=> string(1) "1"
                ["item_name"]=> string(5) "Admin Pages"
            [1]=> object(stdClass)#24 (2) {
                ["item_id"]=> string(1) "2"
                ["item_name"]=> string(5) "User Pages"
            }
        }
    }
}

HTML生成的导航

<li class="active"><a href="" class="glyphicons dashboard"><i></i><span>Dashboard</span></a></li>
<li class="hasSubmenu">
    <a href="#menu_pages" data-toggle="collapse" class="glyphicons page"><i></i><span>Pages</span><span class="icon-chevron-down"></span></a>
    <ul class="collapse" id="menu_pages">
        <!-- Components Submenu Regular Items -->
        <li class=""><a href="">Item 1</a></li>
        <li class=""><a href="">Item 2</a></li>
        <li class=""><a href="">Item 3</a></li>
        <li class=""><a href="">Item 4</a></li>
        <!-- // Components Submenu Regular Items END -->
    </ul>
</li>

PHP开始导航

foreach ($dashboard_menu_categories AS $category)
{
    echo '<li>';
    if (isset($category->links))
    {
        echo '<ul class="collapse" id="menu_'.$category->category_short_name.'">';
        /* Components Submenu Regular Items */
        foreach($category->links AS $item)
        {
            echo '<li class=""><a href="">'.$item->item_name.'</a></li>';
        }
        /* Components Submenu Regular Items END */
        echo '</ul>';
    }
    echo '<a href="" class="glyphicons '.$category->category_class.'"><i></i><span>'.$category->category_name.'</span></a>';
    echo '</li>';
}

koala_dev

您只需要对通过子菜单添加到类别中的类/属性使用条件：

foreach ($dashboard_menu_categories AS $category)
{
    $hasSubmenu = isset($category->links);

    echo '<li class="'.($hasSubmenu ? 'hasSubmenu' : '').'">';
    echo '<a href=""'.($hasSubmenu ? ' data-toggle="collapse"' : '').' class="glyphicons '.$category->category_class.'"><i></i><span>'.$category->category_name.'</span>';
    if($hasSubmenu)
        echo '<span class="icon-chevron-down"></span>';
    echo '</a>';
    if ($hasSubmenu)
    {
        echo '<ul class="collapse" id="menu_'.$category->category_short_name.'">';
        /* Components Submenu Regular Items */
        foreach($category->links AS $item)
        {
            echo '<li class=""><a href="">'.$item->item_name.'</a></li>';
        }
        /* Components Submenu Regular Items END */
        echo '</ul>';
    }
    echo '</li>';
}

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。