Bootstrap modal problem in Django project

Using Django Templates & Frontend
1

Im trying to use a bootstrap modal as part of my web application, but the pop up wont show when the button is pressed. I have copied all the code exactly as it is on the bootstrap site:

<!-- Button trigger modal -->
<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#exampleModalLong">
  Launch demo modal
</button>

<!-- Modal -->
<div class="modal fade" id="exampleModalLong" tabindex="-1" role="dialog" aria-labelledby="exampleModalLongTitle" aria-hidden="true">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalLongTitle">Modal title</h5>
        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
          <span aria-hidden="true">&times;</span>
        </button>
      </div>
      <div class="modal-body">
        ...
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

Not sure if this a problem with how I have set up my project or my version of bootstrap…

Any help appreciated!

2

First thing to check is to verify that your bootstrap css and js files are being loaded in the browser, and that the build of bootstrap that you are using has the modal modules included.

3

I appreciate you getting back to me! By chance could guide me on how to make these checks please?

4

Use your browser’s developer tools to see what files have been loaded, and only you can determine what versions of those files are being used to identify whether you have everything you need.