J'ai un type de publication WordPress appelé Annuaire des employés qui répertorie les employés de 3 catégories différentes dans 3 carrousels bxslider - chaque poste dans un li
. J'ai un seul filtre de recherche live jQuery qui recherche toutes les 3 catégories. J'ai aussi une requête qui compte combien de messages de ce type et de cette catégorie il y a et j'ai besoin du nombre de post pour mettre à jour quand l'utilisateur tape dans la barre de recherche.jQuery live search filter - Afficher le message 'Nothing Found' et mettre à jour le compte WordPress
Je dois également afficher un message indiquant «Aucun employé trouvé» lorsque aucun résultat n'est renvoyé.
Mon JS dans un document prêt dans mon footer.php:
// live search
$('.live-search-list li').each(function(){
$(this).attr('data-search-term', $(this).text().toLowerCase());
});
$('.live-search-box').on('keyup', function(){
var searchTerm = $(this).val().toLowerCase();
$('.live-search-list li').each(function(){
if ($(this).filter('[data-search-term *= ' + searchTerm + ']').length > 0 || searchTerm.length < 1) {
$(this).show();
} else {
$(this).hide();
}
});
});
Ma boucle de WordPress (il y a 3 tous les mêmes, sauf la catégorie):
<div class="title-count">
<h4>New Flyer</h4>
<span>
<!-- Count number of posts in type and category -->
\t <?php $args1 = array(
\t 'cat' => 2,
\t 'post_type' => 'employee-directory',
\t);
\t $the_query = new WP_Query($args1);
\t echo $the_query->found_posts; ?> People
</span>
</div>
<!-- Loop through New Flyer Category -->
<ul class="carousel">
<?php
$query1 = new WP_Query(array(
\t 'post_type' => 'employee-directory',
\t 'posts_per_page' => -1,
\t 'cat' => 2,
\t 'orderby' => 'title',
\t 'order' => 'ASC'
)
);
while ($query1->have_posts()) : $query1->the_post(); ?>
<li class="nf">
<a href="#" data-featherlight="<?php the_permalink(); ?>">
<div class="content-box">
<div class="content-image">
<?php if (has_post_thumbnail()) {
\t \t \t \t the_post_thumbnail('staff', array('class' => 'img-fluid'));
\t \t \t \t } else { ?>
<img src="<?php bloginfo('template_url'); ?>/img/placeholder_profile_photo.png" alt="<?php the_title(); ?>" />
<?php } ?>
</div>
<div class="content-info">
<h5>
<?php the_title(); ?>
</h5>
<p>
<?php the_field('position'); ?>
</p>
</div>
</div>
</a>
</li>
<?php endwhile; wp_reset_postdata(); ?>
</ul>
Je sais que je pourrais combiner mon tw o requêtes dans un, mais à cause du carrousel, j'ai besoin de la boucle pour commencer à l'intérieur du ul
et le nombre de postes et le nom de la catégorie pour être en dehors de cette boucle, si cela est logique.
Here is a link to that page on the dev site I'm working on.
Je sais que je pouvais le faire avec un certain JS si les déclarations, mais je ne suis pas tout à fait sûr de savoir comment mettre en oeuvre. Fondamentalement, j'ai besoin de WP Query et de mon JS pour travailler ensemble pour compter les messages, mais je ne sais pas par où commencer. Toute aide est grandement appréciée!