ceaseFire, stops all the endlessscroll on a given page

[sanjusoftware]

Hey,

I have a situation, I have multiple lists on a page which I want to have this endlessscroll. Now, in order to keep things DRY, I applied the endlessScroll on a class (scrolling_item_list) rather than on a div id.

Here is my code for reference:

$('.scrolling_item_list').endlessScroll({ fireOnce: false, ceaseFire: function(firesequence) { //mylogic here to return false, but am just hardcoding it for simplicity return true; }, callback: function(p) {
$.ajax({ type: "GET", url: "/projects/" + $(this).attr('project_id') + "/show_more_items", dataType: "script", data: { category : category, offset : offset } }); } })

I have 4 lists on a page with class scrolling_item_list, so I have this common code for all of them. Problem is that, if I do the ceaseFire once, it actually stops for all the lists on the page. Do you have any idea as to why this should happen and how to get around this problem without duplicating my code!!

[fredwu]

EndlessScroll should be attached to one instance only.

What you can do instead is something like this:

$('#scrolling_item_list1, #scrolling_item_list2').endlessScroll({
  // your config ...
});

[sanjusoftware]

Hey, good to know that.

But, I guess you may want to consider this, it would have been better that the ceaseFire just applied to the current list and not all!!

Though, I find it very strange that if I do it the way you suggested, it works fine. Because, here all you have changed is to take an array (kind of) and then apply the same code, which in effect is going to be same if I specify endlessscroll on the the CSS class, because internally JQuery would be taking all the elements of that class and attaching the script on them.

Any idea why it should not work then??