infinite scroll manual trigger callback

Question

I'm using Infinite Scroll plugin in a (I know it is unrecommended http://isotope.metafizzy.co/docs/help.html#infinite_scroll_with_filtering_or_sorting), Infinite Scroll + Isotipe Filtering combination.

Now sometimes happend that after i run my filter, if I get an empty list i manually trigger infinite scroll to load more elements.

$('.items').isotope({ filter: filter }, function( $items ) {
    var id = this.attr('class'),
    len = $items.length;
    if (len == 0){getElement();}
});

Here is my function that load elements, but it seems that the callback is not working.

function getElement(){
    $('.items').infinitescroll('retrieve',function(items){  
         console.log('callback');
          console.log(items);   
     });
}

Unfortunally Infinite Scroll documentation is not the best for manual trigger (it suggest a not-working way to call it - $(document).trigger('retrieve.infscr'); i found the solution here: infinite scroll manual trigger) so I'm a little bit stucked here.

Any suggestion?

Answer 1

I know it is a very old post. But I find it over Google as I searched for the self problem. But I also find the solution for this. Perhaps it helps somebody...

You must put the callback not to the main function. Because manual function only push the main function.

jQuery(document).ready(function($) {
var $infinitecontainer = $(".infinite-content").infinitescroll({
  navSelector: ".nav-links",
  nextSelector: ".nav-links a:first",
  itemSelector: ".infinite-post",
  errorCallback: function(){ $(".inf-more-but").css("display", "none") }
}, function() { // callback
      alert("Manual click load finished");
});

$(window).unbind(".infscr");
$(".inf-more-but").click(function(e){
    e.preventDefault();
    var infinite_scroll = $(".infinite-content").infinitescroll("retrieve");
    return false;
});