ajax - 如何使用自定义帖子类型和分类过滤器设置 Ajax 分页？
问题描述
首先，我创建了自定义帖子类型“产品”，并且创建了一些分类法，例如：“类型”、“完成”和“大小”。但是我在分页不起作用时遇到了“ajax 响应”问题。分页不适用于 ajax 响应。有人知道如何处理 ajax 结果的分页吗？
所以，这是我的代码：
//1. Html Code
<form action="" method="POST" id="filter">
<div class="zindex-filter">
<div class="filter-by-type">
<div class="sidebar-title">
<h5>Filter by type</h5>
</div>
<div class="filter-content">
<ul>
<?php
$tt=0;
if( $terms = get_terms( array(
'taxonomy' => 'type', // to make it simple I use default categories
'orderby' => 'name'
) ) ) :
foreach ( $terms as $term ) : $tt++;
//echo '<option value="' . $term->term_id . '">' . $term->name . '</option>';
?>
<li>
<input class="form-check-input" type="checkbox" name="typecat" id="typecat<?php echo $tt; ?>" value="<?php echo $term->term_id; ?>" onclick="handleClick();" >
<label for="typecat<?php echo $tt; ?>"><?php echo $term->name; ?></label>
</li>
<?php
endforeach;
endif;
?>
</ul>
</div>
</div>
<div class="filter-by-finish">
<div class="sidebar-title">
<h5>Filter by finish</h5>
</div>
<div class="filter-content">
<ul>
<?php
$ff=0;
if( $terms = get_terms( array(
'taxonomy' => 'finish', // to make it simple I use default categories
'orderby' => 'name'
) ) ) :
foreach ( $terms as $term ) : $ff++;
//echo '<option value="' . $term->term_id . '">' . $term->name . '</option>';
?>
<li>
<input class="form-check-input" type="checkbox" name="finishcat" id="finishcat<?php echo $ff; ?>" value="<?php echo $term->term_id; ?>" onclick="handleClick();">
<label for="finishcat<?php echo $ff; ?>"><?php echo $term->name; ?></label>
</li>
<?php
endforeach;
endif;
?>
</ul>
</div>
</div>
<div class="filter-by-size">
<div class="sidebar-title">
<h5>Filter by size</h5>
</div>
<div class="filter-content">
<ul>
<?php
$ss=0;
if( $terms = get_terms( array(
'taxonomy' => 'size', // to make it simple I use default categories
'orderby' => 'name'
) ) ) :
foreach ( $terms as $term ) : $ss++;
//echo '<option value="' . $term->term_id . '">' . $term->name . '</option>';
?>
<li>
<input class="form-check-input" type="checkbox" name="sizecat" id="sizecat<?php echo $ss; ?>" value="<?php echo $term->term_id; ?>" onclick="handleClick();" >
<label for="sizecat<?php echo $ss; ?>"><?php echo $term->name; ?></label>
</li>
<?php
endforeach;
endif;
?>
</ul>
</div>
</div>
</div>
</form>
// 1. End Html Code
// 2.PHP Code
<?php
$paged = get_query_var('paged') ? get_query_var('paged') : 1;
$the_query = new WP_Query(array(
'post_type' => 'product',
'post_status' =>'publish',
'posts_per_page' => 6,
'paged' => $paged,
'no_found_rows' => true,
'orderby' => 'menu_order',
'order' => 'DESC'
));
//echo '<pre>'; print_r($the_query);
if ( $the_query->have_posts() ) {
?>
<div class="products-zindex">
<div class="row productlist">
<?php while ( $the_query->have_posts() ) {
$the_query->the_post();
$pid = $the_query->post->ID;
$product_name = $the_query->post->post_title;
//$product_slug = $the_query->post->post_name;
$featured_img_url = get_the_post_thumbnail_url($pid, 'full');
$procatArr = wp_get_post_terms( $pid, 'finish' );
//print_r($procatArr);
?>
<div class="col-sm-3 col-md-6 col-lg-4 col-xl-2 scrollload">
<div class="zindex-product-detail">
<a href="<?php echo get_permalink(); ?>">
<div class="product-img">
<img src="<?php echo $featured_img_url; ?>" alt="<?php echo $product_name; ?>" class="img-fluid">
</div>
<div class="product-data">
<h5><?php echo $product_name; ?></h5>
<h6>
<?php
$comma_string = array();
foreach( $procatArr as $catval ) {
$comma_string[] = $catval->name;
}
echo $productname = implode(", ", $comma_string);
?>
</h6>
</div>
</a>
</div>
</div>
<?php }
echo "<nav class=\"sw-pagination\">";
$big = 999999999; // need an unlikely integer
echo paginate_links( array(
'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
'format' => '?paged=%#%',
'current' => max( 1, get_query_var('paged') ),
'total' => $the_query->max_num_pages
) );
echo "</nav>";
wp_reset_query();
?>
</div>
</div>
<?php } else { ?>
<h2>No Product Found.</h2>
<?php } ?>
//2. End PHP Code
// 3. Javascript Code
<script>
function handleClick(){ //alert('kghkghk');
var arr = [];
var farr = [];
var sarr = [];
jQuery.each(jQuery("input[name='typecat']:checked"), function(){
arr.push(jQuery(this).val());
});
var typearr = arr.join(", ");
jQuery.each(jQuery("input[name='finishcat']:checked"), function(){
farr.push(jQuery(this).val());
});
var finisharr = farr.join(", ");
jQuery.each(jQuery("input[name='sizecat']:checked"), function(){
sarr.push(jQuery(this).val());
});
var sizearr = sarr.join(", ");
dealers_ajax_call(typearr, finisharr, sizearr);
}
function dealers_ajax_call(typearr = "", finisharr = "", sizearr = "")
{
//alert(typearr);
//alert(finisharr);
//alert(sizearr);
jQuery("#ajaxloaderdiv").show();
jQuery.ajax({
type : "post",
url: "<?php echo admin_url( 'admin-ajax.php' ); ?>",
data:
{
typearr : typearr,
finisharr : finisharr,
sizearr : sizearr,
post_type : "product" ,
type : "type",
finish : "finish",
size : "size",
action : 'request_by_filter'
},
success: function(data) {
//alert(data);
jQuery('#response').html(data);
//jQuery("#hidepagination").hide();
//jQuery(".yith-infs-loader").hide();
setTimeout(function(){ jQuery("#ajaxloaderdiv").hide(); }, 2000);
}
});
}
</script>
//3.End Javascript Code
// 4. Function.php code
<?php
// ajax code for request test ride details
add_action( 'wp_ajax_nopriv_request_by_filter', 'request_by_filter' );
add_action( 'wp_ajax_request_by_filter', 'request_by_filter' );
function request_by_filter()
{
$typecatArr = $_POST['typearr'];
//print_r($typecatArr);
$type_arr = explode (",", $typecatArr);
$finishcatArr = $_POST['finisharr'];
//print_r($finishcatArr);
$finish_arr = explode (",", $finishcatArr);
$sizecatArr = $_POST['sizearr'];
//print_r($sizecatArr);
$size_arr = explode (",", $sizecatArr);
$post_type = $_POST['post_type'];
$type = $_POST['type'];
$finish = $_POST['finish'];
$size = $_POST['size'];
$paged = get_query_var('paged') ? get_query_var('paged') : 1;
$args = array(
'post_type' => $post_type,
'posts_per_page'=>6,
'paged' => $paged,
'post_status' =>'publish',
'orderby' => 'menu_order',
'order' => 'DESC'
);
if($type_arr || $finish_arr || $size_arr)
{
$tax_query['tax_query'] = array( 'relation'=>'AND' );
}
$args = array_merge_recursive( $args, $tax_query);
if(!empty($typecatArr))
{
$tax_query['tax_query'] = array(
array(
'taxonomy' => $type,
'field' => 'term_id',
'terms' => $type_arr,
)
);
$args = array_merge_recursive( $args, $tax_query);
// print_r($args);
}
if(!empty($finishcatArr))
{
$tax_query['tax_query'] = array(
array(
'taxonomy' => $finish,
'field' => 'term_id',
'terms' => $finish_arr,
)
);
$args = array_merge_recursive( $args, $tax_query);
// print_r($args);
}
if(!empty($sizecatArr))
{
$tax_query['tax_query'] = array(
array(
'taxonomy' => $size,
'field' => 'term_id',
'terms' => $size_arr,
)
);
$args = array_merge_recursive( $args, $tax_query);
}
// echo '<pre>'; print_r($args); echo '</pre>';
$query = new WP_Query($args);
if ( $query->have_posts() ) {
?>
<div class="ajaxloader col-lg-10 col-md-9" id="ajaxloaderdiv" style="display:none;">
<img class="loading-image" src="<?php echo get_stylesheet_directory_uri(); ?>/framework/loader.gif" />
</div>
<div class="products-zindex">
<div class="row">
<?php
while ( $query->have_posts() ) {
$query->the_post();
$featured_img_url = get_the_post_thumbnail_url(get_the_ID(),'full');
$procatArr = wp_get_post_terms( get_the_ID(), $finish );
?>
<div class="col-sm-3 col-md-6 col-lg-4 col-xl-2 scrollload">
<div class="zindex-product-detail">
<a href="<?php echo get_permalink(); ?>">
<div class="product-img">
<img src="<?php echo $featured_img_url; ?>" alt="<?php the_title(); ?>" class="img-fluid">
</div>
<div class="product-data">
<h5><?php the_title(); ?></h5>
<h6>
<?php
$comma_string = array();
foreach( $procatArr as $catval ) {
$comma_string[] = $catval->name;
}
echo $productname = implode(", ", $comma_string);
?>
</h6>
</div>
</a>
</div>
</div>
<?php }
echo "<nav class=\"sw-pagination\">";
$big = 999999999; // need an unlikely integer
echo paginate_links( array(
'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
'format' => '?paged=%#%',
'current' => max( 1, get_query_var('paged') ),
'total' => $the_query->max_num_pages
) );
echo "</nav>";
wp_reset_query();
?>
</div>
</div>
<?php } else { ?>
<h2>No Product Found.</h2>
<?php
}
wp_die();
//exit;
}
?>
// 4 .Endfunction.php code
寻找这方面的代码和建议。
谢谢
解决方案
推荐阅读
- python - 从 json 文件中提取时出现 Python 和 JSON 错误
- sql - 在 Excel 密码保护的工作表上运行 SQL。连接问题
- reinforcement-learning - Ray RLllib：供外部使用的出口政策
- r - ggplot中传说中的希腊字母
- wordpress - 如何让一个静态 HTML 文件正常访问，不让 WordPress 运行？
- c++ - 使用 boost asio 时出现“解决：找不到主机（权威）”异常
- scala - Spark：无法将此数组转换为不安全的格式，因为它太大了
- python - 通过 python 将视频上传到 youtube
- java - Libgdx 在 Fedora 31 上不起作用 - 无法初始化类 org.lwjgl.Sys
- typescript - 枚举/类型/字符串作为对象类型/接口中的键