Can`t get the javascript to do ANYTHING at all in Drupal. An

  1. MDB Home Page
  2. Support Main Page
  3. MDB jQuery
Topic: Can`t get the javascript to do ANYTHING at all in Drupal. Any ideas?

Rnijland asked 7 years ago

Dear Support, We really like the mdbootstrap design, and would like to implement it into our project. We managed to get the css working, but somehow the javascript is doing absolutely nothing. Which is weird because it`s loaded ( in the footer ). There are also 0 errors produced in the console. At first we thought the javascript was not loaded in somehow, but if i add a alert(location.hostname); at the bottom of the mdb.js, it shows the alert. Yet it still does nothing when implementing a free version snippet like: <div class="view"> <img src="https://mdbootstrap.com/img/Photos/Others/forest-sm.jpg" class="img-fluid" alt="placeholder"> <div class="mask flex-center waves-effect waves-light rgba-teal-strong"> <p class="white-text">strong overlay</p> </div> </div> It just shows a small seperate box of the overlay under the picture. But when i do the exact same on a custom html / css page ( seperate from Drupal ). Then it does work. I have spend over 16 hours trying to find the cause, but it`s starting to drive me crazy. Do you have any ideas what the problem could be, and how i can solve it? It almost seems impossible to get this javascript to work inside drupal for some reason. Kind Regards, Roy Nijland

Bartłomiej Malanowski staff pro premium commented 7 years ago

Do you get any console logs?

Rnijland commented 7 years ago

Hi Bartłomiej Malanowski, As explained in the text above, sadly no errors at all to work with. And if i put a alert in the bottom of the mdb.js file, it does fire up the alert. Somehow all the other code just doesn`t work. Leaves me clueless as well. A jQuery library should be able to work right? Best, Roy

Bartłomiej Malanowski staff pro premium commented 7 years ago

show us your live demo

Rnijland answered 7 years ago

Hi Bartłomiej Malanowski, Managed to solve it myself meanwhile! Seems that Drupal had some weird disturbances.
  1. We installed the Bootstrap theme, followed by the Barrio bootstrap 4 subtheme.
  2. Installed the module library and bootstrap library.
  3. Copied the mdb files into the bootstrap library.
  4. Installed Jquery Update module, and set default jquery version to 1.9
  5. Added the Following line to the barrio_bootstrap.info file to load in the css:
stylesheets[all][] = css/mdb.css 6. added The following lines in the bottom of the template.php file: drupal_add_js('http://localhost/cleandrupal/sites/all/themes/bootstrap_barrio/js/mdb.js', array('type' => 'file', 'scope' => 'footer')); drupal_add_js('http://localhost/cleandrupal/sites/all/themes/bootstrap_barrio/js/popper.min.js', array('type' => 'file', 'scope' => 'footer')); Of course change links too your own url`s, and add the files in the folders :) Then in Drupal modules enable the php filter. As the default editor in full html will change the html code for you. Something you really not want. Then reset drupal cache. And add one of the snippets in your content type, with php filter enabled. THEN it works! Hope it helps other people as well. Best Regards, Roy
Write
Create snippet
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: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
Rnijland
10Support score
1Questions 1Answers
0Snippets likes 0Snippets