Masonry, infinite scroll and Ajax

Anonymous

#237796

Hi Trevor,

I finaly found the solution using a part of your code and Masonry documentation.
This is my full process to help other if you have a new request about that :

> I create a search&filter form using shortcode method, ajax load and infinite scroll.
> I used the RESULTS template of Infinite scroll but i delete the div ‘search-filter-results-list’.
> I call the masonry JS file and i use this function to apply the masonry system to my grid :

$container = $('.search-filter-results');		
$container.masonry({
	itemSelector: '.post',
	columnWidth: '.post'
});

$(function(){
	$(document).on("sf:ajaxfinish", ".searchandfilter", function(){
		console.log("ajax finish");
		$container.masonry('reloadItems');
		$container.masonry().append().masonry('appended'); 	
	});
}(jQuery));

Thanks a lot for your help.
Simon.

Trevor

#237800

Thanks for sharing and getting back to me. I will close this thread for now.

[Author]

Posts