title: Pressing a button performs no action in PHP/HTML
body: <p>So I'm making a basic "book store" website for university project. I'm trying to make that when you press the "Details" button by the book, a pop up comes up and shows the information and the user can "add to cart" or close the pop up. I'm probably missing something small that I can't seem to notice.</p>
  
  <p>Here's the code for index.php</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;title&gt;Books 101 Shop&lt;/title&gt;
          &lt;link rel="stylesheet" href="css/bootstrap.min.css"/&gt;
          &lt;link rel="stylesheet" href="css/main.css"/&gt;
          &lt;meta name="viewport" content="width=device-width, initial-scale=1,user-scaleable=no"&gt;
          &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"&gt;
          &lt;/script&gt;
          &lt;script src="js/bootstrap.min.js"&gt;&lt;/script&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;nav class="navbar navbar-default navbar-fixed-top" id="navbar"&gt;
              &lt;div class="container"&gt;
                  &lt;a href="index.php" class="navbar-brand" id="text"&gt;Books 101&lt;/a&gt;
                  &lt;ul class="nav navbar-nav"&gt;
                      &lt;!--DROP DOWN MENU--&gt;
                      &lt;li class="dropdown"&gt;
                          &lt;a href="#" class="dropdown-toggle" data-toggle="dropdown" id="text"&gt;Genre&lt;span class="caret"&gt;&lt;/span&gt;
                          &lt;/a&gt;
                          &lt;ul class="dropdown-menu" role="menu"&gt;
                              &lt;li&gt;&lt;a href="#"&gt;Fantasy&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt;Detective&lt;/a&gt;&lt;/li&gt;
                              &lt;li&gt;&lt;a href="#"&gt;Romance&lt;/a&gt;&lt;/li&gt;                            
                              &lt;/ul&gt;
                  &lt;/ul&gt;
              &lt;/div&gt;
          &lt;/nav&gt;
          &lt;!--INSERTING IMAGES--&gt;
          &lt;div id="background-image"&gt;
              &lt;div id="image-1"&gt;&lt;/div&gt;
              &lt;div id="image-2"&gt;&lt;/div&gt;
          &lt;/div&gt;
          &lt;!--REMOVE THE SPACES AND CENTER THE PRODUCTS--&gt;
          &lt;div class="col-md-2"&gt;&lt;/div&gt;
  
          &lt;!-- MAIN CONTENT OF FEATURED PRODUCTS--&gt;
          &lt;div class="col-md-8"&gt;
              &lt;div class="row"&gt;
                  &lt;h2 class="text-center"&gt;Featured Books&lt;/h2&gt;
                  &lt;div class="col-md-3"&gt;
                      &lt;h4&gt;The Witcher&lt;/h4&gt;
                      &lt;img src="images/fantasy.jpg" alt="The Witcher" id="images"/&gt;
                      &lt;p class="list-price text-danger"&gt;List Price: &lt;s&gt;$29.99&lt;/s&gt;&lt;/p&gt;
                      &lt;p class="price"&gt;Our price: $19.99&lt;/p&gt;
                      &lt;button type="button" class="btn btn-success" data-toggle="modal" data-target="details-1"&gt;Details&lt;/button&gt;
                  &lt;/div&gt;
  
  
                  &lt;div class="col-md-3"&gt;
                      &lt;h4&gt;Lord Of The Rings&lt;/h4&gt;
                      &lt;img src="images/lordoftherings.jpg" alt="LotR" id="images"/&gt;
                      &lt;p class="list-price text-danger"&gt;List Price: &lt;s&gt;$24.99&lt;/s&gt;&lt;/p&gt;
                      &lt;p class="price"&gt;Our price: $19.99&lt;/p&gt;
                      &lt;button type="button" class="btn btn-success" data-toggle="modal" data-target="details-2"&gt;Details&lt;/button&gt;
                  &lt;/div&gt;
  
  
                  &lt;div class="col-md-3"&gt;
                      &lt;h4&gt;50 Shades of Gray&lt;/h4&gt;
                      &lt;img src="images/shadesofgray.jpg" alt="50 Shades of Gray" id="images"/&gt;
                      &lt;p class="list-price text-danger"&gt;List Price: &lt;s&gt;$19.99&lt;/s&gt;&lt;/p&gt;
                      &lt;p class="price"&gt;Our price: $9.99&lt;/p&gt;
                      &lt;button type="button" class="btn btn-success" data-toggle="modal" data-target="details-3"&gt;Details&lt;/button&gt;
                  &lt;/div&gt;
  
                  &lt;div class="col-md-3"&gt;
                      &lt;h4&gt;Sherlock Holmes&lt;/h4&gt;
                      &lt;img src="images/sherlock.jpg" alt="Sherlock Holmes" id="images"/&gt;
                      &lt;p class="list-price text-danger"&gt;List Price: &lt;s&gt;$29.99&lt;/s&gt;&lt;/p&gt;
                      &lt;p class="price"&gt;Our price: $19.99&lt;/p&gt;
                      &lt;button type="button" class="btn btn-success" data-toggle="modal" data-target="details-4"&gt;Details&lt;/button&gt;
                  &lt;/div&gt;
  
  
                  &lt;div class="col-md-3"&gt;
                      &lt;h4&gt;The Hobbit&lt;/h4&gt;
                      &lt;img src="images/the_hobbit.jpg" alt="The Hobbit" id="images"/&gt;
                      &lt;p class="list-price text-danger"&gt;List Price: &lt;s&gt;$29.99&lt;/s&gt;&lt;/p&gt;
                      &lt;p class="price"&gt;Our price: $19.99&lt;/p&gt;
                      &lt;button type="button" class="btn btn-success" data-toggle="modal" data-target="details-5"&gt;Details&lt;/button&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  
          &lt;!--DETAILS MODAL--&gt;
          &lt;?php include 'details-modal-witcher.php';
               // include 'details-modal-lotr.php';
               // include 'details-modal-shadesofgray.php';
               // include 'details-modal-sherlock.php';
               // include 'details-modal-hobbit.php';
          ?&gt;
          &lt;!--DETAILS MODAL END--&gt;
  
          &lt;footer class="text-center" id="footer"&gt;&amp;copy; Copyright Books 101&lt;/footer&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>And here's the code for making the on press action:</p>
  
  <pre><code>&lt;div class="modal fade details-1" id="details-1" tableindex="-1" role="dialog" aria-labelledby="details-1" aria-hidden="true"&gt;
     &lt;div class="modal-dialog modal-lg"&gt;
       &lt;div class="modal-content"&gt;
        &lt;div class="modal-header"&gt;
         &lt;button class="close" type="button" data-dismiss="modal" aria-label="Close"&gt;
         &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
         &lt;/button&gt;
         &lt;h4 class="modal-title text-center"&gt;The Witcher&lt;/h4&gt;
        &lt;/div&gt;
       &lt;div class="modal-body"&gt;
         &lt;div class="container-fluid"&gt;
           &lt;div class="row"&gt;
             &lt;div class="col-sm-6"&gt;
              &lt;div class="center-block"&gt;
                &lt;img src="images/fantasy.jpg" alt="The Witcher" class="details img-responsive"/&gt;
              &lt;/div&gt;
             &lt;/div&gt;
            &lt;div class="col-sm-6"&gt;
             &lt;h4&gt;Details&lt;/h4&gt;
             &lt;p&gt;One of the best fantasy books in the market&lt;/p&gt;
             &lt;hr/&gt;
             &lt;p&gt;Price: $19.99&lt;/p&gt;
             &lt;p&gt;Writer: Sapkowski&lt;/p&gt;
            &lt;form action="add_cart.php" method="post"&gt;
              &lt;div class="form-group"&gt;
                &lt;div class="col-xs-3"&gt;
                  &lt;label for="quantity" id="quantity-label"&gt;Quantity:&lt;/label&gt;
                  &lt;input type="text" class="form-control" id="quantity" name="quantity"/&gt;
                &lt;/div&gt;&lt;br /&gt;
               &lt;div class="form-group"&gt;
                 &lt;label for="size"&gt;Cover:&lt;/label&gt;
                 &lt;select name="size" id="size" class="form-control"&gt;
                   &lt;option value=""&gt;&lt;/option&gt;
                   &lt;option value="Hardcover"&gt;Hardcover&lt;/option&gt;
                    &lt;option value="Softcover"&gt;Softcover&lt;/option&gt;
                 &lt;/select&gt;
               &lt;/div&gt;
             &lt;/div&gt;
           &lt;/form&gt;
            &lt;/div&gt;
           &lt;/div&gt;
        &lt;/div&gt;
     &lt;/div&gt;
      &lt;div class="modal-footer"&gt;
        &lt;button class="btn btn-default" data-dismiss="modal"&gt;Close&lt;/button&gt;
        &lt;button class="btn btn-warning" type="submit"&gt;&lt;span class="glyphicon glyphicon-shopping-cart"&gt;&lt;/span&gt;Add To Cart&lt;/button&gt;
    &lt;/div&gt;
   &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>