title: Passing PHP variable ID to create and fetch dynamic Modal content
body: <p>I tried several answers here but I think I am completely lost about figuring my issue.</p>
  
  <p>So, I am creating post list of different post for Book article which each of the article have different contents to pull-out from the backend. To ease the multiple-click-page, I chose to use Modal. Got some info red from some Bootstrap Modal answers comparing/using it to my UIKit Modal, but it seems not working correctly.</p>
  
  <p>This is mixed of WordPress and Core Function of UIKit Modal</p>
  
  <p><strong>Code Fig.1</strong></p>
  
  <pre><code>&lt;a href="" class="uk-button uk-button-primary uk-width-1-1" data-content="&lt;?php echo $post-&gt;ID; ?&gt;" data-uk-modal="{target:'#book-info',bgclose:false,center:true}"&gt;&lt;?php echo $book_button; ?&gt;&lt;/a&gt;
  </code></pre>
  
  <p>- Modal Trigger</p>
  
  <pre><code>&lt;div id="book-info" class="uk-modal"&gt;
    &lt;div class="uk-modal-dialog"&gt;
      &lt;a class="uk-modal-close uk-close"&gt;&lt;/a&gt;
      &lt;div class="fetched-data"&gt;
        &lt;!-- Content To Fetch --&gt;
      &lt;/div&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>- Modal Container</p>
  
  <p><strong>Code Fig.2</strong></p>
  
  <pre><code>$(document).ready(function(){
    $('.uk-modal').on({
      'show.uk.modal': function(){
        var postID = $(e.relatedTarget).data('content');
  
        $.ajax({
          type: 'post',
          url: 'wp-content/themes/mytheme/inc/structures/modal/modal-book.php',
          data: 'data='+ postID,
          success: function(data) {
            $('.fetched-data').html(data);
          }
        });
      }
    });
  });
  </code></pre>
  
  <p>- Ajax Script</p>
  
  <p><strong>Code Fig.3</strong></p>
  
  <pre><code>&lt;?php
  $postID = $_GET['data'];
  $postname = new WP_Query([ 'post_type' =&gt; 'causes', 'posts_per_page' =&gt; 1, 'p' =&gt; $postID ]);
  
  while ( $postname-&gt;have_posts() ) : $postname-&gt;the_post();
  
    the_field('content_modal_box');
    echo '&lt;br&gt;';
    echo $post-&gt;post_name;
  
  endwhile;
  
  wp_reset_postdata();
  </code></pre>
  
  <p>- modal-book.php file</p>
  
  <p><strong>Code Issue 1</strong></p>
  
  <blockquote>
    <p>Failed to load resource: the server responded with a status of 500 (Internal Server Error)</p>
  </blockquote>
  
  <p>This is my message from the console, reflecting to my path: <code>wp-content/themes/mytheme/inc/structures/modal/modal-book.php</code></p>
  
  <p><strong>Conclusion</strong></p>
  
  <p>On the first thought, I don't know if the code was technically passing my variable through the <code>Ajax</code> and I am not sure why it was responding as 500 (Internal Server Error). Hope you can help me figure out the it.</p>