Загрузите еще AJAX в WP Query

Я пытаюсь получить цикл запроса AJAX WP Query для вывода 2 сообщений, а затем использовать кнопку «Загрузить еще», чтобы загрузить следующую страницу результатов. Каков наилучший метод подхода, который не работает в настоящее время?

JS

var ajaxRequest=function(){ var filter = $('#filter'); var page = 1; // What page we are on. var ppp = 3; // Post per page $.ajax({ url: filter.attr('action'), data: filter.serialize(), type: 'POST', dataType: 'json', offset: (page * ppp) + 1, ppp: ppp, success: function(response) { page++; $(".card-wrap").append(response); //Post class $("#more_posts").attr("disabled",false); } }); }; 

PHP

 <?php header("Content-type: application/json"); //Outputting as JSON for map data. $offset = $_POST["offset"]; $ppp = $_POST["ppp"]; $args = array( 'order' => $_POST['date'], 'post_type' => 'custom', 'posts_per_page' => 2, 'offset' => $offset, ); [Rest of query] ?> 

HTML

 <a id="more_posts" href="#">Load More</a> 

если вы хотите использовать ajax в wordpress, вам необходимо выполнить следующий шаг: 1) сначала создайте файл js, как main.js.

2) локализовать его в functions.php с помощью wp_localize_script() .

 wp_enqueue_script( 'main.js', get_template_directory_uri().'/js/main.js', array( 'jquery' ) ); wp_localize_script( 'main.js', 'ajax_object', array('ajax_url' => admin_url('admin-ajax.php')) ); 

3) сделайте свой код javascript или jquery для запуска вашего запроса с помощью ajax и в объекте данных ajax добавьте свойство действия, например action: load_more_posts. Это свойство action сделает функцию с тем же именем, чтобы исправить наш код.

 jQuery(function($){ $('#load_more_posts').on('click', function(e){ console.log('hi'); e.preventDefault(); var $offset = $(this).data('offset'); console.log('var'+$offset); $.ajax({ method: 'POST', url: ajax_object.ajax_url, type: 'JSON', data: { offset: $offset, action: 'load_more_posts' }, success:function(response){ console.log(response); $('#load_more_posts').data('offset', parseInt(response.data.offset)); } }); }) }); 

4) В functions.php

  add_action( 'wp_ajax_load_more_posts', 'load_more_posts' ); add_action( 'wp_ajax_nopriv_load_more_posts', 'load_more_posts' ); function load_more_posts(){ global $post; $args = array('post_type'=>'post', 'posts_per_page'=> 2, 'offset'=> $_POST['offset']); $rst=[]; $query = new WP_Query($args); if($query->have_posts()): while($query->have_posts()):$query->the_post(); $rst[] = $post; endwhile; wp_reset_postdata(); $offset = $_POST['offset']+2; endif; wp_send_json_success(array('post'=>$rst, 'offset'=>$offset)); } в  add_action( 'wp_ajax_load_more_posts', 'load_more_posts' ); add_action( 'wp_ajax_nopriv_load_more_posts', 'load_more_posts' ); function load_more_posts(){ global $post; $args = array('post_type'=>'post', 'posts_per_page'=> 2, 'offset'=> $_POST['offset']); $rst=[]; $query = new WP_Query($args); if($query->have_posts()): while($query->have_posts()):$query->the_post(); $rst[] = $post; endwhile; wp_reset_postdata(); $offset = $_POST['offset']+2; endif; wp_send_json_success(array('post'=>$rst, 'offset'=>$offset)); } 

wp_ajax_nopriv_ (действие) выполняется для пользователей, которые не вошли в систему. wp_ajax_ (действие) выполняется для пользователей, которые вошли в систему.

вы можете использовать ответ запроса по своему усмотрению. Надеюсь, это поможет!