使用jQuery和AJAX从数据库中显示更多结果

Question

I'm trying to create news block with AJAX in my template. so i wrote a simple code, in HTML Part:

<a href="javascript:ShowPost();">Show Posts</a>
<div id="result"></div>

jQuery Part:

function ShowPost(){
  $.post(dir + 'engine/ajax/posts.php', {action:"showpost"},
    function(data) {
      $("#result").html(data);
});
};

PHP Part:

if ($_POST['action'] == "showpost") {    
 $db->query( "SELECT title FROM post LIMIT 0,5 " );
  while ( $row = $db->get_row() ) {
   echo $row['title']."<br>";
  }    
}

Question is, how i can get more result after first click? for example, after first click on Show Posts link, i can show the 5 news from database. after second click on Show Posts link i need to show 6 to 10 news, in third click get result from 11 to 15 and continue ...

i hope you understand my question.

Answer 1

Based on your implementation you need to keep track how many items you have shown and pass the page number in. For example:

jQuery Part:

var pageNumber = 0; 
function ShowPost() {   
   pageNumber++;   
   $.post(dir+ 'engine/ajax/posts.php', {action:"showpost", pageNum: pageNumber},
      function(data) {
       $("#result").html(data); 
   }); 
};

Disclaimer: I m not a PHP developer so please treat teh code below as pseudo-code.

PHP Part:

if ($_POST['action'] == "showpost") {    
var pageSize = 5;  
var pageNumber = $_POST['pageNumber'];    
var from = (pageNumber - 1) * pageSize;   
var to = pageNumber * pageSize;  
$db->query( "SELECT title FROM post LIMIT " + from + "," + pageSize);   
while ( $row = $db->get_row()) {    echo $row['title']."<br>";   }     
}