I’ve a CPT arrange with some customized taxonomy and I’ve created some customized looking performance that works nice with it, ( a consumer can search by key phrase, trade, specialty, location, or all 4 or any mixture of the 4 ), what I am attempting to do now could be implement infinite scrolling after a search that features the parameters entered by the consumer.
I’ve bought all the things working so far as the AJAX name and creating a question to incorporate the parameters. My downside is that the AJAX name is returning duplicate outcomes which have already been displayed from the unique search and I’m struggling to discover a approach to filter out the unique outcomes from the AJAX calls.
Right here is my pre_get_posts customized search perform that generates the intial outcomes
/*=================================================
SEARCH QUERY
=================================================== */
perform custom_search( $question ) {
if ( is_post_type_archive( 'consultants' ) && $query->is_main_query() && !is_admin() ) {
$key phrase = get_query_var( 'key phrase', FALSE );
$industry_select = strtolower(str_replace(' ', '-', get_query_var( 'industry_select', FALSE ) ));
$speciality_select = strtolower(str_replace(' ', '-', get_query_var( 'speciality', FALSE ) ));
$location_select = strtolower(str_replace(' ', '-', get_query_var( 'location_select', FALSE ) ));
// create checklist of phrases much like what the consumer typed in
// use array push so as to add the precise time period searched to the broad match phrases, in any other case name__like won't match if the question is precise
$broad_match_ind = get_terms( array(
'taxonomy' => 'experts_industries',
'fields' => 'slugs',
'name__like' => $industry_select,
'hide_empty' => false
) );
array_push($broad_match_ind, $industry_select);
$broad_match_spec = get_terms( array(
'taxonomy' => 'experts_specialities',
'fields' => 'slugs',
'name__like' => $speciality_select,
'hide_empty' => false
) );
array_push($broad_match_spec, $speciality_select);
$broad_match_loc = get_terms( array(
'taxonomy' => 'experts_locations',
'fields' => 'slugs',
'name__like' => $location_select,
'hide_empty' => false
) );
array_push($broad_match_loc, $location_select);
// Key phrases question
$key phrase ? $key phrase : $key phrase = null;
$query->set('s', $key phrase);
// Construct taxonomy array based mostly on what's been crammed out
$tax_query_array = array('relation' => 'AND');
$location_select ? array_push($tax_query_array, array('taxonomy' => 'experts_locations', 'area' => 'slug', 'phrases' => $broad_match_loc) ) : null ;
$speciality_select ? array_push($tax_query_array, array('taxonomy' => 'experts_specialities', 'area' => 'slug', 'phrases' => $broad_match_spec) ) : null ;
$industry_select ? array_push($tax_query_array, array('taxonomy' => 'experts_industries', 'area' => 'slug', 'phrases' => $broad_match_ind) ) : null ;
$query->set( 'tax_query', $tax_query_array);
}
}
add_action( 'pre_get_posts', 'custom_search' );
Right here is an instance of the ajax perform that masses extra posts when my ajax name is triggered on the entrance finish
if ( $key phrase && $spec && $ind && $loc ) {
error_log('key phrase + spec + ind + loc params');
$ajaxposts = new WP_Query([
'post_type' => 'experts',
'posts_per_page' => 4,
'orderby' => 'rand',
'paged' => $_POST['paged'],
's' => $_POST['keyword'],
'tax_query' => array(
array(
'taxonomy' => 'experts_specialities',
'area' => 'slug',
'phrases' => $spec
),
array(
'taxonomy' => 'experts_industries',
'area' => 'slug',
'phrases' => $ind
),
array(
'taxonomy' => 'experts_locations',
'area' => 'slug',
'phrases' => $loc
)
)
]);
}
Lastly right here is the JS making the ajax name/dealing with the response
const archiveLoadMore = perform() {
let key = $('#key phrase').val();
let spec = $('#speciality').val();
let ind = $('#industry_select').val();
let loc = $('#location_select').val();
//console.log(key);
currentPageArchive++;
console.log(key);
$.ajax({
sort: 'POST',
url: '/wp-admin/admin-ajax.php',
dataType: 'json',
knowledge: {
motion: 'load_more_experts',
paged: currentPageArchive,
key phrase: key,
speciality: spec,
industry_select: ind,
location_select: loc
},
beforeSend: perform() {
$("#loaderArchiveDiv").present();
},
success: perform (res) {
setTimeout(() => {
if(res.size > 0) {
$("#loaderArchiveDiv").conceal();
//console.log(res);
res.forEach(ele => {
card = '<div class="col-md-3 expert-preview"><h4>' + ele['title'] + '</h4><p model="font-size:12px;">' + ele['location'] +', ' + ele['state'][0] + '</p><div class="headshot-container"><img src="' + ele['headshot']['sizes']['thumbnail'] +'"></div><div class="specality-container"><h5>Specialties</h5><p> ' + ele['specialities'][0]['name'] + ' </p><p> ' + ele['specialities'][1]['name'] + ' </p><p> ' + ele['specialities'][2]['name'] + ' </p></div><button sort="button" class="btn btn-link learn-more"><a href="' + ele['postLink'] + '">Study Extra</a></button></div>';
$('.experts-row').append(card);
});
} else {
$("#loaderArchiveDiv").conceal();
}
}, 1000);
}
});
}
There appears to be a disconnect between the unique search and the ajax calls, I really feel I could make it work by altering the outcomes from rand to desc or aesc however I would like them to be random.
Any perception can be superior! Thanks.