Topic: jQuery with perfect-scrollbar

meesha81 priority asked 2 years ago


Based on documentation example: https://mdbootstrap.com/docs/standard/methods/scrollbar/#docsTabsAPI

Expected behavior Be able to use function as documentated.

Actual behavior

Uncaught TypeError: $(...).perfectScrollbar is not a function

Resources (screenshots, code snippets etc.)

This is script usage order, mdb as full 701kB file

<script src="js/jquery-3.6.1.min.js"></script>
<script src="js/mdb.min.js"></script>
<script src="js/custom.js"></script>

Usage in custom.js

$('.perfect-scrollbar-enable').perfectScrollbar(options);

Grzegorz Bujański staff answered 2 years ago


Try to init Perfect Scrollbar inside document ready function:

$(document).ready(() => {
    $('.perfect-scrollbar-enable').perfectScrollbar(options);
})

meesha81 priority commented 2 years ago

Not working... I am not sure that Bootstrap 5 (clean JS) version can be used with jQuery as described in documentation. Maybe only Bootstrap 4 (jQuery) version can be used this way. What do you think? Should it works with bootstrap 5 (vanilla JS) version of MDB?


Grzegorz Bujański staff commented 2 years ago

Init via jQ works too. See this snippet: https://mdbootstrap.com/snippets/standard/grzegorz-bujanski/4493845#js-tab-view In what order do you import jQ and MDB? First jQ then MDB? jQ must be imported first. Do you have any errors in your console?


meesha81 priority commented 2 years ago

Hi, thank you for information. It is working now. I am not sure where was something strange, maybe something with browser cache, I cannot explain it but it is working now. It can be initialized by jQuery now.

Only for my confirmation: Am I right that 'update' method cannot be run via jQuery and have to be called via clean javascript?



Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Answered

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 5.0.0
  • Device: PC
  • Browser: Chrome 106
  • OS: win11
  • Provided sample code: No
  • Provided link: Yes