Andreas94's avatar

infinite scroll on pagination repeats elements

i have a sitoweb structured in:

{$items}

{$video}

{$other_items}

in $items are printed 12 items, while in $other_items 4 items, discarding the 12 printed before.

$articoli = Articoli::where('is_published', '0')->orderBy('published_at', 'desc')->limit(12)->get();
$articoli_other = Articoli::where('is_published', '0')->where('id', '<', $articoli[11]->id)->orderBy('published_at', 'desc')->paginate('3');

the problem is that the articles are (I reduce the 12 items into five to make reading easier):

item1
item2
item3
item4
item5

VIDEO

item6
item7
item8

when “Other Items” is pressed change the view I:

item1
item2
item3
item4
item5

VIDEO

item6
item7
item8
item1
item2
item3
item9
item10
item11

because when I press “Other articles”, it repeats item 1/2/3 to me and then puts me new ones?

This is the infinite scroll I use, and in other pages it works properly...

https://infiniteajaxscroll.com/

0 likes
3 replies
tinfoilman's avatar

It's probably something wrong with your infinite scroll configuration, and you didn't show us any of that code.

Open up the page inspector and look at the Network tab to see what the scroller is doing. You'll be able to see exactly what ajax requests it's making from Laravel each time you press "other items".

Andreas94's avatar

I'm continuing my evidence, if I enter the ajax request, load the subsequent news correctly without repeating it, but the “Other News” button disappears, not allowing the “page change”...

Idea?

$articoli = Articoli::where('is_published', '0')->orderBy('published_at', 'desc')->limit(12)->get();
$articoli_other = Articoli::where('is_published', '0')->where('id', '<', $articoli[11]->id)->orderBy('published_at', 'desc')->paginate('3');

if ($request->ajax()) {
	return view('front.component.article.othernews', compact('articoli_other'));
}
<div class="row">
	@include('front.component.article.othernews')
	<div class="row p-3 other_ajax"></div>
	<div class="col-12 row justify-content-center">
		<button class="load-more">Altri articoli</button>
	</div>
	<div class="col-12 row justify-content-center">
		{{ $articoli_other->links('vendor.pagination.simple-bootstrap-4') }}
	</div>
</div>

Please or to participate in this conversation.