waypoints icon indicating copy to clipboard operation
waypoints copied to clipboard

Multiple instances of Infinite Scroll fails to seperate more-link

Open madsbrydegaard opened this issue 9 years ago • 4 comments

I am using multiple instances of Infinite Scroll and had to make the following change to the Infinite.js to make it work:

In Infinite.js

Changed line 21 from this.$more = $(this.options.more) to this.$more = $(this.options.more, this.$container)

Changed line 35 from $.get($(this.options.more).attr('href'), $.proxy(function (data) { to $.get(this.$more.attr('href'), $.proxy(function (data) {

This adds context to the more link search and thus confines more-links to their containers

madsbrydegaard avatar Jan 10 '17 12:01 madsbrydegaard

Hi madsbrydegaard, did you change the class name of your more-links to make it work?

kvndevils avatar Nov 22 '18 22:11 kvndevils

Hi madsbrydegaard, did you change the class name of your more-links to make it work?

No I just checked - they are set to default: class="infinite-more-link"

madsbrydegaard avatar Nov 22 '18 22:11 madsbrydegaard

oh ok thanks a lot for the quick answer! I managed to change mines using for example: more: '.infinite-more-link-xx', May I ask you how you handled the pagination? Let say you have 2 lists, 2 waypoints. Do you have pass the two page numbers everytime? e.g. how do you keep up to date the first one when loading the second one.

kvndevils avatar Nov 22 '18 23:11 kvndevils

ok ignore I managed to fix it If it helps someone: one page param is enough in the more link here are the options I had to specify when creating the waypoint

var infinite2 = new Waypoint.Infinite({ element: $('.infinite-container-applications'), more: '.infinite-more-link-applications', items: '.infinite-item-applications', onBeforePageLoad: function () { $('.loading-applications').show(); }, onAfterPageLoad: function ($items) { $('.loading-applications').hide(); } });

kvndevils avatar Nov 22 '18 23:11 kvndevils