Question

I want to achieve loading more results when a user continues to trigger scroll down event down to the bottom part of the browser. If my query has 20 rows of result, I want to initially load 5 results, when a user scrolls down, he/she should be able to see 5 more results… And this shall continue until all of the results are loaded and displayed.

Here’s the code that I have tried, this will only allow me to display more results once:
Anyone who can help me?

Javascript:

$.get('load_second.php', function(data) {
$('#result').append(data);
});

HTML

<div id='result'></div>

Answer 1

Insert a page variable. Initially this variable should be 1. Use this variable to retrieve the next pages and increase it by one with every request.

var page = 1;

$.get('load_data.php?page=' + page, function(data) {
   page += 1;
   $('#result').append(data);
});