使用AJAX表单和复选框过滤帖子

时间:2021-02-19 作者:Mathieu Préaud

我的自定义帖子类型有一个循环workshop 使用两个自定义分类进行筛选groupteacher 在同一页上Ajax过滤器工作得非常好。

过滤器的每个链接都与<input type="checkbox">, 对于这两个分类列表。当用户在过滤器中选择一个或多个术语,然后取消选择所有术语时,过滤器返回;找不到帖子“;因为未选择任何内容。

我想做的是,当用户取消选择过滤器中的所有术语时,它会显示我自定义帖子类型的所有帖子。

前端过滤器的PHP代码:

<form action="<?php echo site_url() ?>/wp-admin/admin-ajax.php" method="POST" id="filter">

  <div>
  <?php
    if( $groups = get_terms( array( \'taxonomy\' => \'group\' ) ) ) :
      echo \'<ul class="groups-list">\';
      foreach( $groups as $group ) :
         echo \'<input type="checkbox" class="" id="group_\' . $group->term_id . \'" name="group_\' . $group->term_id . \'" /><label for="group_\' . $group->term_id . \'">\' . $group->name . \'</label>\';
       endforeach;
       echo \'</ul>\';
     endif;
   ?>
   </div>

   <div>
   <?php
     if( $teachers = get_terms( array( \'taxonomy\' => \'teacher\' ) ) ) :
       echo \'<ul class="teachers-list">\';
       foreach( $teachers as $teacher ) :
         echo \'<input type="checkbox" class="" id="teacher_\' . $teacher->term_id . \'" name="teacher_\' . $teacher->term_id . \'" /><label for="teacher_\' . $teacher->term_id . \'">\' . $teacher->name . \'</label>\';
                             
        endforeach;
        echo \'</ul>\';
     endif;
   ?>
   </div>

   <input type="hidden" name="action" value="myfilter">
</form>
函数中AJAX过滤器的PHP代码。php:

function mysite_filter_function(){

//groups checkboxes
if( $groups = get_terms( array( \'taxonomy\' => \'group\' ) ) ) :
$groups_terms = array();

foreach( $groups as $group ) {
    if( isset( $_POST[\'group_\' . $group->term_id ] ) && $_POST[\'group_\' . $group->term_id] == \'on\' )
         $groups_terms[] = $group->slug;
}
endif;

//teachers checkboxes
if( $teachers = get_terms( array( \'taxonomy\' => \'teacher\' ) ) ) :
$teachers_terms = array();

foreach( $teachers as $teacher ) {
    if( isset( $_POST[\'teacher_\' . $teacher->term_id ] ) && $_POST[\'teacher_\' . $teacher->term_id] == \'on\' )
         $teachers_terms[] = $teacher->slug;
}
endif;



if (empty($groups_terms) || empty($teachers_terms) ) {
 $relation = \'OR\';
}else{
 $relation = \'AND\';
}

$args = array(
    \'orderby\' => \'date\',
    \'post_type\' => \'workshop\',
    \'posts_per_page\' => -1,
    \'tax_query\' => array(
        \'relation\' => $relation,
        array(
            \'taxonomy\' => \'group\',
            \'field\' => \'slug\',
            \'terms\' => $groups_terms
        ),
        array(
            \'taxonomy\' => \'teacher\',
            \'field\' => \'slug\',
            \'terms\' => $teachers_terms
        )
    )
);

$query = new WP_Query( $args );

if( $query->have_posts() ) :
    while( $query->have_posts() ): $query->the_post();
        echo \'<h2>\' . $query->post->post_title . \'</h2>\';

    endwhile;
    wp_reset_postdata();
else :
    echo \'No posts found\';
endif;

die();
}
add_action(\'wp_ajax_myfilter\', \'mysite_filter_function\');
add_action(\'wp_ajax_nopriv_myfilter\', \'mysite_filter_function\');
JS代码:

$(\'#filter\').change(function(){
    var filter = $(\'#filter\');
    $.ajax({
        url:filter.attr(\'action\'),
        data:filter.serialize(),
        type:filter.attr(\'method\'),
        beforeSend:function(xhr){
            //filter.find(\'button\').text(\'Processing...\');
        },
        success:function(data){
            //filter.find(\'button\').text(\'Filter\');
            $(\'.loop-archive-workshop\').html(data);
        }
    });
    return false;
});
谢谢!

1 个回复
最合适的回答,由SO网友:Sally CJ 整理而成

我想做的是,当用户取消选择过滤器中的所有术语时,它会显示我自定义帖子类型的所有帖子。

在这种情况下,请选择税务查询:

// In mysite_filter_function(), define $args like so:

$tax_query = array( \'relation\' => \'AND\' );

if ( ! empty( $groups_terms ) ) {
    $tax_query[] = array(
        \'taxonomy\' => \'group\',
        \'field\'    => \'slug\',
        \'terms\'    => $groups_terms,
    );
}

if ( ! empty( $teachers_terms ) ) {
    $tax_query[] = array(
        \'taxonomy\' => \'teacher\',
        \'field\'    => \'slug\',
        \'terms\'    => $teachers_terms,
    );
}

$args = array(
    \'orderby\'        => \'date\',
    \'post_type\'      => \'workshop\',
    \'posts_per_page\' => -1,
    \'tax_query\'      => $tax_query,
);