CODEWITHSUNDEEP
javascriptphphtmlcsstwitter-bootstrap
ddrossi93
ddrossi93

Reputation: 385

Bootstrap Collapse not working, but works in JSFiddle

I just started working with bootstrap and came across an issue when trying to use "Collapse".

I am 99% sure I have the Javascript linked correctly because the reference to the css also works. I have also tried to replace it with the CDN

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>

but it still didn't work.

As I was placing my code into JSfiddle to share on here, I tested it, and it worked from there and I can't figure out why.

Here is the JSfiddle

To find the collapse button, just shrink your browser's size until you see the 3 bars in the top right. That is the button that is supposed to display the rest of the nav when clicked.

Other notes: I am using codeigniter, which is why you will see some PHP in this code.

Any help would be appreciated. Thank you.

Upvotes: 2

Views: 282

Answers (1)

Shubham Khatri
Shubham Khatri

Reputation: 282120

Include jquery.min.js before bootstrap.min.js

<head>
<link rel="stylesheet" href="<?php echo base_url('assets/css/bootstrap.css'); ?>" >
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="<?php echo base_url('assets/js/bootstrap.js'); ?>" ></script> <!--Boostrap Javascript -->

</head>

Bootstrap JS requires JQuery to work and thus you need to include it before bootstrap.min.js in your script tag.

Upvotes: 6

Related Questions