Modal bootstrap does not open [closed]

Question

Modal bootstrap does not open [closed]

Navigation

#1 by (4 votes)

1

I have a button that when clicked opens a bootstrap modal. But when you click this button, the modal is not opening. Here is the code structure:

<html>
    <head>        
        <script src="assets/bootstrap-3.3.7/js/bootstrap.min.js" type="text/javascript"></script>
    </head>

    <body>
        <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#MyModal">Open Modal</button>

        <div id="MyModal" class="modal fade" role="dialog">
            <div class="modal-dialog">

              <!-- Modal content-->
              <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>

    </body>

</html>

The bootstrap version I imported into my project is the last. What can be

bootstrap-3 modal

asked by anonymous 25.01.2017 / 11:33

1 answer

How to print a string array on the screen? Error when trying to calculate in fields of the same table in update mysql

score 4 · Accepted Answer

You did not imports correctly.

<html>
    <head>   
      <!-- Importando o css do bootstrap -->
       <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
      
    </head>

    <body>
        <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#MyModal">Diga olá para o mundo!</button>

        <div id="MyModal" class="modal fade" role="dialog">
            <div class="modal-dialog">

              <!-- Modal content-->
              <div class="modal-content">
                <div class="modal-header">
                  <button type="button" class="close" data-dismiss="modal">&times;</button>
                  <h4 class="modal-title">Modal de Olá!</h4>
                </div>
                <div class="modal-body">
                  <p>Estou dizendo! OLÁ MUNDO! =D</p>
                </div>
                <div class="modal-footer">
                  <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                </div>
              </div>
            </div>
      </div>

    </body>

  <!-- Importando o jQuery -->
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script><!--Importandoojsdobootstrap--><scriptsrc="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
</html>