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. Писать велики которые будут смотреть по клику на пагинацию, какая там должна была быть страница и потом передавать это в запрос... как то не хочется, может есть поизящнее решение?