title: AJAX Bootstrap Modal Not Showing
body: <p>I'm trying to show the following modal, where the body is database driven. However this data isnt appearing in the Bootstrap modal. I've been looking at this for far too long and cant see the issue!</p>
  
  <p><strong>Modal</strong></p>
  
  <pre><code>&lt;div class="modal fade" id="eventDetailsModal" tabindex="-1" role="dialog" aria-labelledby="memberModalLabel" aria-hidden="true"&gt;
      &lt;div class="modal-dialog"&gt;
          &lt;div class="modal-content"&gt;
              &lt;div class="modal-header"&gt;
                  &lt;button type="button" class="close" data-dismiss="modal"&gt;&lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;&lt;span class="sr-only"&gt;Close&lt;/span&gt;&lt;/button&gt;
                  &lt;h4 class="modal-title" id="memberModalLabel"&gt;Event Details&lt;/h4&gt;
              &lt;/div&gt;
              &lt;div class="dash"&gt;
  
              &lt;/div&gt;
  
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>AJAX</strong></p>
  
  <pre><code>$('#eventDetailsModal').on('show.bs.modal', function (event) {
        var button = $(event.relatedTarget) // Button that triggered the modal
        var recipient = button.data('whatever') // Extract info from data-* attributes
        var modal = $(this);
        var dataString = recipient;
  
          $.ajax({ 
              type: "GET", 
              url: "/getNearestPC.php", 
              data: {"foo": dataString}, 
              cache: false, 
              success: function (data) { 
                  console.log(data); 
                  console.log(dataString); 
                  console.log(recipient); 
                  $('.dash').html(data); 
              }, 
              error: function(err) { 
                  console.log(err); 
              } 
          });  
  })
  </code></pre>
  
  <p><strong>getNearest.php</strong></p>
  
  <pre><code>    //SQL Setup
      $PC = $_GET['foo']; 
  
  &lt;div class="modal-body center" style="background-color: #FFFFFF"&gt;
      &lt;table id="preusertable" class="table table-striped table-hover table-curved" style="width: 100%;"&gt;
          &lt;thead&gt;
              &lt;tr&gt;
                  &lt;th style="color: #000000;"&gt;Event&lt;/th&gt;
                  &lt;th style="color: #000000;"&gt;Postcode&lt;/th&gt;
              &lt;/tr&gt;
          &lt;/thead&gt;
          &lt;tbody&gt; 
          &lt;?php
              while ($row = $sData-&gt;fetch(PDO::FETCH_ASSOC)) {
                  $school = $row['SchoolURL'];
                  $postcodeFull = $row['Postcode'];
                  ?&gt;
                  &lt;tr&gt;                    
                      &lt;td style="font-size: 1.1em;"&gt;&lt;?php echo $school ?&gt;&lt;/td&gt;
                      &lt;td style="font-size: 1.1em;"&gt;&lt;?php echo $postcodeFull ?&gt;&lt;/td&gt;
                  &lt;/tr&gt;
                  &lt;?php
              }
          ?&gt;
          &lt;/tbody&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><strong>Modal Trigger</strong></p>
  
  <pre><code>&lt;a data-toggle="modal" data-target="#eventDetailsModal" data-whatever="&lt;?php echo $postcode ?&gt;"&gt;
  </code></pre>
  
  <p>Any help would be great! It just show the modal header but no body</p>