Do an ajax filtered query on loop

Anonymous

#142164

Hi, thanks for this plugin, it is what i was looking for.

Just a little question, it is possible to do an ajax filtered query with a link on the same page, I mean without using the search form but a link on the “displays results”?

I have a search form with a custom taxonomy, on display results I have this taxonomy as a link, I’d like if I click the link to reload the results with the taxonomy selected and change the search form as well.

Trevor

#142298

So, you want the link on the page to effectively change or add the taxonomy to the form and submit it? If that is what you want, then the link would have to fire some javascript to change the value and then re-submit the form. The form would have to be on the page, but you could hide it with CSS if you wanted.

Anonymous

#142355

Hum… I mean on the results page I have results with sport tag link, now if you click one of them, it reloads the page with that query, what I wanted it was to reload via Ajax, without reloading the whole page.
Thanks

Trevor

#142358

Are you able to send me a live link/URL to your search page so I can take a look?

Anonymous

#142728

Hi Trevor this is the link->

https://bewolfish.com/magazine/

see for example the tag #football- I’d like to do the ajax search once clicked.

Could you tell me also why the rating star system disappears on filtering or loading (infinite scroll)????
Thanks

Trevor

#142794

I went to that page. In the search form I selected Football and the page then used Ajax to load the results (it fades in and out). Is this not what you expected?

The star ratings not showing must be that this function is triggered on page/document load, and needs to be re-triggered when ajax has finished. We have code examples to allow this, but you would need to add in one or more lines specific to that star ratings function.

Is the star ratings a plugin or part of the theme?

Anonymous

#142796

Thanks Trevor, first I know football on search form, works.
I’d like to ajax reload if you click #football on results, grey colored.

Second the star rating is part of a plugin yes. I do a do_shortcode() to triggered on results.php, how can I do it?

th

Trevor

#142857

OK, I see what you mean on the grey tag links. You have made them as URLs. Instead you need to make them run a javascript and that javascript should set the required value in the tag field of the search field, and then submit the form (if it does not auto submit).

The do_shortcode() that you use, you say that is inside the results.php file. Can you paste the contents of the results.php template file here; please place one code back ticks before and one after the code (the angled quote mark on the key to the left of the main keyboard ‘1’ key)?

Anonymous

#142868

OK, first is solved, thanks a lot!

<?php
/**
 * Search & Filter Pro 
 *
 * Sample Results Template
 * 
 * @package   Search_Filter
 * @author    Ross Morsali
 * @link      http://www.designsandcode.com/
 * @copyright 2015 Designs & Code
 * 
 * Note: these templates are not full page templates, rather 
 * just an encaspulation of the your results loop which should
 * be inserted in to other pages by using a shortcode - think 
 * of it as a template part
 * 
 * This template is an absolute base example showing you what
 * you can do, for more customisation see the WordPress docs 
 * and using template tags - 
 * 
 * http://codex.wordpress.org/Template_Tags
 *
 */

if ( $query->have_posts() )
{
	?>
	
	
	<?php
	$nPosts = 0;
	while ($query->have_posts())
	{
		$query->the_post();
		$nPosts=$nPosts+1;
		$big= ($nPosts % 3);
		$isNextBig=($nPosts+1)%3;
		
		if($big=="0") echo"<br /> <div class='et_pb_column et-last-child'>";
		else if($isNextBig=="0")echo"<div class='et_pb_column et_pb_column_1_2 et-last-child'>";
		else echo"<div class='et_pb_column et_pb_column_1_2'>";
		?>

			<?php 
				if ( has_post_thumbnail() ) {
				    ?>
				    <a>">
				    <div class="cont">
						<div class='postimage' style='background-image: url("<?php the_post_thumbnail_url("large");?>")'></div>
						<div class="overlay_post">
						</div>
					</div></a>

					<?php
				}
			?>

	      <div class="below_image">
	          	
			<h2><a>"><?php the_title(); ?></a></h2>
			
			<?php echo do_shortcode("[yasr_visitor_votes_readonly]"); ?>
			
			<div class="desc"><?php the_excerpt(); ?></p></div>
			
			<p class="meta"><?php the_date();echo" | by ";?>
						
			<a>');" href="javascript:void(0);"><?php the_author();?></a></p>

			<p class="meta"><?php $categories = get_the_category(); 
			
			foreach($categories as $cat){
				
			?>
			
			<a>slug;?>');" href="javascript:void(0);"><?php echo $cat->cat_name;?></a>
			
			<?php
				}?>
			
			<?php $terms = get_the_terms($post->ID, "sport"); $count = count($terms); if ( $count > 0 ){ foreach ( $terms as $term ) {?>
			<a>slug;?>');" href="javascript:void(0);"><?php echo $term->name;?></a>
			<?php
			} } ?></p>
			<br/>
			
			<p><a>">READ MORE</a></p>
		</div>	
		</div>
		
		<?php
	}
}
else
{
	echo "Ops! no results found!";
}
?>
<script type="text/javascript">
function searchCat(slug){
jQuery('select[name="_sft_category[]"]').val(slug).change();
}
function searchAuthor(slug){
jQuery('select[name="_sf_author[]"]').val(slug).change();
}
function searchSport(slug){
jQuery('select[name="_sft_sport[]"]').val(slug).change();
}
</script>

Trevor

#142875

There appear to be some HTML errors in there. This line has a closing </p> tag that doesn’t appear to have an opening tag:

<div class="desc"><?php the_excerpt(); ?></p></div>

And just after the READ MORE line are two closing </div> tags, but seems to be unpaired. Maybe.

You mention Infinite Scroll. Have you set this in your theme or in our plugin, as there is a different results.php file for this.

[Author]

Posts