Search code examples
javascripthtmlcssbootstrap-4bootstrap-modal

bootstrap modal wont open on page load


My bootstrap modal wont open on page load I do not know why. The button to open the modal works tho.

My code:

<div id="myModal" class="modal fade" role="dialog">
            <div class="modal-dialog">
                <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Modal Header</h4>
                  </div>
                  <div class="modal-body">
                    <p>Some text in the modal.</p>
                  </div>
                  <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                  </div>
            </div>
            </div>
        </div>

    window.onload = function() {
                $('#myModal').modal('show');
    }

Solution

  • Your case may be already answered thousand times, but consider few these causes:

    1. Order of your libraries, are they in correct position?
    2. Perhaps you forget to include bootstrap.js
    3. Consider to include popper.js Please let me know, if it helps