Я хочу загружать содержимое постов по категориям с помощью Ajax.

У меня есть вопрос. Я бы хотел загрузить контент поста, пользовательский пост, в зависимости от категории. Во-первых, я хотел бы создать выпадающее меню, которое будет перечислять все мои категории, затем, как только пользователь выберет категорию, список заголовков постов появится во втором выпадающем меню (посты из этой конкретной категории), затем, как только заголовок будет выбран, контент поста загрузится. Все это должно быть сделано на одной странице и без перезагрузки, поэтому с использованием Ajax. Я застрял в самом начале

<script type="text/javascript">
$(function(){
            $('#main_cat').change(function(){
                    var $mainCat=$('#main_cat').val();

                    // вызов ajax
                     $("#sub_cat").empty();
                        $.ajax({
                            url:"/wp-admin/admin-ajax.php",
                            type:'POST',
                                                        data:'action=my_special_action&main_catid=' + $mainCat,

                             success:function(results)
                                 {
                                //  alert(results);
                $("#sub_cat").removeAttr("style");
                $("#sub_cat").append(results);
                                        }
                                   });
                          }
                                    );
});
</script>

И я нашел часть кода, которая была вставлена в function.php, и я понимаю, что ее нужно как-то изменить, чтобы вытягивать посты, а не дочерние категории

add_action('wp_ajax_my_special_action', 'my_action_callback');
add_action('wp_ajax_nopriv_my_special_action', 'my_action_callback');
function implement_ajax() {
if(isset($_POST['main_catid']))
            {
            $categories=  get_term_by('child_of=".$_POST["main_catid'].'&hide_empty=0');
              foreach ($categories as $cat) {
                $option .= '<option value="'.$cat->term_id.'">';
                $option .= $cat->term_id;
                $option .= ' ('.$cat->category_count.')';
                $option .= '</option>';
              }

              echo '<option value="-1" selected="selected">Scegli...</option>'.$option;
            die();
            } // end if
}
add_action('wp_ajax_my_special_ajax_call', 'implement_ajax');
add_action('wp_ajax_nopriv_my_special_ajax_call', 'implement_ajax');//для пользователей, которые не вошли в систему.

Вот так далеко я продвинулся. Буду признателен за любую помощь

Здесь я разработал простой демо, чтобы получить данные поста в зависимости от категории без перезагрузки страницы с использованием Ajax и jQuery.

Вот основные категории, подкатегории и выпадающие списки постов :

$args = array(
        'orderby' => 'name',
        'hierarchical' => 1,
        'taxonomy' => 'category',
        'hide_empty' => 1,
        'parent' => 0,
        );
        $categories = get_categories($args);
        ?>
        <select id="main_cat">
            <option value="0">-----Select Category------</option>
        <?php
        foreach($categories as $category) {
            $option .= '<option value="'.$category->cat_ID.'">';
                 $option .= $category->name;
                $option .= '</option>';

        } 
        echo $option;
        ?>
                    </select>
    <select id="sub_cat">
    <option value="0">-----Select Sub Cat------</option> 
    </select>
    <select id="get_this_post">
    <option value="0">------Select Post-----</option> 
    </select>
    <div id="post-content-wrapper">
    </div> 

Теперь часть с jQuery: получение событий изменения выпадающих списков и получение данных с использованием ajax-действия.

frontend_ajax_object — это объект ajax url. Вы должны изменить его в зависимости от того, как вы его определили.

<script type="text/javascript">
jQuery(function($){
            $('#main_cat').change(function(){
                    var $mainCat=$('#main_cat').val();

                    // вызов ajax
                    console.log(frontend_ajax_object.ajaxurl);
                     $("#sub_cat").empty();
                     $("#get_this_post").empty();
                      $("#post-content-wrapper").html("");
                        $.ajax({
                            url:frontend_ajax_object.ajaxurl,
                            type:'POST',
                             data:'action=get_sub_category&main_catid=' + $mainCat,
                             success:function(results)
                             {
                                //  alert(results);
                                    $("#sub_cat").removeAttr("style");
                                    $("#sub_cat").append(results);
                             }
                        });
                     }
             );

             $('#sub_cat').change(function(){
                    var $sub_catid=$('#sub_cat').val();

                    // вызов ajax
                     $("#get_this_post").empty();
                     $("#post-content-wrapper").html("");
                        $.ajax({
                            url:frontend_ajax_object.ajaxurl,
                            type:'POST',
                             data:'action=get_sub_category_posts&sub_catid='+ $sub_catid,
                             success:function(results)
                             {
                               //  alert(results);
                                // $("#sub_cat").removeAttr("style");
                                  $("#get_this_post").append(results);
                             }
                        });
                     }
             );

             $('#get_this_post').change(function(){
                    var $get_this_post=$('#get_this_post').val();

                    // вызов ajax
                     $("#post-content-wrapper").html("");
                        $.ajax({
                            url:frontend_ajax_object.ajaxurl,
                            type:'POST',
                             data:'action=get_page_data&this_post_id='+ $get_this_post,
                             success:function(results)
                             {
                               //  alert(results);
                                $("#post-content-wrapper").html(results);
                             }
                        });
                     }
             );
});
</script>

Теперь, вот функция ajax, которая использована для получения данных на основе выбранных полей.

add_action('wp_ajax_get_sub_category', 'get_sub_category');
add_action('wp_ajax_nopriv_get_sub_category', 'get_sub_category');
function get_sub_category() {
    if(isset($_POST['main_catid']))
    {
        global $post;

        if(!empty($_POST['main_catid']))
        {
            $args = array('parent' => $_POST['main_catid']);
            $categories = get_categories( $args );
            $option = "<option value="0">Select sub cat</option>";
            foreach($categories as $category) { 
                $option .= '<option value="'.$category->term_id.'">';
                 $option .= $category->name;
                $option .= '</option>';

            }
            echo $option;
            wp_die();
        } // end if
    }
}

add_action('wp_ajax_get_sub_category_posts', 'get_sub_category_posts');
add_action('wp_ajax_nopriv_get_sub_category_posts', 'get_sub_category_posts');
function get_sub_category_posts() {
    if(isset($_POST['sub_catid']))
    {
        global $post;

        if(!empty($_POST['sub_catid']))
        {
            $args = array( 'posts_per_page' => 5, 'offset'=> 0, 'category' => $_POST['sub_catid'] );

            $myposts = get_posts( $args );
            $option = "<option value="0">Select Post</option>";
            foreach( $myposts as $post ) : setup_postdata($post); 
                 $option .= '<option value="'.get_the_ID().'">';
                 $option .= get_the_title();
                $option .= '</option>';
            endforeach; 
            echo $option;
            wp_die();
        } // end if
    }
}
add_action('wp_ajax_get_page_data', 'get_page_data');
add_action('wp_ajax_nopriv_get_page_data', 'get_page_data');
function get_page_data() {
    if(isset($_POST['this_post_id']))
    {
        global $post;

        if(!empty($_POST['this_post_id']))
        {
            $p_id= $_POST['this_post_id'];

            echo '<h1>'.get_the_title($p_id).'</h1>';
            echo '<p class="the_content">'.get_post_field('post_content', $p_id).'</p>';

            wp_die();
        } // end if
    }
}

Я надеюсь, что это демо поможет вам. Я тестировал, и оно работает нормально. Дайте знать, если это вам поможет!

Спасибо!