Dropdown menu is not displayed

Question

<li class="nav-item dropdown"> <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="collapse" aria-haspopup="true" aria-expanded="false"> Manage </a> <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> <a class="dropdown-item" asp-controller="Administration" asp-action="ListUsers"> Users</a> <a class="dropdown-item" asp-controller="Administration" asp-action="ListRoles"> Roles</a> </div> </li> 

I tried on Opera, Chrome, Brave, Explorer...

Answer 1

Why not use the MVC strongly type helper methods? Do something like this:

@Html.DropDownListFor(m => m.StudentGender, 
            new SelectList(Enum.GetValues(typeof(Gender))), 
            "Select Gender")

Answer 2

Firstly, please be sure you use Bootstrap version 4.x.

Then change data-toggle="collapse" to data-toggle="dropdown" like below:

<li class="nav-item dropdown"> 
    <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> Manage </a> 
    <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink"> 
        <a class="dropdown-item" asp-controller="Administration" asp-action="ListUsers"> Users</a> 
        <a class="dropdown-item" asp-controller="Administration" asp-action="ListRoles"> Roles</a> 
    </div> 
</li>

Result: