Abp multilevel dropdown menu

D:\GitHub\abp\framework\src\Volo.Abp.AspNetCore.Mvc.UI.Theme.Basic\Themes\Basic\Components\Menu
pull/839/head
Armağan Ünlü 6 years ago
parent 53a8666827
commit 25ab9008cb

@ -26,14 +26,59 @@
}
else
{
<nav-item class="dropdown">
<a class="nav-link dropdown-toggle" href="#" id="Menu_@(menuItem.Name)" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">@menuItem.DisplayName</a>
<div class="dropdown-menu" aria-labelledby="Menu_@(menuItem.Name)">
@foreach (var childMenuItem in menuItem.Items)
{
@await Html.PartialAsync("~/Themes/Basic/Components/Menu/_MenuItem.cshtml", childMenuItem)
}
<li class="nav-item">
<div class="dropdown">
<a class="nav-link dropdown-toggle" href="#" id="Menu_@(menuItem.Name)" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">@menuItem.DisplayName</a>
<div class="dropdown-menu" aria-labelledby="Menu_@(menuItem.Name)">
@foreach (var childMenuItem in menuItem.Items)
{
@await Html.PartialAsync("~/Themes/Basic/Components/Menu/_MenuItem.cshtml", childMenuItem)
}
</div>
</div>
</nav-item>
</li>
}
}
<!-- Test yapılabilmesi için çağırıldı. Silinecek. ÖNEMLİ -->
<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<!-- Olması gereken yere bu stiller yazılacak. -->
<style type="text/css">
.navbar .dropdown-submenu {
position: relative;
}
.navbar .dropdown-submenu a::after {
transform: rotate(-90deg);
position: absolute;
right: 6px;
top: .8em;
}
.navbar .dropdown-submenu .dropdown-menu {
top: 0;
left: 100%;
margin-left: .1rem;
margin-right: .1rem;
}
</style>
<!-- Olması gereken yere bu script yazılacak. -->
<script type="text/javascript">
$(document).ready(function () {
$('.dropdown-menu a.dropdown-toggle').on('click', function (e) {
if (!$(this).next().hasClass('show')) {
$(this).parents('.dropdown-menu').first().find('.show').removeClass("show");
}
var $subMenu = $(this).next(".dropdown-menu");
$subMenu.toggleClass('show');
$(this).parents('li.nav-item.dropdown.show').on('hidden.bs.dropdown', function (e) {
$('.dropdown-submenu .show').removeClass("show");
});
return false;
});
});
</script>

@ -16,7 +16,7 @@
}
else
{
@*<li class="dropdown-submenu">
<div class="dropdown-submenu">
<a role="button" class="btn dropdown-toggle" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<span class="lp-icon">
@ -32,6 +32,5 @@ else
@await Html.PartialAsync("~/Themes/Basic/Components/Menu/_MenuItem.cshtml", childMenuItem)
}
</div>
</li>*@
</div>
}

@ -31,6 +31,12 @@ namespace Volo.Abp.Identity.Web.Navigation
{
identityMenuItem.AddItem(new ApplicationMenuItem(IdentityMenuNames.Users, l["Users"], url: "/Identity/Users"));
}
var identityMenuItem2 = new ApplicationMenuItem("asdasd", "Dropdown", icon: "fa fa-id-card-o");
identityMenuItem2.AddItem(new ApplicationMenuItem("qweqew", "Link 2", url: "/Identity/Users"));
identityMenuItem2.AddItem(new ApplicationMenuItem("qweqeww", "Link 1", url: "/Identity/Roles"));
identityMenuItem.AddItem(identityMenuItem2);
}
}
}
Loading…
Cancel
Save