Support the ongoing development of →
Eloquent Views
Last updated 3 months ago.

I found a working solution! Let me share it for everyone who is looking for an infinite scroll-table in Laravel 5.

First, I simplified the table by removing unnecessary elements. The table and pagination now looks like this:


<table class="table">
    @foreach($articles as $article)
    <tr id="article-item">
      <td>{{ $article['title'] }}</td>
      <td>{{ $article['datetime'] }}</td>
<div id="pagination">{!! $articles->render()) !!}</div>

You might want to hide the pagination <div> by doing something like:

<div id="pagination" style="display: none">{!! $articles->render() !!}</div>

After that, I modified the JavaScript to work with the table:



    var loading_options = {
        finishedMsg: "End of rows",
        msgText: "Loading new rows...",
        img: "/assets/img/ajax-loader.gif"

    $('table.table tbody').infinitescroll({
      loading : loading_options,
      navSelector : "#pagination .pagination",
      nextSelector : "#pagination .pagination + li a",
      itemSelector : "#article-item"

Now it should work and the table will be automatically expanded when the end of the page is reached. The table columns may float for a second while loading new items. This is because the plugin is shortly displaying a div inside the <tbody>, letting the user know that new records are being loaded. I solved this by making a small modification to the plugin core:


s.loading.msg = s.loading.msg || e('<tr><div id="infscr-loading"><img alt="Loading..." src="' + s.loading.img + '" /><div>' + s.loading.msgText + "</div></div></tr>");

According to the documentation, <div id="infscr-loading"> is the loading div. To make ik work nice within the tabe, I wrapped this div inside a <tr> element to make sure it will be displayed properly.

All works fine now!

Last updated 6 years ago.

It's not working and total waste of time....


Sign in to participate in this thread!


Your banner here too?

php-it php-it php-it Joined 22 Nov 2014


We'd like to thank these amazing companies for supporting us

Your logo here?

The Laravel portal for problem solving, knowledge sharing and community building.

© 2022 - All rights reserved.