Bootstrap nav link is not opening

Question

Link inside Bootstrap nav-menu is not opening. When you click on it nothing opens.

Cart file does not open when I click on the Cart hyper link. I double checked the path and it is correct.

Master file:

<nav class="navbar navbar-default">
    <div class="container-fluid">
        <ul class="nav navbar-nav navbar-right pull-right">
            <li>
                <a href="Cart/Cart.aspx" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">
                    <span class="glyphicon glyphicon-shopping-cart"></span><asp:Label ID="CartCountL" runat="server" CssClass="badge badge-warning" text="2"/>
                </a>
            </li>
        </ul>

        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="/UI/Home.aspx">
              <img id="MMLogo" src="/Images/Logo/MM.jpg" alt="MurkyMuse Logo" Title="MurkyMuse Logo" />
          </a>
        </div>
        <!-- Collect the nav links, forms, and other content for toggling -->
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
          <ul class="nav navbar-nav">
            <li><a href="/UI/Home.aspx">HOME<span class="sr-only">(current)</span></a></li>
            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="#">DAILY LIFE
                <span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li><a href="/UI/ComingSoon.aspx">Art</a></li>
                    <li><a href="/UI/ComingSoon.aspx">Outfits</a></li>
                  </ul>
                </li>
            <li><a href="/UI/Shop/Shop.aspx">SHOP</a></li>
            <li class="dropdown">
                <a class="dropdown-toggle" data-toggle="dropdown" href="/UI/About.aspx">ABOUT<span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li><a href="/UI/About/OurStory.aspx">OUR STORY</a></li>
                    <li><a href="/UI/ComingSoon.aspx">MEDIA</a></li>
                  </ul>
            </li>
            <li><a href="/UI/Contact.aspx">CONTACT</a></li>
          </ul>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>

Answer 1

The Cart menu item does not behave like a standard link, because you have data-toggle="dropdown" defined on it. As part of the dropdown functionality, Bootstrap click listeners use Event.preventDefault() on the click event triggered on these elements, thus blocking the native link behavior.

In case the Cart item does not have a dropdown, but it should behave as a standard link, remove the data-toggle="dropdown" attribute and the .dropdown-toggle class from that, and it should work.