title: Ajax POST results show empty values - ACF
body: <p>I've created an AJAX function to "Show More" custom post types when the user clicks the corresponding button. The function works and populated the page but returns empty values/elements. I am currently using ACF and attempting to store the data in variables to be used in my functions.php, but unfortunately to no success. Any thoughts?</p>
  
  <p><strong>Initial Script Enqueue function</strong></p>
  
  <pre><code>function synchrony_theme_scripts() {
    wp_enqueue_script('main-js', get_template_directory_uri() . '/js/script.js', array('jquery'), '', true);
  
    wp_localize_script('main-js', 'team_ajax', array(
      'ajaxurl' =&gt; admin_url( 'admin-ajax.php' )
    ));
  }
  </code></pre>
  
  <p><strong>Jquery AJAX Function</strong></p>
  
  <pre><code>var count = 0;
  
  function load_more_team(count) {
  
      var button = $('#more_posts'),
          count = count + 12,
          data =  {
              'action': 'ajax_more_team',
              'offset': count 
          }
  
      $.ajax({
          url: team_ajax.ajaxurl,
          data: data,
          type: 'POST',
          dataType: 'html',
          success: function(data){
              if(data.length){
                  $("#ajax_posts").append(data);
                  button.attr("disabled",false);
              } else{
                  button.attr("disabled",true);
              }
          }
      });
      return false;
  }
  
  $('#more_posts').click(function() {
      $("#more_posts").attr("disabled",true);
      load_more_team();
  });
  </code></pre>
  
  <p><strong>AJAX Handler in Functions.php</strong></p>
  
  <pre><code>function ajax_more_team($offset) {
  
  $offset = $offset + 12;
  
  header("Content-Type: text/html");
  
  $args = array(
      'post_type' =&gt;  'team',
      'posts_per_page'    =&gt;  12,
      'offset'    =&gt;  $offset
  );
  
  $the_query = new WP_Query($args);
  
  $id = get_the_id(); 
  $headshot = the_field('employee_headshot');
  $name = the_field('employee_name');
  $title = the_field('employee_title');
  $company = the_field('employee_company');
  $url = get_template_directory_uri();
  
  $out = '';
      if ($the_query -&gt; have_posts()) :  while ($the_query -&gt; have_posts()) : $the_query -&gt; the_post();
          $id = get_the_id(); 
          $name = the_field('employee_name');
  
          $out .= '&lt;div class="col-6 col-md-4 col-lg-3 col-xl-2 mb-4"&gt;
                      &lt;div class="team-member"&gt;
                          &lt;a href="#" data-toggle="modal" data-target="#'.$id.'"&gt;
                              &lt;img class="img-fluid" src="'.$headshot.'" alt="'.$headshot.'"&gt;
                          &lt;/a&gt;
                          &lt;div class="team-info"&gt;
                              &lt;h6&gt;'.$name.'&lt;/h6&gt;
                          &lt;/div&gt;
                          &lt;a href="" data-toggle="modal" data-target="#myModal"&gt;
                              &lt;div class="modal-icon"&gt;
                                  &lt;img class="img-fluid" src="'.$url.'/imgs/modal-icon.svg"&gt;
                              &lt;/div&gt;
                          &lt;/a&gt;
                      &lt;/div&gt;
                      &lt;!-- Modal --&gt;
                      &lt;div class="modal fade" id="'.$id.'" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true"&gt;
                          &lt;div class="modal-dialog" role="document"&gt;
                              &lt;div class="modal-content"&gt;
                                  &lt;div class="team-close-btn"&gt;
                                      &lt;button type="button" class="close" data-dismiss="modal" aria-label="Close"&gt;
                                          &lt;span aria-hidden="true"&gt;&amp;times;&lt;/span&gt;
                                      &lt;/button&gt;
                                  &lt;/div&gt;
                                  &lt;div class="modal-body"&gt;
                                      &lt;img class="img-fluid" src="'.$headshot.'" alt="Alice George"&gt;
                                      &lt;div class="team-info"&gt;
                                          &lt;h6&gt;'.$name.'&lt;/h6&gt;
                                          &lt;p&gt;&lt;strong&gt;Title:&lt;br&gt;&lt;/strong&gt;'.$title.'&lt;/p&gt;
                                          &lt;p&gt;&lt;strong&gt;Company:&lt;br&gt;&lt;/strong&gt;'.$company.'&lt;/p&gt;
                                      &lt;/div&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;';
          endwhile;
      endif;
      wp_reset_postdata();
      die($out);
  }
  
  add_action('wp_ajax_nopriv_ajax_more_team', 'ajax_more_team');
  add_action('wp_ajax_ajax_more_team', 'ajax_more_team');
  
  ?&gt;
  </code></pre>
  
  <p>I added the $id and $name vars in the loop to test if the data is pulled and it populates, just does not include in the desired areas.</p>