Wordpress - 针对单个POST,而不是POST类型。 AJAX / PHP

时间:2014-08-21 13:43:00

标签: javascript php ajax wordpress

我正在尝试在点击帖子标题时加载点击进入页面的各个帖子信息。我已经设法让我的脚本循环遍历post数组中的标题,然后点击将帖子标题再次加载到div中。我希望这可以在点击时加载单个帖子信息。

PHP Post Array Functions -

add_action( "wp_ajax_success_stories", "sa_get_paginated_posts" );
add_action( "wp_ajax_nopriv_success_stories", "sa_get_paginated_posts" );

function sa_get_paginated_posts(){

      $args = array(
          'posts_per_page'  => -1,
          'post_type'       => 'success-stories',
          'orderby'         => 'post_date',
          'order'           => 'DESC' 
      );

      $the_query = new WP_Query( $args );
      $queryitems = $the_query->get_posts();
      $alldata = array();

      if ($queryitems){

        foreach ($queryitems as $query_item){

          $success_story = array();

          $success_story["ID"] = $query_item->ID;
          $success_story["title"] = $query_item->post_title;

          $alldata[] = $success_story;

        }

      }

      $encoded_data = json_encode($alldata);

      echo $encoded_data;

      die();

  }



function sa_get_posts($post_amount, $post_type){

    $args = array(
        'posts_per_page'  => $post_amount,
        'post_type'       => $post_type,
        'offset'          => 0,
        'orderby'         => 'post_date',
        'order'           => 'ASC'

    );

使用此功能循环 -

      <? if ($success_stories): //success story posts ?>
            <ul class="small-block-grid-3">
                <? foreach ($success_stories as $success_story): 
                    $title = $success_story->post_title; ?>

                    <li><a data-id="<? echo $success_story->ID; ?>" class="success-extra" href="#" title=""><? echo $title; ?></a></li>

                <? endforeach; ?>
            </ul>

          <div id="success-list"></div>
          <a class="success-close" href="#" title="">CLOSE</a>

    <? endif; ?>

Javascript / AJAX Call

  var $json_response_box = $("#success-list");

  function get_ajax_success_posts() {

    //this line gets the id attribute from the link
    var current_story = $(this).attr("data-id");
    console.log(current_story);

    jQuery.ajax({
        type: "GET",
        url: "WORDPRESSDIRECTORY/admin-ajax.php",
        cache: true,
        data: {
            action: "success_stories"
        },
        dataType: "JSON",
        success: function(data) {

            var arrayLength = data.length;

            for (var i = 0; i < arrayLength; i++) {


                var success_id = data[i].ID;
                var success_title = data[i].title;

                console.log(success_id);

                story = '<ul>';
                  story += '<li>';
                    story += success_title;
                  story += '</li>';
                story += '</ul>'; 

                $json_response_box.append(story).fadeIn(1000);

            }
        },
        error: function(errorThrown) {
            console.log("fail-posts");
        }
    });
  }

感谢您的建议,

d

1 个答案:

答案 0 :(得分:1)

如果我正确理解你的问题,你应该添加另一个php函数和AJAX调用,以获得点击的帖子,类似这样的东西(我还添加了nonce来添加一些安全性,它总是一个好主意将其添加到您的ajax调用中)

HTML:

<li><a data-id="<? echo $success_story->ID; ?>" data-nonce="<?php wp_create_nonce('get_post'.$success_story->ID); ?>" class="success-extra" href="#" title=""><? echo $title; ?></a></li>

PHP:

add_action( "wp_ajax_sa_get_post", "sa_get_post" );
add_action( "wp_ajax_nopriv_sa_get_post", "sa_get_post" );

function sa_get_post(){
    if ( ! wp_verify_nonce( $nonce, 'get_post_'.$POST['id'] ) ) {
    // This nonce is not valid.
    $response['status'] = 'fail'; 
    } else {
    // The nonce was valid.
    $post = get_post($POST['id']);
    $response['status'] = 'success'; 
    $response['post'] = $post;        
    } 
    echo json_encode($response);
    exit(); // this is needed, as otherwise the AJAX returns an extra 0       
}

JS:

 $('.success-extra').on('click', function () {
     jQuery.ajax({
        type: "POST",
        url: "WORDPRESSDIRECTORY/admin-ajax.php",
        cache: false,
        data: {
            action: "sa_get_post",
            id: $(this).attr('data-id'),
            nonce: $(this).attr('data-nonce')
        },
        success: function(data) {
            var result = $.parseJSON(data);
            if (result.status != 'success') {
               // display error messago or something
            } else {

              // do whatever you want with your result.post
            }
        }

 })

希望这有帮助。