Hi there,
I have been following a tutorial online to create simple pagination using ajax. The pagination side of things works perfectly however I want to pass a GET variable through the page that is being loaded by jquery.
Config.php:
$item_per_page = 2;
Index.php:
<?php
include("config.php");
$results = mysqli_query($connecDB,"SELECT COUNT(*) FROM jobs");
$get_total_rows = mysqli_fetch_array($results); //total records
//break total records into pages
$pages = ceil($get_total_rows[0]/$item_per_page);
//create pagination
if($pages > 1)
{
$pagination = '';
$pagination .= '<ul class="paginate">';
for($i = 1; $i<$pages; $i++)
{
$pagination .= '<li><a href="#" class="paginate_click" id="'.$i.'-page">'.$i.'</a></li>';
}
$pagination .= '</ul>';
}
?>
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Ajax Pagination</title>
<script type="text/javascript" src="js/jquery-1.9.0.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("#results").load("fetch_data.php", {'page':0}, function() {$("#1-page").addClass('active');}); //initial page number to load
$(".paginate_click").click(function (e) {
$("#results").prepend('<div class="loading-indication"><img src="ajax-loader.gif" /> Loading...</div>');
var clicked_id = $(this).attr("id").split("-"); //ID of clicked element, split() to get page number.
var page_num = parseInt(clicked_id[0]); //clicked_id[0] holds the page number we need
$('.paginate_click').removeClass('active'); //remove any active class
//post page number and load returned data into result element
//notice (page_num-1), subtract 1 to get actual starting point
$("#results").load("fetch_data.php", {'page':(page_num-1)}, function(){
});
$(this).addClass('active'); //add active class to currently clicked element (style purpose)
return false; //prevent going to herf link
});
});
</script>
</head>
<body>
<div id="results"></div>
<?php echo $pagination; ?>
</body>
</html>
fetch_data.php:
include("config.php"); //include config file
//sanitize post value
$page_number = filter_var($_POST["page"], FILTER_SANITIZE_NUMBER_INT, FILTER_FLAG_STRIP_HIGH);
//validate page number is really numaric
if(!is_numeric($page_number)){die('Invalid page number!');}
//get current starting point of records
$position = ($page_number * $item_per_page);
//Limit our results within a specified range.
$results = mysqli_query($connecDB, "SELECT * FROM jobs ORDER BY created_at DESC LIMIT $position, $item_per_page");
//output results from database
echo '<ul class="page_result">';
while($row = mysqli_fetch_array($results))
{
echo '<li id="item_'.$row["title"].'">'.$row["title"].'. <span class="page_name">'.$row["location"].'</li>';
}
echo '</ul>';
If I try to print out a $_GET variable in the fetch_data.php file I just get a blank response. The reason I want to do this is so when I integrate it into my actual site I have a search feature that filters through the query.
If anyone could give me some guidance to what needs to be done that would be great.
the tutorial is located here: http://www.sanwebe.com/2013/03/ajax-pagination-with-jquery-php
Many thanks,
Zack.
