Navbar dropdown not working in IE11


Topic: Navbar dropdown not working in IE11

Piotr Suplat asked 7 years ago

The dropdowns in the navbar are not working in IE11 (works fine in Edge though). Debugger console reports the following errors:
Bootstrap dropdown requires Popper.js; bootstrap.js (1414,5)
popper itself if being loaded onto the page before the bootstrap.js

Bartłomiej Malanowski staff pro premium commented 7 years ago

I think it's a problem with popper itself. Could you please show us your code?

Update:
no longer an issue. I have downloaded the popper from here https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js and replace the file that came with the MDB download.

**************************************************************************************************

This is my header bit where I load all the resources:

<!-- Bootstrap core CSS -->
<link href="assets/mdb/css/bootstrap.css" rel="stylesheet">
<!-- Material Design Bootstrap -->
<link href="assets/mdb/css/mdb.min.css" rel="stylesheet">
<!-- SCRIPTS -->
 <!-- JQuery -->
 <script type="text/javascript" src="assets/mdb/js/jquery-3.1.1.min.js"></script>
 <!-- Bootstrap dropdowns -->
 <script type="text/javascript" src="assets/mdb/js/popper.min.js"></script>
 <!-- Bootstrap core JavaScript -->
 <script type="text/javascript" src="assets/mdb/js/bootstrap.min.js"></script>
 <!-- MDB core JavaScript -->
 <script type="text/javascript" src="assets/mdb/js/mdb.min.js"></script>

 

and my navbar code is this (the dropdown bit only):

<li class="nav-item dropdown">
 <a class="nav-link dropdown-toggle" id="navbarDropdownMenuLink" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">OBJECTS
 </a>
 <div class="dropdown-menu" aria-labelledby="navbarDropdownMenuLink">
 <a class="dropdown-item waves-effect waves-light" href="/categories">CATEGORIES</a>
 <a class="dropdown-item waves-effect waves-light" href="/subjects">SUBJECTS</a>
 <a class="dropdown-item waves-effect waves-light" href="/modules">MODULES</a>
 <a class="dropdown-item waves-effect waves-light" href="/packages">PACKAGES</a>
 </div>
 </li>

 


jivancic pro commented 7 years ago

Amazing ... and it's indeed the fact . After I downloaded the js from above link , everything works just fine. Question I have why in the last version of MDB such detail not considered at all ?

Jakub Strebeyko staff answered 7 years ago

Hi Piotr, Thanks for noting the IE navbar dropdown issue. Popper.js, just as the MDB itself and, as a matter of fact, all the other web technologies involved, constantly develops. It means that our small team tirelessly seeks feedback from the community to point out issues to be resolved, implementation bloopers to get rid of and functionalities to be added in the future. Long story short – we’re happy to hear the issue got resolved; the knowledge of how it got done will be used to improve MDB. The popper.min.js included in our package shall be updated shortly, thank you much for your patience. Cheers, Kuba

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Closed

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: Yes
  • Provided link: No