I have been following this and it works almost perfectly but it is not only finding the title posts with the same words as per what we write in the input field but it finding ALL posts regardless.
HTML
<input name="usp-title" id="usp-title" type="text" value="" data-required="true" required="required" maxlength="99" placeholder="Type here..." class="usp-input usp-input-title form-control">
AJAX
add_action( 'wp_footer', 'ajax_fetch' );
function ajax_fetch() {
?>
<script type="text/javascript">
function fetch(){
console.log(jQuery('#usp-title').val());
jQuery.ajax({
url: '<?php echo admin_url('admin-ajax.php'); ?>',
type: 'post',
data: { action: 'data_fetch', exactwords: jQuery('#usp-title').val() },
success: function(data) {
var text1;
var text1B;
var text2;
var text2B;
jQuery("#datafetch").html(data).promise().done(function(){
text1 = jQuery("#datafetch").find("h2").find("a").html();
text1B = text1.toLowerCase();
text2 = jQuery('#usp-title').val();
text2B = text2.toLowerCase();
console.log(text1B);
console.log(text2B);
if (text1B != text2B) {
jQuery("#componi").removeAttr("disabled", "disabled").show();
jQuery("#fatto").hide();
//jQuery('#datafetch').empty();
} else if (text1B == text2B) {
jQuery("#componi").attr("disabled", "disabled").hide();
}
});
}
});
}
</script>
PHP
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['usp-title'] ), 'post_type' => 'post' ) );
if( $the_query->have_posts() ) : ?>
<div class="jumbotron">
<h4>Abbiamo trovato già delle lezioni con lo stesso titolo,<br>usa una di questa o scrivi un titolo diverso.</h4>
</div>
<ul class="list-unstyled margin-top-80">
<?php while( $the_query->have_posts() ): $the_query->the_post(); ?>
<li>
<?php $time = usp_get_meta(false, 'usp-custom-10'); ?>
<?php $space = usp_get_meta(false, 'usp-custom-3'); ?>
<?php $spaceB = usp_get_meta(false, 'usp-custom-7'); ?>
<h2><a target="_blank" href="<?php echo esc_url( post_permalink() ); ?>"><?php the_title();?></a></h2>
<p><strong>Spazio:</strong> <?php echo $space;?> <?php echo $spaceB; ?></p>
<p><strong>Tempo:</strong> <?php echo $time; ?></p>
<?php the_excerpt(); ?>
</li>
<?php endwhile;
wp_reset_postdata(); ?>
</ul>
<?php endif;
die();
}
How can I limit the results to only the one with the same title as per the text in the input field?
I have been following this and it works almost perfectly but it is not only finding the title posts with the same words as per what we write in the input field but it finding ALL posts regardless.
HTML
<input name="usp-title" id="usp-title" type="text" value="" data-required="true" required="required" maxlength="99" placeholder="Type here..." class="usp-input usp-input-title form-control">
AJAX
add_action( 'wp_footer', 'ajax_fetch' );
function ajax_fetch() {
?>
<script type="text/javascript">
function fetch(){
console.log(jQuery('#usp-title').val());
jQuery.ajax({
url: '<?php echo admin_url('admin-ajax.php'); ?>',
type: 'post',
data: { action: 'data_fetch', exactwords: jQuery('#usp-title').val() },
success: function(data) {
var text1;
var text1B;
var text2;
var text2B;
jQuery("#datafetch").html(data).promise().done(function(){
text1 = jQuery("#datafetch").find("h2").find("a").html();
text1B = text1.toLowerCase();
text2 = jQuery('#usp-title').val();
text2B = text2.toLowerCase();
console.log(text1B);
console.log(text2B);
if (text1B != text2B) {
jQuery("#componi").removeAttr("disabled", "disabled").show();
jQuery("#fatto").hide();
//jQuery('#datafetch').empty();
} else if (text1B == text2B) {
jQuery("#componi").attr("disabled", "disabled").hide();
}
});
}
});
}
</script>
PHP
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['usp-title'] ), 'post_type' => 'post' ) );
if( $the_query->have_posts() ) : ?>
<div class="jumbotron">
<h4>Abbiamo trovato già delle lezioni con lo stesso titolo,<br>usa una di questa o scrivi un titolo diverso.</h4>
</div>
<ul class="list-unstyled margin-top-80">
<?php while( $the_query->have_posts() ): $the_query->the_post(); ?>
<li>
<?php $time = usp_get_meta(false, 'usp-custom-10'); ?>
<?php $space = usp_get_meta(false, 'usp-custom-3'); ?>
<?php $spaceB = usp_get_meta(false, 'usp-custom-7'); ?>
<h2><a target="_blank" href="<?php echo esc_url( post_permalink() ); ?>"><?php the_title();?></a></h2>
<p><strong>Spazio:</strong> <?php echo $space;?> <?php echo $spaceB; ?></p>
<p><strong>Tempo:</strong> <?php echo $time; ?></p>
<?php the_excerpt(); ?>
</li>
<?php endwhile;
wp_reset_postdata(); ?>
</ul>
<?php endif;
die();
}
How can I limit the results to only the one with the same title as per the text in the input field?
This is more of an hack but i couldn't find any other way around, tried exact= "true" and sentence="true" as parameters in the query but still, i had all results not only the exact matching one. Therefore since I was having the results as a list, i am doing a check in the DOM and removing anything which doesn't exactly match the .val()
function searchAjax(){
jQuery.ajax({
url: '<?php echo admin_url('admin-ajax.php'); ?>',
type: 'post',
data: { action: 'data_fetch', exactwords: jQuery('#usp-title').val() },
success: function(data) {
var text2;
var text2B;
text2 = jQuery('#usp-title').val();
text2B = text2.toLowerCase();
jQuery("#datafetch").html(data).promise().done(function(){
jQuery("#datafetch ul li h2 a").each(function() {
var $this = jQuery(this);
if ($this.text().toLowerCase() !== text2B) {
$this.parent().parent().remove();
jQuery(".jumbotron").remove();
jQuery("#componi").removeAttr("disabled", "disabled").show();
} else if ($this.text().toLowerCase() == text2B) {
jQuery("#componi").attr("disabled", "disabled").hide();
}
});
});
}
});
}