Using infinite scrolling to load more content and extend the page? - php

Question

I am trying to use infinite scrolling to load the next 5 peices of content onto my screen without reloading the entire page. I have tried about a million things. I have the scroll bar tracking working great, but I have no idea how to set up an ajax request to load additional content when the scroll bar script is activated. Please help I have been stuck on this for two days.
here is my java script:
<script type="text/javascript">
function yHandler(){
var wrap = document.getElementById('wrap');
var contentHeight = wrap.offsetHeight;
var yOffset = window.pageYOffset;
var y = yOffset + window.innerHeight;
if(y >= contentHeight){
// Ajax call to get more dynamic data goes here
wrap.innerHTML += '<div class="newData"></div>';
}
var status = document.getElementById('status');
status.innerHTML = contentHeight+" | "+y;
}
window.onscroll = yHandler;
</script>
here is my php file to connect to my database:
<?php
# FileName="Connection_php_mysql.htm"
# Type="MYSQL"
# HTTP="true"
$hostname_dbConn = "localhost";
$database_dbConn = "Video";
$username_dbConn = "root";
$password_dbConn = "root";
$dbConn = mysql_pconnect($hostname_dbConn, $username_dbConn, $password_dbConn) or trigger_error(mysql_error(),E_USER_ERROR);
?>

Answer 1

Note: As noted by other commenters, put together a better picture with the individual pieces, but this should at least get you on the right track.
The question is very broad but for the AJAX bit use jQuery!
Simplest thing I can think of without getting into too many details.
JS
var last_grabbed = 5;
function scrollListen() {
...
$.post('path/to/script.php',{ 'last_row' : last_grabbed },function(response) {
$('.my-content-div').append(response);
last_grabbed += 5;
});
}
PHP
<?php
//your connection stuff, db select, etc
$row = $_POST['last_row']; //you should sanitize this though
$rs = mysql_query("SELECT ... LIMIT $row,5") or die(mysql_error());
while($row = mysql_fetch_assoc($rs)) {
?>
<!-- Do you HTML stuff here for each item !-->
<?php
}
?>
That should get you started. http://www.w3schools.com/php/php_mysql_intro.asp for more on the PHP side.