Created
February 4, 2018 21:31
-
-
Save alexmustin/c22b698689ce6caf9a562c3b405e2732 to your computer and use it in GitHub Desktop.
WordPress AJAX Live Search of Post Title
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!-- // The HTML (could be part of page content) // --> | |
<input type="text" name="keyword" id="keyword" onkeyup="fetch()"></input> | |
<div id="datafetch">Search results will appear here</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?php | |
// add the ajax fetch js | |
add_action( 'wp_footer', 'ajax_fetch' ); | |
function ajax_fetch() { | |
?> | |
<script type="text/javascript"> | |
function fetch(){ | |
jQuery.ajax({ | |
url: '<?php echo admin_url('admin-ajax.php'); ?>', | |
type: 'post', | |
data: { action: 'data_fetch', keyword: jQuery('#keyword').val() }, | |
success: function(data) { | |
jQuery('#datafetch').html( data ); | |
} | |
}); | |
} | |
</script> | |
<?php | |
} | |
// the ajax function | |
add_action('wp_ajax_data_fetch' , 'data_fetch'); | |
add_action('wp_ajax_nopriv_data_fetch','data_fetch'); | |
function data_fetch(){ | |
$the_query = new WP_Query( | |
array( | |
'posts_per_page' => -1, | |
's' => esc_attr( $_POST['keyword'] ), | |
'post_type' => 'post' | |
) | |
); | |
if( $the_query->have_posts() ) : | |
while( $the_query->have_posts() ): $the_query->the_post(); ?> | |
<h2><a href="<?php echo esc_url( post_permalink() ); ?>"><?php the_title();?></a></h2> | |
<?php endwhile; | |
wp_reset_postdata(); | |
endif; | |
die(); | |
} |
omment and
@KixKira It's because in that line, you're mixing php and html. Either change it to this:
if(stripos("/{$search}/", $a) !== false) { ?>
<li><a href="<?php echo esc_url( post_permalink() ); ?>"><?php the_title();?></a></li>
<?php }
or this:
if(stripos("/{$search}/", $a) !== false) {
echo '<li><a href="'.esc_url( post_permalink() ).'">'.the_title().'</a></li>';
}
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
hi @KixKira
first please edit your comment and put your code in 'code-block'. and let me know what error u got.
because I really can't understand what your problem is.
but, what's ur custom post-type name? because I saw 'glossary' which is my custom post-type name.