M
M
Maxim Demidov2021-12-24 20:01:19
AJAX
Maxim Demidov, 2021-12-24 20:01:19

How to paginate the result of an Ajax request (Wordpress)?

Greetings to all, dear habrovtsy! There was such task, like and simple, but all head broke. The point is. I have a category page that displays posts. On the same page there is a search form in which I pass the category variable to the ajax request through a hidden field

<form  role="search" method="get" class="" id="searchform" action="">
                  <input class="search-form__input input-search ajax_preloader" type="text"  value="<?php echo get_search_query() ?>" name="s" id="s" autocomplete="off"  placeholder="What are you looking for?"/><div id="ajax_preloader"><img src="/images/circle.gif" alt=""/></div>
          <input type="hidden" name="category_id" class="category_id"  value="<?php echo $category->cat_ID; ?>"/>
                  <button type="button" id="searchsubmit" class="search-button"><img src="/svg/search-icon-block.svg" alt="" />
                  </button>
                </form>

Processed in Ajax (I transfer a lot of things there from different forms)
$('#searchform input').keydown(function(event){
      if(event.keyCode == 13){
        event.preventDefault();
          
    let search_value = $('.search-form__input').val();
        let cat_id = $('.category_id').val();
    let author_name = $('.author_name').val();	
    let tag_id = $('.tag_id').val();	
    let year_num = $('.year_num').val();
    let month_num = $('.month_num').val();
    let day_num = $('.day_num').val();		
        if (search_value.length > 2) { // кол-во символов
    $('#ajax_preloader').show();		
            $.ajax({
                url: '/wp-admin/admin-ajax.php',
                type: 'POST',
                data: {
                    'action': 'ajax_search', // functions.php 
                    'term': search_value,
          'cat_id': cat_id,
          'author_name': author_name,
          'tag_id': tag_id,
          'year_num': year_num,
          'month_num': month_num,
          'day_num': day_num,
                },
        
                success: function (results) {
                    search_results.fadeIn(200).html(results);
          $('#ajax_preloader').hide();
                }
            });
        } else {
            search_results.fadeOut(200);
      
        }

And pass it to the handler
// ajax поиск по сайту 
add_action('wp_ajax_nopriv_ajax_search', 'ajax_search');
add_action('wp_ajax_ajax_search', 'ajax_search');
function ajax_search()
{
    $args = array(
        'post_type'      => 'post', 
        'post_status'    => 'publish',
        'order'          => 'DESC',
      //'posts_per_page' => -1, 
        'orderby'        => 'date',
        's'              => $_POST['term'],
      'cat' => $_POST['cat_id'],
      'author_name' => $_POST['author_name'],
      'tag_id' => $_POST['tag_id'],
      'date_query' => array(
    array(
      'year'  => $_POST['year_num'],
      'month' => $_POST['month_num'], 
      'day'   => $_POST['day_num'],
    ),
  ),
    );
add_filter( 'posts_search', 'search_by_title', 10, 2 );
    $query = new WP_Query($args);
remove_filter( 'posts_search', 'search_by_title', 500 );

  echo '<span class="search_text">You have';
  echo '<span class="search_count">'.$query->found_posts. '</span>';
  echo 'search results</span>';
    if ($query->have_posts()) {
        while ($query->have_posts()) {
            $query->the_post(); 
             get_template_part('loop');
        }
    } else { ?>
        <div class="ajax-search__item">
            <div class="ajax-search__not-found">Nothing found</div>
        </div>
<?php }

    exit;

}


Everything is OK, the cycle is output, it seems it's time to rejoice, but ... And how to make pagination of the output result? I looked and tried different options, the standard pagination does not work in this cycle. ..How to properly break the cycle into segments, for example, ten posts each, and show them, for example, by clicking on 1,2,3, etc.?

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question