显示下拉子级别(autonav Concrete5)
Display dropdown sublevel (autonav Concrete5)
我试图在 Concrete5 自动导航模板的第二层显示下拉菜单,但它似乎不起作用。
- 导航项
- 下拉菜单 (有效)
- 导航项
- 下拉菜单 (不起作用,关闭第一个下拉菜单)
- 导航项
我使用以下代码:
<?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
。任何想法如何使下拉列表在其他级别上工作。
我找到了显示多级下拉菜单的方法。我添加了以下 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>
我试图在 Concrete5 自动导航模板的第二层显示下拉菜单,但它似乎不起作用。
- 导航项
- 下拉菜单 (有效)
- 导航项
- 下拉菜单 (不起作用,关闭第一个下拉菜单)
- 导航项
我使用以下代码:
<?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
。任何想法如何使下拉列表在其他级别上工作。
我找到了显示多级下拉菜单的方法。我添加了以下 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>