1

I have a world map on a WordPress page. I'd like to load a particular post onto the page depending on what region of the map is clicked. I'm writing this as a plugin for my site. Here is what I have now:

index.php:

function get_post_data(){

  // Switch based on region
  switch($_REQUEST['region']) {
    //Asia
    case 'China':
    case 'Japan':
        class Post{
            function get_post(){
                global $more;
                $more = 0;
                query_posts('p=122');
                if(have_posts()) : while(have_posts()) : the_post();
                 the_title( '<h2>', '</h2>' ); 
                 the_post_thumbnail('medium'); 
                 the_content( '<p>', '</p>' ); 
                endwhile;
                endif;
                wp_reset_query();
            }
        }
      break;

    //Middle East
    case 'Pakistan':
    case 'Afghanistan':
        class Post{
            function get_post(){
                global $more;
                $more = 0;
                query_posts('p=123');
                if(have_posts()) : while(have_posts()) : the_post();
                 the_title( '<h2>', '</h2>' ); 
                 the_post_thumbnail('medium'); 
                 the_content( '<p>', '</p>' ); 
                endwhile;
                endif;
                wp_reset_query();
            }
        }
      break;
    //etc
  }

  $post = new Post();
  $post->get_post();
  echo json_encode($post);
  die();
}

add_action('wp_ajax_get_post_data', 'get_post_data');
add_action('wp_ajax_nopriv_get_post_data', 'get_post_data');
?>

start.js:

onRegionClick: function(element, code, region)
{
    $.ajax(get_data.ajaxurl, {
        data: {region: region, 'action': 'get_post_data'},
        dataType: 'json',
        success: function(response) {
            $("#post").html(response);
        }
    });

}

the AJAX response is returning all of the markup related to the posts I want, but it’s not outputting it to the #post div. So I know the AJAX, the switch, and the map are set up properly. I just don't know how to assign a WP post to a variable that I can then output in JSON. I think it has something to do with get_the_content() but I’m not sure how to properly use that….

jadle
  • 147
  • 2
  • 13

1 Answers1

1

Revise the following and it should work:

  • Don't use query_posts. For this kind of query, get_posts() is the good one. But as you're pulling just one post, then get_post() is enough.

  • You're duplicating the declaration of your class and buried inside a switch. It should go to the root and pass the post ID to the custom method get_post( $ID ).

It would be something like this (untested):

class Post{
    function get_post( $ID ){
        $html = '';
        $post = get_post( $ID );
        if( $post ) {
            $html = $post->post_title;
            $html .= wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'full' );
            $html .= $post->post_content;
        }
        return $html;
    }
}

function get_post_data(){
    $post = new Post();
    $result = '';

    switch( $_REQUEST['region'] ) {

        case 'China':
        case 'Japan':
            $result = $post->get_post( 122 );
        break;

        case 'Pakistan':
        case 'Afghanistan':
            $result = $post->get_post( 123 );
        break;
    }

    echo json_encode($result);
    die();
}

add_action( 'wp_ajax_get_post_data', 'get_post_data' );
add_action( 'wp_ajax_nopriv_get_post_data', 'get_post_data' );
Community
  • 1
  • 1
brasofilo
  • 25,496
  • 15
  • 91
  • 179
  • Wow that makes so much more sense than what I was trying... Thanks! running great now! – jadle Sep 20 '14 at 18:47
  • 1
    [Check this](http://stackoverflow.com/questions/13498959/how-to-use-ajax-in-a-wordpress-shortcode/13614297#13614297) to improve your Ajax calls. Also, maybe you could assign the post ID on the map declaration and the call Ajax will be simplified to a single `get_post()` without any switch. – brasofilo Sep 20 '14 at 18:53
  • I've run into one issue with this method: One of the posts I'm loading always has the word "Array" before the content. It's only showing on one, the 5 other posts I'm loading display fine... any idea why that's happening? – jadle Sep 25 '14 at 15:40