如何使用此ajax每页过滤器页面进行分页?

时间:2019-06-03 22:36:16

标签: jquery ajax wordpress pagination

我使用ajax创建了一个动态过滤器,该过滤器根据用户选择的帖子数量选项将内容加载到页面上。可以了我遇到的问题是试图提出一种对返回的帖子也使用分页的方法。

我尝试使用javascript来切换页面的网址并重新加载用户选择的帖子数。无论哪种方式,分页均不起作用。使用ajax,当wordpress将/ page /#附加到url时,分页变得混乱。

functions.php

add_action('wp_ajax_myfilter', 'psc_tax_filter');
add_action('wp_ajax_nopriv_myfilter', 'psc_tax_filter');

function psc_tax_filter(){
    if( isset( $_POST['ppp'] ) )
        $paged = ( get_query_var('paged') ) ? get_query_var('paged') : 1;
        $args = array(
            'post_type' => 'products',
            'posts_per_page' => $_POST['ppp'],
            'tax_query' => array(
                array(
                    'taxonomy' => 'product-category',
                    'field'    => 'slug',
                    'terms'    => $_POST['term']
                ),
            ),
        );

    $query = new WP_Query( $args );

    <-- LOOP STUFF -->

};
template code

<div id = "sorter">
<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="tax-filter">
  <label class = "mb-0">
  <select name="ppp">
    <option value="1">Show 1 Per Page</option>
    <option value="2">Show 2 Per Page</option>
    <option value="3">Show 3 Per Page</option>
    <option value="-1">Show All</option>
  </select>

<?php //get the post taxonomy term
$obj = get_queried_object(); ?>
  <input type="hidden" name="term" value="<?php echo $obj->slug; ?>">
  <input type="hidden" name="action" value="myfilter">
</form>

<div id="spinner"><img src="<?php echo get_stylesheet_directory_uri(); ?>/img/spinner.gif">
</div>
</div><!-- #sorter -->

<div id = "sortedPosts"></div>

javascript

$('#tax-filter').change(function() {
    var filter = $('#tax-filter');
    $.ajax({
        url:filter.attr('action'),
        data:filter.serialize(),
        type:filter.attr('method'),
        beforeSend:function(xhr){
            $('#spinner').toggle();
        },
        success:function(data){
            $('#spinner').toggle();
            $('#sortedPosts').html(data);
        }
    });
    return false;
});

我希望能够在帖子之后添加一个分页元素,这将允许用户单击以转到下一个帖子,等等。

0 个答案:

没有答案