如何在Wordpress中使用Ajax获取高级自定义字段值

时间:2018-08-10 09:27:10

标签: ajax wordpress custom-post-type advanced-custom-fields

我正在尝试在WP_query上执行custom-post-type,但是由于某些原因,我无法从这些帖子的custom-field-types中获取值。

这是到目前为止我得到的(functions.php)

function fetch_cases(){

$args = array(
    'post_type' => array('case'),
    'post_status' => array('publish'),
    'posts_per_page' => 5
);


$query = new WP_Query($args);
if($query->have_posts()) {
    while($query->have_posts() ){
        $query->the_post();
        ?>
       <a href="<?php the_permalink(); ?>">
            <div style="background-image:url('<?= get_field('case_picture'); ?>')">
                <p><?= get_field('case_title') ?></p>           
            </div>
        </a>
    <?php }
}
die();

add_action('wp_ajax_nopriv_fetch_cases', 'fetch_cases');
add_action('wp_ajax_fetch_cases','fetch_cases');
}

在我的JS文件中包含以下内容:

$.ajax({
  url: "/wp-admin/admin-ajax.php",
  data: {
    action: "fetch_cases"
  },
  success: function(data) {
    $(".fetch_cases").append(data);
  },
  error: function(errorThrown) {
    console.log(errorThrown);
  }

});

有人可以告诉我我在做什么错吗?

我也尝试这样做:

<?php the_field('case_picture'); ?>

但是没有运气吗?我想念什么?

3 个答案:

答案 0 :(得分:0)

您可以通过将字段存储为隐藏值并通过js传入ajax来使用此逻辑

$query = new WP_Query($args);
if($query->have_posts()) {
    while($query->have_posts() ){
        $query->the_post();
        ?>
       <a href="<?php the_permalink(); ?>">
            <div style="background-image:url('<?= get_field('case_picture'); ?>')">
                <p><?= get_field('case_title') ?></p> 
                <input type="hidden" id="hidden" name="hidden_field" value="<?= get_field('case_picture'); ?>"> // store the value
            </div>
        </a>
    <?php }
}
die();

现在在jquery中获取数据并通过ajax

<script>
    var hidden=//Grab data here.
    $.ajax({
  url: "/wp-admin/admin-ajax.php",
  data: {
    action: "fetch_cases",
    image:hidden, // Pass the data
  },
  success: function(data) {
    $(".fetch_cases").append(data);
  },
  error: function(errorThrown) {
    console.log(errorThrown);
  }
});
</script>

并使用名为ajax的数据

function fetch_cases()
  {
      $image=$_POST['image'];
  }

答案 1 :(得分:0)

get_field方法具有第二个参数,即帖子ID,将其传递并检查。应该可以。

  $post_id = $post->ID;
  $value = get_field( 'case_picture', $post_id );

答案 2 :(得分:0)

add_action()应该在您的自定义函数之外。试试这个吧。

function fetch_cases(){
    $args = array(
        'post_type' => array('case'),
        'post_status' => array('publish'),
        'posts_per_page' => 5
    );

    $query = new WP_Query($args);

    if($query->have_posts()) {
        while($query->have_posts() ){
            $query->the_post();
            ?>
           <a href="<?php the_permalink(); ?>">
                <div style="background-image:url('<?= get_field('case_picture'); ?>')">
                    <p><?= get_field('case_title') ?></p>           
                </div>
            </a>
        <?php }
    }
    die();
}

add_action('wp_ajax_nopriv_fetch_cases', 'fetch_cases');
add_action('wp_ajax_fetch_cases','fetch_cases');