WordPress AJAXはポップアップdivにコンテンツを投稿します

Question

WordPressを使用して、AJAXを使用してポップアップのコンテンツを読み込もうとしていますが、動作させることができないようです。私は正しい軌道にいると思いますが、私は実際に開発者ではないので、いくつかの助けが必要です！

thisのようなものを達成したいと思います。だからここに私の（関連）のコードでは、これまでのところです：

<div id="popUp"> 
     <div class="fermePop">X</div> 
     <div id="contenuPop"></div> 
    </div> 
    ... 
    if ($query->have_posts()): ?> 
       <div class="tagged-posts"> 
        <?php while ($query->have_posts()) : $query->the_post(); ?> 
        <a href="<?php the_permalink(); ?>" <?php post_class('tiles'); ?> rel="<?php the_ID(); ?>"> 
         <?php the_post_thumbnail(); ?> 
         <h2><?php the_title(); ?></h2> 
        </a> 
        <?php endwhile; ?> 
       </div> 

      <?php else: ?> 
       <div class="tagged-posts"> 
        <h2>No posts found</h2> 
       </div> 
      <?php endif; ?> 

Single.php

<?php 

function is_ajax() { 
    return isset($_SERVER['HTTP_X_REQUESTED_WITH']) 
     && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest'; 
} 

if (is_ajax()) { 
    get_header(); 
} ?> 

<?php if (have_posts()) : 
while (have_posts()) : the_post(); ?> 
    <div id="single-post post-<?php the_ID(); ?>"> 
     <h2><?php the_title(); ?></h2> 
     <div class="contenu"> 
      <?php the_content(); ?> 
     </div> 
    </div> 
<?php endwhile; ?> 
<?php endif; ?> 

<?php 
if (is_ajax()) { 
    get_footer(); 
} 
?> 

function.php

function ajax_load_projets(){ 
    wp_register_script('ajax_load_projets', get_template_directory_uri() . '/js/ajax-load-projets.js', false, null, false); 
    wp_enqueue_script('ajax_load_projets'); 
    wp_localize_script('ajax_load_projets', 'load_projets_vars', array(
     'load_projets_ajaxurl' => admin_url('admin-ajax.php'), 
     ) 
    ); 
} 
add_action('wp_enqueue_scripts', 'ajax_load_projets'); 

add_action('wp_ajax_load-single-post', 'prefix_ajax_single_post'); 
add_action('wp_ajax_nopriv_load-single-post', 'prefix_ajax_single_post'); 

function prefix_ajax_single_post() { 
    $pid = (int) filter_input(INPUT_GET, 'pID', FILTSER_SANITIZE_NUMBER_INT); 
    if ($pid > 0) { 
    global $post; 
    $post = get_post($pid); 
    setup_postdata($post); 
    printf('<div id="single-post post-%d">', $pid); 
    the_title(); 
    the_content(); 
    echo '</div>'; 
    } 
    exit(); 
} 

そしてfinaly：私のページportfolio.phpで

、私のJQueryスクリプト：

jQuery(document).ready(function($) { 
    $.ajaxSetup({cache:false}); 

    $(".tiles").click(function(event){ 

     if (event.preventDefault) { 
      event.preventDefault(); 
     } else { 
      event.returnValue = false; 
     } 

     var postID = $(this).attr('rel'); 
     var $container = $("#contenuPop"); 

     $('.filtre').show(); 
     $("#popUp").show(); 
     $container.html("Je charge!"); 

     data={ 
      action: 'prefix_ajax_single_post', 
      pID: postID, 
     }; 

     $.post(load_projets_vars.load_projets_ajaxurl, data, function(content) { 
      $container.html(content); 
     }); 
    }); 

    function fermePop(){ 
     $('.filtre').hide(); 
     $("#popUp").hide(); 
    } 

    $(".filtre").click(function(){ 
     fermePop(); 
    }); 

    $(".fermePop").click(function(){ 
     fermePop(); 
    }); 

}); 

これは私の初めてのアヤックスなので、何が間違っているのか分かりません。

Answer 1

これを試してください。

function prefix_ajax_single_post() { 

     $pid = $_REQUEST['pID']; 
     if ($pid > 0) { 
     global $post; 
     $post = get_post($pid); 
     setup_postdata($post); 
     printf('<div id="single-post post-%d">', $pid); 
     the_title(); 
     the_content(); 
     echo '</div>'; 
     } 
     exit(); 
    } 

    add_action('wp_ajax_prefix_ajax_single_post', 'prefix_ajax_single_post'); 
    add_action('wp_ajax_nopriv_prefix_ajax_single_post', 'prefix_ajax_single_post'); 

Answer 2

prefix_ajax_single_post（）関数で$ pidが正しく取得されていません。あなたがデータを投稿しているので、あなたはできます：

$pid = $_POST['pID'];