Menu
The Tech Paper
  • Home
  • Interview Questions
    • PHP String Interview Question
    • PHP Array Interview Qutions
    • jQuery Interview Quetions
    • PHP Interviwe Question on php.ini file
    • htaccess File Interview Quetions
  • About
The Tech Paper

Lazy loader/Infinite Scroll Pagination Using Laravel & jScroll – Laraget

Posted on July 20, 2019July 11, 2020

Instead of having to click a link to get to the next set of content, infinite scrolling (also known as lazy loading, endless scrolling, autopager, endless pages, etc.) pulls the next content automatically into view when the reader approaches the bottom of the page.

If you want to implement infinite scroll pagination using Laravel, get the jScroll (a jQuery plugin written by Philip Klauzinski) include in page.

Add this code in your page

 

<\script type=”text/javascript”>
// jquery.jscroll.js using for auto scroll
$(‘ul.pagination’).hide();
$(function() {
$(‘.infinite-scroll’).jscroll({
autoTrigger: true,
autoTriggerUntil: false,
loadingHtml: ‘<img class=”center-block” src=”‘+base_url+’/img/loading.gif” alt=”Loading…” />’,
padding: 0,
nextSelector: ‘.pagination li.active + li a’,
contentSelector: ‘div.infinite-scroll’,
callback: function() {
$(‘ul.pagination’).remove();
}
});
});
<\/script>

Also apply “infinite-scroll” class on the foreach loop

<\div class=”infinite-scroll”>
@foreach ($products as $item)
— —

@endofrech
<\/div>”

 

 

Leave a Reply Cancel reply

Your email address will not be published. Required fields are marked *

Categories

  • Docker
  • Git
  • Interview Questions
  • Laravel
  • Linux
  • php

Recent Posts

  • Create a swap memory in Linux
  • Hide protected files in Laravel
  • Make a bootable pendrive in Linux
  • Docker Commands
  • Git Commands

Archives

  • December 2020
  • September 2020
  • July 2020
  • January 2020
  • July 2019
  • August 2018
  • June 2018
  • April 2018
  • September 2017
  • June 2017
  • May 2017

Recent Posts

  • Create a swap memory in Linux December 2, 2020
  • Hide protected files in Laravel September 21, 2020
  • Make a bootable pendrive in Linux September 10, 2020
  • Docker Commands July 3, 2020
  • Git Commands January 8, 2020

Contact Us

©2021 The Tech Paper | Powered by SuperbThemes & WordPress