mdb is not defined when used with Wordpress


Topic: mdb is not defined when used with Wordpress

office@appstruction.com pro premium asked 2 years ago

Expected behavior Showing the multi range slider ....

Actual behavior Not showing the multi range slider ...

Resources (screenshots, code snippets etc.)

Inside a Wordpress plugin, I've addded the basic snipped to test the behaviour of the multi range slider (I tried other components also).

I added some other libraries as well, but my code is in custom.js at the end.

wp_enqueue_script('bootstrap-script', 'https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js');
wp_enqueue_script('mdb-min', plugins_url('/assets/mdb/js/modules/mdb.min.js', __FILE__), array('jquery'), false, true);
wp_enqueue_script('datepicker-jquery', 'https://code.jquery.com/jquery-3.6.0.js');
wp_enqueue_script('datepicker-jquery-ui', 'https://code.jquery.com/ui/1.13.1/jquery-ui.js');
wp_enqueue_script('leaflet', 'https://unpkg.com/leaflet@1.9.2/dist/leaflet.js');
wp_enqueue_script('map_handler', plugins_url('/assets/map_handler.js', __FILE__), array('jquery'), false, true);
wp_enqueue_script('custom', plugins_url('/assets/custom.js', __FILE__), array('jquery'), false, true);

When I try to load for e.g. a datepicker or multi range slider - the error message is always "mdb is not defined".

What do i have to do to get things working?

Thank you.


Grzegorz Bujański staff answered 2 years ago

Do you have any more errors in the console? For example, informing that some file was not found?

Are you sure the mdb.min.js file path is correct? By default, there is no such file in the modules folder in our package. It is located in the js folder. If you didn't move this file manually, that's probably why you'll get an error.

If the path is correct try importing the MDB in the custom.js file and add MDB to window object:

import * as mdb from './mdb/js/mdb.min.js';
window.mdb = mdb;

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
  • User: Pro
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 6.0.1
  • Device: Laptop
  • Browser: Firefox, Chrome
  • OS: Linux
  • Provided sample code: No
  • Provided link: No