【发布时间】:2020-11-17 19:01:03
【问题描述】:
我一直在关注本指南:https://rudrastyh.com/wordpress/ajax-post-filters.html#comment-908。我有一个名为“project”的自定义帖子类型和一个名为“producten”的分类。我想要实现的是分类法下的过滤器类别被调用,用户可以使用这些分类法过滤帖子。我确实让它与下拉菜单一起工作,但我想要的是过滤器。我通过使用确实有效的复选框创建了这些,只是当我实际尝试过滤时,所有帖子都会显示,无论我选择哪个过滤器。该代码用于名为 test.php 的随机模板。
我觉得我犯了一些非常明显的错误,但我似乎无法弄清楚。
test.php中的代码:
<div class="container">
<div class="row">
<div class="col-12">
<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="filter">
<?php
if( $terms = get_terms( array( 'taxonomy' => 'producten' ) ) ) :
echo '<div class="project-filters button-group-pills text-center" data-toggle="buttons">';
foreach( $terms as $term ) :
echo '<label class="btn btn-transparent" for="product_' . $term->term_id . '"><input type="checkbox" id="product_' . $term->term_id . '" name="product_' . $term->term_id . '" />' . $term->name . '</label>';
endforeach;
echo '</div>';
endif;
?>
<button>Pas filters toe</button>
<input type="hidden" name="action" value="myfilter">
</form>
<div id="response"></div>
</div>
</div>
functions.php中的代码:
add_action('wp_ajax_myfilter', 'misha_filter_function');
add_action('wp_ajax_nopriv_myfilter', 'misha_filter_function');
function misha_filter_function(){
$args = array(
'post_type' => 'project',
'orderby' => 'date', // we will sort posts by date
'order' => $_POST['date'], // ASC or DESC
'posts_per_page' => '-1'
);
if( $terms = get_terms( array( 'taxonomy' => 'producten' ) ) ) :
$all_terms = array();
foreach( $terms as $term ) {
if( isset( $_GET['product_' . $term->term_id ] ) && $_GET['product_' . $term->term_id] == 'on' )
$all_terms[] = $term->slug;
}
if( count( $all_terms ) > 0 ) {
$args['tax_query'] = array(
array(
'taxonomy' => 'producten',
'field' => 'slug',
'terms'=> $all_terms
)
);
}
endif;
$query = new WP_Query( $args );
if( $query->have_posts() ) :
echo '<div class="row projecten-wrapper">';
while( $query->have_posts() ): $query->the_post();
echo '<div class="col-12 col-md-6 col-lg-4 project">';
echo '<div class="project-wrapper">
<a href="' . get_the_permalink() . '">
<div class="project-header">
<div class="project-bottom">
<div class="project-text">';
echo '<div class="project-title"><span>';
echo the_title();
echo '</span>
</div>
<div class="project-subtitle"><p>';
echo the_excerpt();
echo '</p>
</div>
</div>
<div class="project-arrow">
<div class="svg-wrapper">
<svg xmlns="http://www.w3.org/2000/svg" width="15.528" height="27.359" viewBox="0 0 15.528 27.359">
<g id="Group_5" data-name="Group 5" transform="translate(2568.865 -660.337) rotate(90)">
<g id="Group_2" data-name="Group 2" transform="translate(660.337 2553.337)">
<rect id="Rectangle_11" data-name="Rectangle 11" width="19.346" height="2.614" rx="1.307" transform="translate(0 13.679) rotate(-45)" fill="#fff"/>
<rect id="Rectangle_12" data-name="Rectangle 12" width="19.346" height="2.614" rx="1.307" transform="translate(25.51 15.528) rotate(-135)" fill="#fff"/>
</g>
</g>
</svg>
</div>
</div>
</div>
<div class="image-wrapper">';
if( has_post_thumbnail() ):
echo get_the_post_thumbnail();
endif;
echo '<div class="layer gradient-1">
</div>
<div class="layer">
</div>
</div>
</div>
</a>
</div>
</div>';
endwhile;
echo '</div>';
wp_reset_postdata();
else :
echo 'No posts found';
endif;
die();
}
还有jQuery函数:
jQuery(function($){
$('#filter').submit(function(){
var filter = $('#filter');
$.ajax({
url:filter.attr('action'),
data:filter.serialize(), // form data
type:filter.attr('method'), // POST
beforeSend:function(xhr){
filter.find('button').text('Processing...'); // changing the button label
},
success:function(data){
filter.find('button').text('Apply filter'); // changing the button label back
$('#response').html(data); // insert data
}
});
return false;
});
});
【问题讨论】:
-
您可以编辑以显示您更改了哪个 $_GET -> $_POST,可能在此处
'order' => $_POST['date'],// 已从 $_GET 更改为 $_POST,以便将来清楚。欢迎来到 SO。 -
你应该添加你自己的答案然后接受它(是的,它不违反规则,总是发生:))而不是编辑你的问题。
标签: php html jquery wordpress forms