tarball111
tarball111

Reputation: 83

Navbar dropdown Bootstrap not working

I know this has been asked but I can't fix it based on the answers as I've made the includes found in other threads. My dropdown in bootstrap navbar is not working. I find it very odd as other features like the menu for mobile are working. I will join the code below. Thank You!!

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
<META NAME="ROBOTS" CONTENT="NOINDEX, NOFOLLOW" />
<META NAME=“Version” CONTENT=“Plano R1” />
    <title>Plano</title>


    <script src="/scripts/jquery-latest.min.js" type="text/javascript"></script>
<script src="/scripts/jquery.jeditable.js" type="text/javascript"></script>
<script src="/scripts/jquery.jeditable.masked.js" type="text/javascript"></script>
<script src="/scripts/jquery.maskedinput-latest.min.js" type="text/javascript"></script>
<script src="/scripts/jquery.autocomplete.js" type="text/javascript"></script>
<script src="/scripts/date.format.js" type="text/javascript"></script>
<script src="/scripts/jquery.floatThead.js" type="text/javascript"></script>
<script src="/scripts/PatientSearch.js" type="text/javascript"></script>
<script src="/scripts/jquery-ui.js" type="text/javascript"></script>

 <link href='http://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="/css/jquery-ui-latest.css">
<link rel="stylesheet" type="text/css" href="/css/iPad.css">
<link rel="stylesheet" type="text/css" href="/css/cms.v2.css">
<link rel="stylesheet" type="text/css" href="/css/css3-buttons.css">
<link rel="stylesheet" type="text/css" href="/css/patients.css">
<link rel="stylesheet" type="text/css" href="/css/appointments.css">
<link rel="stylesheet" type="text/css" href="/css/jquery.autocomplete.css">
<link rel="stylesheet" type="text/css" href="/css/base/jquery.ui.autocomplete.css">

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
 <link rel="stylesheet" href="../dist/css/bootstrap.css">
 <script src="../dist/js/bootstrap.min.js"></script>

</head>
<body>
    <header class="noPrint">

  <nav class="navbar navbar-default" role="navigation">
  <div class="container-fluid">
    <!-- 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">
        <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 plano">&nbsp;&nbsp;Plano&nbsp;&nbsp;&nbsp;</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" role="navigation">
        <li><a href="/agenda/agenda.php"><span class="icon icon33"></span><span class="">Agenda</span></a></li>
        <li class="dropdown">
            <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">R&eacute;pertoires<span class="caret"></span></a>
          <ul class="dropdown-menu" role="menu">
            <li><a href="/providers/">Fournisseurs</a></li>
            <li><a href="/patients/">Patients</a></li>
            <li><a href="/professionals/">Professionels</a></li>
          </ul>
        </li>
        <li><a href="/tasks/inactives.php"><span class="icon icon120">T&acirc;ches</a></li>
        <li><a href="/settings/status.php?table=patient"><span class="icon icon96">R&eacute;glages</a></li>
        <li><a href="/patients/dispos.php" onclick="popUp(this.href,'console',600,435);return false;" target="newWin" id="dispo-link">Disponibilit&eacute;s</a></li>
        <li><a href="#" id="add-link"><span class="icon icon3">Patient</a></li>
        <li><a href="/logout.php"><span class="icon icon151">D&eacute;connexion</a></li>
      </ul>
      <form class="navbar-form navbar-right" role="search">
        <div class="form-group">
          <input type="text" id="searchboxappointment" name="searchboxappointment" placeholder="Rechercher un patient" class="form-control searchboxappointment searchengine "  size="35" value="<?php  echo isset($_POST['searchboxappointment']) ? $_POST['searchboxappointment'] : "";?>" />
        </div>
      </form>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>

</header

Upvotes: 0

Views: 2393

Answers (2)

Macsupport
Macsupport

Reputation: 5444

Your loading 2 versions of jQuery. Get rid of the 1.11.0 version.

 <script src="/scripts/jquery-latest.min.js" type="text/javascript"></script>
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

Upvotes: 2

LOTUSMS
LOTUSMS

Reputation: 10240

I added your code to a codepen. HERE li It seems to be working for me. Perhaps your problem is somewhere else.

Have you checked if those CDN resources are actually providing you with their libraries or even connecting online with your site? Are working off your server in offline mode? If you are, the CDN references will not connect.

I would save those CDN references inside your root. They are great for testing purposes, but they are not meant to be permanent resources. If their server goes down, so will your site. Not to mention, you can't modify the code in them, should you needed to do so.

Upvotes: 0

Related Questions