Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Getting "$(...).sideNav is not a function" error when trying to use sidenav()

luthersites pro asked 6 years ago


I purchased the Pro version of MDBoostrap, downloaded, and began using it.  I want to setup a sidenav as an admin menu when administrative users log in. I added the following to the <head> of my site:
<script src="/js/mdb.min.js"></script>
Right after this I added this:
<script>
// SideNav Button Initialization
$(".button-collapse").sideNav({
edge: 'left'
});
// SideNav Scrollbar Initialization
var sideNavScrollbar = document.querySelector('.custom-scrollbar');
Ps.initialize(sideNavScrollbar); 
</script>
I copied and pasted the entire navbar example from your website, but to save room, I'm only pasting the first couple of lines:
<!-- Sidebar navigation -->
<div id="slide-out" class="side-nav">
<ul class="custom-scrollbar">...
No matter what I do, I get the "$(...).sideNav is not a function" error in the console.  I need to have this working or most of the reason I purchased mdb is unjustified.  Please advise!

luthersites pro answered 6 years ago


I found the problem - simple one as usual.  Gotta make sure that I am loading the javascript files in the right order.  Moved both the mdb.min.js and the initialization script to the end of the page and now it all works fine.

Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Resolved

Specification of the issue

  • ForumUser: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: Yes
  • Provided link: No
Tags