[英]Filter posts by categories in Wordpress with ajax
所以这可能是重复的,但我找不到相同的问题。 我有一个很大的麻烦,可能有很小的原因。 我想使用 ajax 按类别过滤我的自定义帖子类型帖子。
它的作用是,当我想按创建并分配给帖子的类别进行过滤时,我有一个没有帖子的空白响应。 javascript 控制台没有问题,所以我认为蛞蝓/类别的名称存在问题。
你能不能帮忙看看这个“冷头”。
我的自定义帖子类型和自定义分类已注册:
add_action( 'init', 'blog_register' );
function blog_register() {
$labels = array(
'name' => _x('Blog', 'post type general name'),
'singular_name' => _x('Blog', 'post type singular name'),
'add_new' => _x('Add New', 'work item'),
'add_new_item' => __('Add New Blog Item'),
'edit_item' => __('Edit Blog Item'),
'new_item' => __('New Blog Item'),
'view_item' => __('View Blog Item'),
'search_items' => __('Search Blog'),
'not_found' => __('Nothing found'),
'not_found_in_trash' => __('Nothing found in Trash'),
'parent_item_colon' => '',
'taxonomies' => array ('categories')
);
$args = array(
'labels' => $labels,
'public' => true,
'publicly_queryable' => true,
'show_ui' => true,
'query_var' => true,
'rewrite' => array( 'slug' => 'blog', 'with_front'=> false ),
'capability_type' => 'post',
'hierarchical' => true,
'has_archive' => true,
'menu_position' => null,
'supports' => array('title','editor','thumbnail')
);
register_post_type( 'blog' , $args );
register_taxonomy( 'categories', array('blog'), array(
'hierarchical' => true,
'label' => 'Categories',
'singular_label' => 'Category',
'rewrite' => array( 'slug' => 'categories', 'with_front'=> false )
)
);
register_taxonomy_for_object_type( 'categories', 'blog' ); // Better be safe than sorry
}
function filter_posts() {
$catSlug = $_POST['categories'];
$ajaxposts = new WP_Query([
'post_type' => 'blog',
'posts_per_page' => -1,
'category_name' => $catSlug,
'orderby'=> 'post_date',
'order' => 'desc',
]);
$response = '';
if($catSlug == '') {
$response .= get_template_part('template_parts/blog-item');
} else {
if($ajaxposts->have_posts()) {
while($ajaxposts->have_posts()) : $ajaxposts->the_post();
$response .= get_template_part('template_parts/blog-item');
endwhile;
} else {
echo " ";
}
}
echo $response;
exit;
}
add_action('wp_ajax_filter_posts', 'filter_posts');
add_action('wp_ajax_nopriv_filter_posts', 'filter_posts');
在这里我有我的 js 代码:
jQuery(function($){
$('.cat-item').on('click', function() {
$('.cat-item').removeClass('active');
$(this).addClass('active');
$.ajax({
type: 'POST',
url: '/wp-admin/admin-ajax.php',
dataType: 'html',
data: {
action: 'filter_posts',
category: $(this).data('slug'),
},
success: function(res) {
$('.blog-listing .row').html(res);
}
})
});
});
我如何显示我的内容:
<div class="blog-listing">
<div class='row'>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<?php get_template_part('template-parts/blog-item'); ?>
<?php endwhile; endif; ?>
</div>
</div>
您的代码中几乎没有逻辑错误和错误的实现。
category_name
,您必须使用tax_query
$_POST['categories']
进行处理之前,您需要进行适当的验证并清理输入if ( $catSlug == '' )
没有意义,需要以一种好的方式重写。建议:请在您的 function 和动作名称上添加前缀,这样它们就可以是唯一的,并且不会与任何其他内容冲突。 Prefix 还会提醒你添加了这个自定义的东西,它不是来自主题或任何其他插件,它是你的代码。
现在让我们修复您的代码:
function filter_posts() {
// Validate with isset and not empty then sanitize with sanitize_text_text also use wp_unslash.
$cat_slug = isset( $_POST['categories'] ) && ! empty( $_POST['categories'] ) ? sanitize_text_field( wp_unslash( $_POST['categories'] ) ) : '';
// Define query args in a variable, it will help us to add tax query conditionally.
$query_args = array(
'post_type' => 'blog',
'posts_per_page' => -1,
'orderby' => 'date',
'order' => 'DESC',
'tax_query' => array( 'AND' ),
);
// if category slug is not empty then add a tax query args in query.
if ( ! empty( $cat_slug ) ) {
$query_args['tax_query'] = array(
'taxonomy' => 'categories',
'field' => 'slug',
'operator' => '=',
'terms' => $cat_slug,
);
}
// Run the query.
$ajaxposts = new WP_Query( $query_args );
// We will use ob functions to collect the buffered output.
ob_start();
// check if has posts.
if ( $ajaxposts->have_posts() ) {
// Loop through the posts.
while ( $ajaxposts->have_posts() ) :
$ajaxposts->the_post();
// Get content.
get_template_part( 'template_parts/blog-item' );
endwhile;
}
wp_reset_postdata();
$response = ob_get_clean();
echo $response;
exit;
}
add_action( 'wp_ajax_filter_posts', 'filter_posts' );
add_action( 'wp_ajax_nopriv_filter_posts', 'filter_posts' );
注意:当类别为空时,我们将获取所有没有类别的帖子。
如果您在使用代码后发现任何语法或严重错误,我还没有测试过代码,如果我可以解决我的答案并可以解决问题,请告诉我
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.