Dropdown Menu ASP.NET MVC 5

Question

Dropdown Menu ASP.NET MVC 5

Asked 8 years, 9 months ago

Viewed 1,501 times

1

I need to change the menu to apply a Dropdownlist, but I’m having difficulty. I’m following the footsteps of the bootstrap site, but when click does not appear the submenu, follow the code below:

<body>
<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="../../Home/Index"><img src="~/Images/logo_Web.png" width="50" height="50" /></a>
        </div>
        <div class="navbar-collapse collapse">
            @if (Session["PerfilUsuario"] != null)
            {
                <ul class="nav navbar-nav">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Chamados <span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            <li>@Html.ActionLink("Novo Chamado", "Create", "Chamado")</li>
                            <li>@Html.ActionLink("Acompanhar Chamados", "Index", "Chamado")</li>
                            @if (Session["PerfilUsuario"].ToString().Equals("1") || Session["PerfilUsuario"].ToString().Equals("3")|| Session["PerfilUsuario"].ToString().Equals("5")|| Session["PerfilUsuario"].ToString().Equals("6")){
                                <li>@Html.ActionLink("Chamados Encerrados", "ChamadosEncerrados", "Chamado")</li>
                            }
                        </ul>
                    </li>

                    @if (Session["PerfilUsuario"].ToString().Equals("1"))
                    {
                        <li>@Html.ActionLink("Obras", "Index", "Obra")</li>
                    }
                    @if (Session["PerfilUsuario"].ToString().Equals("1") || Session["PerfilUsuario"].ToString().Equals("6"))
                    {
                        <li>@Html.ActionLink("Setores", "Index", "Setor")</li>
                    }
                </ul>
            }
            @Html.Partial("_LoginPartial")
        </div>
    </div>
</div>
<div class="container body-content">
    @RenderBody()
    <hr />
    <footer>
        <p>&copy; @DateTime.Now.Year - Chamados BRA</p>
    </footer>
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)

I had the same problem, solved with jquery update, upgraded to 1.9.0 or any version above that.

– Elói Ferreira

2017/04/21 at 17:24

2 answers

1

After putting the script below the menu worked.

<script>
    $(document).ready(function () {
        $('.dropdown-toggle').dropdown();
    });
</script>

Try to mark an answer as accepted for the benefit of the community. See the Tour: is fast and clarifies enough.

– Leonel Sanches da Silva

2015/09/25 at 14:07

Browser other questions tagged html asp.net-mvc-5 razor bootstrap-3

You are not signed in. Login or sign up in order to post.

by Randrade • **21,612** points · Answer 1 · 2015-09-24T23:01:10+00:00

There are no problems with your code. probably should the conditions in your if's are not being filled in. Remove these checks, and test your menu without them.

Test your code like this:

<body>
<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <a href="../../Home/Index"><img src="~/Images/logo_Web.png" width="50" height="50" /></a>
        </div>
        <div class="navbar-collapse collapse">
                <ul class="nav navbar-nav">
                    <li>@Html.ActionLink("Home", "Index", "Home")</li>
                    <li class="dropdown">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Chamados <span class="caret"></span></a>
                        <ul class="dropdown-menu" role="menu">
                            <li>@Html.ActionLink("Novo Chamado", "Create", "Chamado")</li>
                            <li>@Html.ActionLink("Acompanhar Chamados", "Index", "Chamado")</li>
                                <li>@Html.ActionLink("Chamados Encerrados", "ChamadosEncerrados", "Chamado")</li>
                        </ul>
                    </li>
                        <li>@Html.ActionLink("Obras", "Index", "Obra")</li>
                        <li>@Html.ActionLink("Setores", "Index", "Setor")</li>
                </ul>
            @Html.Partial("_LoginPartial")
        </div>
    </div>
</div>
<div class="container body-content">
    @RenderBody()
    <hr />
    <footer>
        <p>&copy; @DateTime.Now.Year - Chamados BRA</p>
    </footer>
</div>
@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/bootstrap")
@RenderSection("scripts", required: false)

If it still doesn’t work, check on console of his browser (F12) if you have an error.

Look at the result of your menu here.