Wordpress Ajax - 按类别过滤产品 - 默认显示所有

时间:2021-01-19 15:41:24

标签: php ajax wordpress woocommerce

我有代码可以在 /products 页面上按类别列出类别和产品。

当我点击“全部”时,它会列出所有产品,但是当我进入/products页面时,默认情况下它不会列出所有产品,我需要点击 “全部”获取所有产品列表。

我的问题是,当我转到产品页面时,无论类别如何,我都无法列出所有产品。默认情况下,当我进入 /products 页面而不点击任何类别或 All 链接时,如何获取所有产品?我希望所有 -link 默认为“活动”。

我的functions.php

function add_custom_scripts() {
wp_enqueue_script( 'ajax_term', get_stylesheet_directory_uri() . '/ajax/ajax-terms.js', array('jquery'), NULL, true );
wp_localize_script( 'ajax_term', 'wpAjax', array('ajaxUrl' => admin_url('admin-ajax.php')));    
}
add_action( 'wp_enqueue_scripts', 'add_custom_scripts' );

Products.php - /products 页面

<div class="categories">
<ul class="categories-filter" name="categoryfilter">
    <li><a type="button" data-posttype="product" class="js-filter-item" href="<?php echo home_url(); ?>">All</a></li>
    <?php
    if( $terms = get_terms( array( 
        'taxonomy' => 'product_cat' ) ) ) : 

        foreach ( $terms as $term ) :
        
         ?>
        <li>
            <a type="button" data-category="<?php echo $term->term_id; ?>" 
                data-posttype="product" 
                    data-taxonomy="<?php echo $term->taxonomy; ?>" class="js-filter-item" href="<?php echo $term->term_id; ?>" >
                <?php echo $term->name; ?>
        </a>
        </li>
    <?php 
          endforeach; 
          endif; 
    ?>
</ul>
</div>

<div id="response"></div>

Ajax-terms.js

(function($){

$(document).ready(function(){
    $(document).on('click', '.js-filter-item', function(event){
        (event).preventDefault();

        var category = $(this).data('category');

        $.ajax({
            url: wpAjax.ajaxUrl,
            data: { 
                action: 'filterterm', 
                category: category, 
                taxonomy:  $(this).data('taxonomy'),
                posttype:  $(this).data('posttype')
                },
            type: 'post',
            success: function(result){
                $('#response').html(result);
            },
            error: function(result){
                console.warn(result);
            }
        });
    });
});
})(jQuery);

functions.php

中的回调
<?php

add_action('wp_ajax_nopriv_filterterm', 'filter_ajax_term');
add_action('wp_ajax_filterterm', 'filter_ajax_term');

function filter_ajax_term(){

$category = $_POST['category'];

 $args = array(
    'post_type' => 'product', 
    'posts_per_page' => -1, 
    'orderby'   => 'NAME', 
    'order' => 'ASC'
 );

 if(isset($category)) {
    $args['tax_query'] = 
    array( 
        array( 
                'taxonomy' => $_POST['taxonomy'], //or tag or custom taxonomy
                'field' => 'id', 
                'terms' => array((int)$category) 
            ) 
    ); 

}
 
$the_query = new WP_Query( $args ); ?>

    <div class="container">

        <?php if ( $the_query->have_posts() ) : 
            while ( $the_query->have_posts() ) : $the_query->the_post(); 
            
            $category = get_the_category(); 

            the_title('<h2>', '</h2>');
    
        endwhile; endif; ?>

    </div>

<?php

die();
}
?>

0 个答案:

没有答案
相关问题