Open modal bootstrap automatically when loading page

Navigation
2

I need people as soon as the page load the modal bootstrap open on the screen without having to click the button, the way I am doing it and it is necessary to click the button for the modal open, follow the code: 

<button type="button" class="btn btn-primary construcao" data-toggle="modal" data-target="#exemplomodal">SITE EM CONSTRUÇÃO</button>



<div class="modal fade" id="exemplomodal" tabindex="-1" role="dialog" aria-
 labelledby="myLargeModalLabel">
<div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title" id="gridSystemModalLabel">teste</h4>
        </div>
        <div class="modal-body">
            teste

        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        </div>
    </div>
</div>


<script type="text/javascript">

$(document).ready(function() {
    $('#exemplomodal').modal('show');
})
</script>
    
asked by anonymous 06.04.2017 / 14:21

1 answer

5

You are using the correct way to open bootstrap modal: 

$(document).ready(function() {
    $('#exemplomodal').modal('show');
})

How the error in the console is

  

.modal is not a function

So your problem is probably in the script's declaration order, declare them in the following order: 

<!-- jquery -->
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<!-- bootstrap -->
<script type="text/javascript" src="js/bootstrap.js"></script>
<!-- chamada da função -->
<script type="text/javascript">
$(window).load(function() {
    $('#exemplomodal').modal('show');
});
</script>

This happens because the bootstrap depends on jquery, that is, jquery needs to be declared beforehand.

    
06.04.2017 / 14:40
Date to String conversion in Pyhton What is the difference between project (project) and application ("app") in Django?