使用 ajax 或 jquery 实时搜索 wordpress 自定义 post_type 标题列表

Question

我正在尝试添加 AJAX 实时搜索来过滤我的 wordpress 主题中的帖子标题，以对输出的帖子列表进行排序。我已经添加了当前输出的图像。请

我添加了一个用于过滤列表视图的输入字段

  <input placeholder="Search here........." type="text" />

下面是我的自定义页面类型，用于输出自定义帖子列表我的自定义帖子类型是circular

<?php /*Template Name: Circular search*/
 function TrimTitle($s) {
    $maxLength = 80;
    if (strlen($s) > $maxLength) {
        echo substr($s, 0, $maxLength - 5) . ' ...';
    } else {
        echo $s;
    }
}
?>

<?php get_header(); ?>
<input placeholder="Search here........." type="text" />
<?php 
$paged = (get_query_var('paged')) ? get_query_var('paged') : 1;

$circular_query= new WP_Query(array(
    'post_type'=>'circular',
    'posts_per_page' => 7,
    'order' => 'DESC',
    'paged' => $paged,
));

if($circular_query->have_posts()) :
    while($circular_query->have_posts())  : $circular_query->the_post();
     $file = get_post_meta(get_the_ID(), 'circular_attachment', true); 
     //get the url
     $url = $file['url'];
    ?>
    <ul>
        <li>
            <a href="<?php the_permalink() ?>" title="Link to <?php the_title_attribute() ?>">
             <i class="fa fa-file-pdf-o circular-list-icon" aria-hidden="true"></i>  <?php the_time( 'd-m-Y' ) ?>  <?php TrimTitle(get_the_title()); ?> 
            </a>
            <a class="download-btn read-more btn btn-primary" href="<?php echo $file['url']; ?>"> Download</a>
        </li>
        <hr class="sep-circular"/>
    </ul>           
    <?php endwhile;
    $total_pages = $circular_query->max_num_pages;
    if ($total_pages > 1){
        $current_page = max(1, get_query_var('paged'));
        echo paginate_links(array(
            'base' => get_pagenum_link(1) . '%_%',
            'format' => '/page/%#%',
            'current' => $current_page,
            'total' => $total_pages,
            'prev_text'    => __('« prev'),
            'next_text'    => __('next »'),
        ));
    }
    ?>    
<?php else :?>
<h3><?php _e('No Circular found', ''); ?></h3>
<?php endif; ?>
<?php wp_reset_postdata();?>
<div class="sep-circular clearfix"></div>
<?php get_footer(); ?>

Answer 1

在您的查询中，您没有告诉 WordPress 要按哪个字段排序。试试这个：

$circular_query= new WP_Query(array(
    'post_type'=>'circular',
    'posts_per_page' => 7,
    'order' => 'ASC',
    'orderby' => 'post_title',
    'paged' => $paged,
));

另外，我将结果顺序设置为 ASC 而不是 DESC，因为我认为您希望帖子按 ASC 顺序排列，不是吗？