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

Topic: Can`t get the javascript to do ANYTHING at all in Drupal. Any ideas?

Rnijland free asked 6 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 commented 6 years ago

Do you get any console logs?

Rnijland free commented 6 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 commented 6 years ago

show us your live demo

Add comment

Rnijland free answered 6 years ago

0 0 Best answer

Hi <a href="https://mdbootstrap.com/support/?user=Bartek+Malanowski">Bartłomiej Malanowski</a>,

Managed to solve it myself meanwhile! Seems that Drupal had some weird disturbances.
<ol>
 	<li>We installed the Bootstrap theme, followed by the Barrio bootstrap 4 subtheme.</li>
 	<li>Installed the module library and bootstrap library.</li>
 	<li>Copied the mdb files into the bootstrap library.</li>
 	<li>Installed Jquery Update module, and set default jquery version to 1.9</li>
 	<li>Added the Following line to the barrio_bootstrap.info file to load in the css:</li>
</ol>
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

Please insert min. 20 characters.

Hi Bartłomiej Malanowski, Managed to solve it myself meanwhile! Seems that Drupal had some weird disturbances.

We installed the Bootstrap theme, followed by the Barrio bootstrap 4 subtheme.
Installed the module library and bootstrap library.
Copied the mdb files into the bootstrap library.
Installed Jquery Update module, and set default jquery version to 1.9
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

Add comment

Write

Create snippet

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: Free
Premium support: No
Technology: MDB jQuery
MDB Version: -
Device: -
Browser: -
OS: -
Provided sample code: No
Provided link: No

Rnijland

10Support score
1Questions 1Answers 0Snippets