Ajax фильтрация постов и пагинация к ним
Есть сайт со страницей блога
На этой странице реализовываю ajax фильтрацию и пагинацию. По сути на клике по каждой кнопке висит ajax запрос вида
jQuery('.tabs-archive__tab').click(function () {
let date = jQuery(this).attr("data-date");
jQuery.ajax({
url: "/wp-admin/admin-ajax.php",
// url: "/wp-content/themes/fruktgroup/functions.php",
data: {
action: 'webazex',
req_type: 'posts',
req: date,
cat: "",
},
type: 'POST',
beforeSend: function () {
jQuery('#loader').removeClass('hide');
jQuery('#loader').addClass('show');
},
complete: function (data) {
jQuery('#loader').removeClass('show');
jQuery('#loader').addClass('hide');
console.log("fin");
},
success: function (data) {
jQuery('.content__grid-section').html(data);
jQuery('#loader').removeClass('show');
jQuery('#loader').addClass('hide');
}
});
jQuery.ajax({
url: "/wp-admin/admin-ajax.php",
// url: "/wp-content/themes/fruktgroup/functions.php",
data: {
action: 'webazex',
req_type: 'paginate',
req: date,
cat: "",
},
type: 'POST',
beforeSend: function () {
jQuery('#loader').removeClass('hide');
jQuery('#loader').addClass('show');
},
complete: function (data) {
jQuery('#loader').removeClass('show');
jQuery('#loader').addClass('hide');
console.log("fin");
},
success: function (data) {
jQuery('.content__webazex-pagination__loli').html(data);
jQuery('#loader').removeClass('show');
jQuery('#loader').addClass('hide');
}
})
});
Что тут происходит: при клике ajax идет по указанному адресу, оттуда через хук дергается функция которая смотрим что за запрос к нам пришел (req_type: 'posts', ) значит что этому запросу нужно вернуть посты, с теми фильтрами что указаны в req: date, cat: "",req_type: 'paginate',`` - идет за пагинацией с теми же параметрами что и для поста . Этот запрос работает, посты приходят.
Также корректно отображается и пагинация которая рендерится этой функцией, но при попытке перейти по ее страницам - фильтр слетает. Вот код на стороне php:
function renderQueryWebazexPosts($date, $cat){
$paged = get_query_var( 'paged' ) ? absint( get_query_var( 'paged' ) ) : 1;
$args = array(
'post_type' => 'post',
'posts_per_page' => 8,
);
if((empty($date) and empty($cat))):
$args = array(
'post_type' => 'post',
'posts_per_page' => 8,
'paged' => $paged,
);
endif;
if(!empty($date)):
$endDate = getEndDate($date);
$args = array(
'post_type' => 'post',
'posts_per_page' => 8,
'paged' => $paged,
'date_query' => array(
array(
'after' => array( // после этой даты
'year' => $endDate[0],
'month' => $endDate[1],
'day' => $endDate[2],
),
'before' => array( // до этой даты
'year' => date("Y"),
'month' => date("m"),
'day' => date("d"),
),
'inclusive'=> true
)
)
);
endif;
if(!empty($cat)):
if(empty($endDate)):
$endDate = array('2001', '01', '01');
endif;
$args = array(
'post_type' => 'post',
'posts_per_page' => 8,
'cat' => $cat,
'paged' => $paged,
'date_query' => array(
array(
'after' => array( // после этой даты
'year' => $endDate[0],
'month' => $endDate[1],
'day' => $endDate[2],
),
'before' => array( // до этой даты
'year' => date("Y"),
'month' => date("m"),
'day' => date("d"),
),
'inclusive'=> true
)
)
);
endif;
if((!empty($data)) and (!empty($cat))):
$endDate = getEndDate($date);
$args = array(
'post_type' => 'post',
'posts_per_page' => 8,
'cat' => $cat,
'paged' => $paged,
'date_query' => array(
array(
'after' => array( // после этой даты
'year' => $endDate[0],
'month' => $endDate[1],
'day' => $endDate[2],
),
'before' => array( // до этой даты
'year' => date("Y"),
'month' => date("m"),
'day' => date("d"),
),
'inclusive'=> true
)
)
);
endif;
global $qw;
$html = '';
$qw = query_posts($args);
foreach($qw as $post):
setup_postdata($post);
$href = get_permalink();
$src = get_the_post_thumbnail_url( null, 'full' );
$cat = get_the_category();
// $catName = $cat[0]->name;
$title = esc_html(get_the_title());
$author = get_the_author();
$date = get_the_date("d F Y");
$count = getPostViews(get_the_ID());
$item = get_post(get_the_ID());
$comments_count = $item->comment_count;
$html .= '<a class="grid-section__item" href="'.$href.'">
<div class="item__overlay-bg" style="'.$src.'"></div>
<div class="item__row-top">
<span class="row-top__category"></span>
<span class="row-top__author">'.$author.'</span>
</div>
<div class="item__title__div"><span class="item__title">'.$title.'</span>
</div>
<div class="item__row-bottom">
<div class="row-bottom__reviews-block">
<div class="reviews-block__rewiews">
<span class="rewiews__icon">
<i class="far fa-eye"></i>
</span>
<span class="rewiews__count">'.$count.'</span>
</div>
<div class="reviews-block__comments">
<span class="comments__icon">
<i class="far fa-comments"></i>
</span>
<span class="comments__count">'.$comments_count.'</span>
</div>
</div>
<span class="row-bottom__date">'.$date.'</span>
</div>
</a>';
endforeach;
wp_reset_postdata();
// $paginate = get_the_posts_pagination( array(
// 'prev_text' => 'Пред.',
// 'next_text' => 'След.',
//) );
$paginate = get_the_posts_pagination(array(
'prev_text' => 'Пред.',
'next_text' => 'След.',
) );
$paginate = str_replace('wp-admin/admin-ajax.php', 'nashi-stati', $paginate);
return array($html, $paginate);
}
function getWebazexPosts($date, $cat){
$res = renderQueryWebazexPosts($date, $cat);
$posts = $res[0];
$paginate = $res[1];
return array($posts, $paginate);
Судя по всему у меня пагинация теряет параметры выборки записей, тот самый "$wp_query" но как заставить ее это не делать - я пока не могу понять.
get_query_var не работает в аяксе, вам заботится об передаче $paged нужно самому в ручном режиме.
Не совсем Вас понял, ведь get_query_var - получает даные текущего запроса, а он у меня должен по идее каждый раз обновляться, при ajax запросе, нет?
Тогда пните пожалуйста в документалку где можно посмотреть о реализации передачи $paged. Писать велики которые будут смотреть по клику на пагинацию, какая там должна была быть страница и потом передавать это в запрос... как то не хочется, может есть поизящнее решение?