Hi all, I have created a Webdesign in BSS with an underlying Django Server. It works like a charm, apart from the dropdown menu. In the preview, the code runs and opens the dropdown. On my Amazon AWS instance the dropdown does not open. Is there a way to trigger the event manually?
@BenMew, open your browser and look for console errors on your site (F12 or right-click select Inspect). Make sure your including or not blocked JQuery or Bootstrap files. JQuery is required by Bootstrap.
Saj
No errors in my console. It is only the dropdown variant, that is not working. Is there a chance to add a custom code that opens this menu?
If you can upload your site and share a link, we could better help you. Or share the project file. Either way would get you more help. We all know already that the dropdowns work as intended, so you either have something not placed correctly, a script conflict or script ordering conflict or something of the sort. Since you're adding other code systems to your site, it's kind of hard for us to wing it and know what the issue might be. Adding more custom code to try to fix something that shouldn't be broken though isn't the solution, you should find out why it's not working first. :)
The actual site is running here:
http://charlene-env-1.uw9hmbewhn.us-east-2.elasticbeanstalk.com/
User: BSS PW: 1234test
The project file can be found here: https://www.dropbox.com/s/18y1rmxdccipb42/Prologs_Test.bsdesign?dl=0
To allow running the page with a Django I had to adjust few things, so here is the adjusted Index.html: https://www.dropbox.com/s/h7gvil50w0gdpe2/index.html?dl=0
Dropdowns are built on a third party library, Popper.js, which provides dynamic positioning and viewport detection. Be sure to include popper.min.js before Bootstrap’s JavaScript or use bootstrap.bundle.min.js / bootstrap.bundle.js which contains Popper.js. Popper.js isn’t used to position dropdowns in navbars though as dynamic positioning isn’t required.
I see that you are putting jquery.js v3.3.1 , bootstrap.min.js v4.1.1, and popper.js 1.14.3 in the head section which should be removed due to conflict with the jquery v3.4.1 and bootstrap.min.js v4.4.1 in your footer which is where it is supposed to be.
The jquery.js v3.3.1 in the head is most likely the culprit. Remove all of those links....
It turned out that jquery.js v3.3.1 in the head was the source of the error. Now, it works like a charm. Thanks twinbee!