在SQL查询中将JQuery变量用作OFFSET

Question

I am trying to implement an infinite scroll functionality for posts in a news feed. The posts are loaded into the news feed as soon as the user reaches the footer.

---

The Problem

Every time the ajax call is executed I would like to increase the offset of the query . I want to transfer the jquery offset variable somehow to php and the SQL query.

---

The Code

 // Infinite Scroll var offset = 0; if($(window).scrollTop() >= $('.post-wrapper').offset().top + $('.post-wrapper').outerHeight() - window.innerHeight) { if (element_in_scroll("footer")) { $('div.loadmoreajaxloader').show(); $.ajax({ url: '<?= Config::get('URL'); ?>index/loadPosts', success: function(data) { if(data) { $(".post-wrapper").append(data); $('div.loadmoreajaxloader').hide(); offset++; } else { $('div.loadmoreajaxloader').html('<center>Es sind keine weiteren Posts vorhanden.</center>'); } } }); } }); 

The Query

 $query = $database->prepare("SELECT * FROM posts LIMIT 1 OFFSET $offset"); $query->execute(); return $query->fetchAll(); 

---

The offset increments as I would like it to, in the jquery code ( console.log(offset) ouputs 1, 2, 3 and so on...). However, I cannot get this variable into the SQL query.

I would be very thankful for any kind of help!

Answer 1

You are not sending javascript variable offset in your ajax request

Change following line:

url: '<?= Config::get('URL'); ?>index/loadPosts',

to:

url: '<?= Config::get('URL'); ?>index/loadPosts?offset=' + offset,

Prevent SQL injections:

$query = $database->prepare("SELECT * FROM posts LIMIT 1 OFFSET :offset");
$query->execute(array(':offset' => $offset));

return $query->fetchAll();

Answer 2

1. Pass the offset value in AJAX .

2. GET the offset value in your PHP file

    // Infinite Scroll var offset = 0; if($(window).scrollTop() >= $('.post-wrapper').offset().top + $('.post-wrapper').outerHeight() - window.innerHeight) { if (element_in_scroll("footer")) { $('div.loadmoreajaxloader').show(); $.ajax({ url: '<?= Config::get('URL'); ?>index/loadPosts?offset='+offset, success: function(data) { if(data) { $(".post-wrapper").append(data); $('div.loadmoreajaxloader').hide(); offset++; } else { $('div.loadmoreajaxloader').html('<center>Es sind keine weiteren Posts vorhanden.</center>'); } } }); } } 

In PHP File

$offset = $_GET['offset'];
$query = $database->prepare("SELECT * FROM posts LIMIT 1 OFFSET $offset");
$query->execute();

return $query->fetchAll();