显示下拉子级别（autonav Concrete5）

Posted 2023-04-13

【中文标题】显示下拉子级别（autonav Concrete5）

【英文标题】：Display dropdown sublevel (autonav Concrete5)

【发布时间】：2018-12-03 23:27:38

【问题描述】：

我试图在 Concrete5 自动导航模板的第 2 级显示一个下拉菜单，但它似乎不起作用。

导航项

下拉菜单

（作品） 导航项

下拉菜单

（不起作用，关闭第一个下拉菜单） 导航项

我使用以下代码：

    <?php defined('C5_EXECUTE') or die("Access Denied."); ?>
    <?php View::getInstance()->requireAsset('javascript', 'jquery');
    $navItems = $controller->getNavItems();
    foreach ($navItems as $ni) 
        $classes = array();

        if ($ni->isCurrent) 
            $classes[] = 'nav-selected'; 
        if ($ni->inPath) 
            $classes[] = 'nav-path-selected';
        if ($ni->hasSubmenu) 
            $classes[] = 'dropdown-menu';
    

    echo '<ul class="nav navbar-nav navbar-right">';
    foreach ($navItems as $ni) 
        echo '<li class="' . $ni->classes . '">';
        if ($ni->isEnabled) 
            $ni->hasSubmenu;
        
        if ($ni->hasSubmenu && $ni->level >= 2  ) 
            echo '<a href="#" class="dropdown-toggle dropdown-lvl2" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true">' . $ni->name . '<span class="caret"></span></a>';
             elseif ($ni->hasSubmenu)
                echo '<a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true">' . $ni->name . '<span class="caret"></span></a>'; //opens a dropdown sub-menu        
         else 
            echo '<a href="' . $ni->url . '" target="' . $ni->target . '" class="' . $ni->classes . '">' . $ni->name . '</a>';
        
        if ($ni->hasSubmenu && $ni->level >= 2  ) 
            echo '<ul class="dropdown-menu dropdown-menu-lvl2">'; 
             elseif ($ni->hasSubmenu)
                echo '<ul class="dropdown-menu">'; 
         else 
            echo '</li>'; //closes a nav item
            echo str_repeat('</ul></li>', $ni->subDepth); 
        
    
    echo '</ul>'; //closes the top-level menu

所以我认为问题在于 Bootstrap data-toggle 打开和关闭 dropdown-menu。任何想法如何使下拉菜单在其他级别上工作。

【问题讨论】：

2.行：应该已经添加了 jquery，因此您的 requireAsset() 是不必要的。还是您使用较旧的 c5 版本？

我使用的是 8.3.2 版本。删除该行不会中断或解决问题。这是生成的 html link（简体）

【参考方案1】：

我找到了一种显示多级下拉菜单的方法。我添加了以下 JavaScript：

https://jsfiddle.net/fxv214z0/

<script>
  (function($)
        $(document).ready(function()
            $('ul.dropdown-menu [data-toggle=dropdown]').on('click', function(event) 
                event.preventDefault(); 
                event.stopPropagation(); 
                $(this).parent().siblings().removeClass('open');
                $(this).parent().toggleClass('open');
            );
        );
    )(jQuery);
</script>