I want to add pagination to my page using ajax. I have referred this link http://www.infotuts.com/ajax-pagination-mysql-php-and-jquery/ and tried to follow the code.
But result I got is different than the demo. http://www.infotuts.com/demo/ajax-pagination-php-mysql-jQuery/
when the page is first loaded it shows first page but numbers are starting from 17 and when I move from page to page in between shows blank records for some page.
Not working like demo: http://www.infotuts.com/demo/ajax-pagination-php-mysql-jQuery/
Also dose not show which page is selected.
Here is link to my page :
http://104.131.162.126/agtvapp/index.php
dbmanipulate.php
<?php
include('Database.php');
$limit = 3;
$adjacent = 3;
if(isset($_REQUEST['actionfunction']) && $_REQUEST['actionfunction']!=''){
$actionfunction = $_REQUEST['actionfunction'];
call_user_func($actionfunction,$_REQUEST,$limit,$adjacent);
}
function showData($data,$limit,$adjacent){
$page = $data['page'];
if($page==1){
$start = 0;
}
else{
$start = ($page-1)*$limit;
}
$database = new Database(Constants::DBHOST,Constants::DBUSER,Constants::DBPASS,Constants::DBNAME);
$dbConnection = $database->getDB();
$stmt = $dbConnection->prepare("select * from posts order by pt_id asc");
$dbConnection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt->execute();
$rows = $stmt->fetchall(PDO::FETCH_ASSOC);
$count = $stmt->rowCount();
$stmt = $dbConnection->prepare("select * from posts order by pt_id asc limit $start,$limit");
$dbConnection->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
$stmt->execute();
$data = $stmt->fetchall(PDO::FETCH_ASSOC);
$str ='<table><tr><th>Title</th><th>Description</th><th>Likes</th><th>Views</th><th>Url</th></tr>';
if(count($data)>0){
foreach($data as $row){
$str .= '<tr><td>' . $row['title'] . '</td> <td>' . $row['description'] . '</td><td>'.$row['likes'].'</td><td>'.$row['views'].'</td>';
if (strcmp($row['url_type'],"2") == 0 || strcmp($row['url_type'],"3") == 0)
{
$str .= '<td><a href="'.$row['url'].'" target="_blank"><image alt="Image not found" onerror="this.onerror=null;this.src=\'na.jpg\';" src="'.$row['thumb_url'].'" height="150" width="150"></image></a></td></tr>';
/* $posts.= '<td>'.$row['url'].'</td></tr>';*/
}
elseif(strcmp($row['url_type'],"6") == 0){
// $parts = parse_url($row['url']);
// $urls=$parts['scheme'] . '://' . $parts['host'] . $parts['path'];
$thumb_url = $row['url'];
$url = $thumb_url . "media";
/* $posts.= '<td>'.$thumb_url.'</td></tr>';*/
$str .= '<td><a href="'.$row['url'].'" target="_blank"><image alt="Image not found" onerror="this.onerror=null;this.src=\'na.jpg\';" src="'.$row['thumb_url'].'" height="150" width="150"></image></a></td></tr>';
}
elseif(strcmp($row['url_type'],"7") == 0)
{
$str = substr($row['url'], 0, strrpos($row['url'], '?'));
$thumb_url = $str.'media';
/* $posts.= '<td>'.$thumb_url.'</td></tr>';*/
$str .= '<td><a href="'.$row['url'].'" target="_blank"><image alt="Image not found" onerror="this.onerror=null;this.src=\'na.jpg\';" src="'.$thumb_url.'" height="150" width="150"></image></a></td></tr>';
}
elseif(strpos($row['url'],"https://scontent.fbom") !==false )
{
$str .= '<td><a href="'.$row['url'].'" target="_blank"><image alt="Image not found" onerror="this.onerror=null;this.src=\'na.jpg\';" src="'.$row['url'].'" height="150" width="150"></image></a></td></tr>';
}
elseif(strpos($row['url'],"https://www.facebook.com/") !==false){
$facebookVideoId=getFacebookVideoID($row['url']);
//create thumbnail link and videos link
$json = file_get_contents('https://graph.facebook.com/'.$facebookVideoId.'');
$obj = json_decode($json);
//add thumbnail and video link in array
$thumb_url = $obj->picture;
$url =$obj->source;
$str .= '<td><a href="'.$url.'" target="_blank"><image alt="Image not found" onerror="this.onerror=null;this.src=\'na.jpg\';" src="'.$thumb_url.'" height="150" width="150"></image></a></td></tr>';
}
elseif(strcmp($row['url_type'],"1") == 0)
{
$myvideo = $row['url'];
$url = "videos/".$myvideo;
$str .= '<td><a href="'.$url.'" target="_blank"><image alt="Image not found" onerror="this.onerror=null;this.src=\'na.jpg\';" src="'.$url.'" height="150" width="150"></image></a></td></tr>';
}
elseif(strcmp($row['url_type'],"0") == 0)
{
$myImage = $row['url'];
$url = "images/".$myImage;
/* $posts.= '<td>'.$url.'</td></tr>';*/
$str .= '<td><a href="'.$url.'" target="_blank"><image alt="Image not found" onerror="this.onerror=null;this.src=\'na.jpg\';" src="'.$url.'" height="150" width="150"></image></a></td></tr>';
}
else{
$str .= '<td><a href="'.$row['url'].'" target="_blank">'.$row['url'].'</a></td></tr>';
}
}
} else {
$str.='<td>No data found</td>';
}
function getFacebookVideoID($url) {
preg_match("~/videos/(?:t\.\d+/)?(\d+)~i", $url, $matches);
return $matches[1];
}
$str.='</table>';
echo $str;
pagination($limit,$adjacent,$count,$page);
}
function pagination($limit,$adjacents,$count,$page){
$pagination='';
if ($page == 0) $page = 1; //if no page var is given, default to 1.
$prev = $page - 1; //previous page is page - 1
$next = $page + 1; //next page is page + 1
$prev_='';
$first='';
$page = $count/$limit;
$lastpage = ceil($page);
$next_='';
$last='';
if($lastpage > 1)
{
//previous button
if ($page > 1)
$prev_.= "<a class='page-numbers' href=\"?page=$prev\">previous</a>";
else{
//$pagination.= "<span class=\"disabled\">previous</span>";
}
//pages
if ($lastpage < 5 + ($adjacents * 2)) //not enough pages to bother breaking it up
{
$first='';
for ($counter = 1; $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a class='page-numbers' href=\"?page=$counter\">$counter</a>";
}
$last='';
}
elseif($lastpage > 3 + ($adjacents * 2)) //enough pages to hide some
{
//close to beginning; only hide later pages
$first='';
if($page < 1 + ($adjacents * 2))
{
for ($counter = 1; $counter < 4 + ($adjacents * 2); $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a class='page-numbers' href=\"?page=$counter\">$counter</a>";
}
$last.= "<a class='page-numbers' href=\"?page=$lastpage\">Last</a>";
}
//in middle; hide some front and some back
elseif($lastpage - ($adjacents * 2) > $page && $page > ($adjacents * 2))
{
$first.= "<a class='page-numbers' href=\"?page=1\">First</a>";
for ($counter = $page - $adjacents; $counter <= $page + $adjacents; $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a class='page-numbers' href=\"?page=$counter\">$counter</a>";
}
$last.= "<a class='page-numbers' href=\"?page=$lastpage\">Last</a>";
}
//close to end; only hide early pages
else
{
$first.= "<a class='page-numbers' href=\"?page=1\">First</a>";
for ($counter = $lastpage - (2 + ($adjacents * 2)); $counter <= $lastpage; $counter++)
{
if ($counter == $page)
$pagination.= "<span class=\"current\">$counter</span>";
else
$pagination.= "<a class='page-numbers' href=\"?page=$counter\">$counter</a>";
}
$last='';
}
}
if ($page < $counter - 1)
$next_.= "<a class='page-numbers' href=\"?page=$next\">next</a>";
else{
//$pagination.= "<span class=\"disabled\">next</span>";
}
$pagination = "<div class=\"pagination\">".$first.$prev_.$pagination.$next_.$last;
//next button
$pagination.= "</div>
";
}
echo $pagination;
}
?>
script
$(function(){
$.ajax({
url:"dbmanupulate.php",
type:"POST",
data:"actionfunction=showData&page=1",
cache: false,
success: function(response){
$('#pagination').html(response);
}
});
$('#pagination').on('click','.page-numbers',function(){
$page = $(this).attr('href');
$pageind = $page.indexOf('page=');
$page = $page.substring(($pageind+5));
$.ajax({
url:"dbmanupulate.php",
type:"POST",
data:"actionfunction=showData&page="+$page,
cache: false,
success: function(response){
$('#pagination').html(response);
}
});
return false;
});
});
style
#mhead{
background-color: #f5f5f5;
border: 1px solid #e3e3e3;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.05);
text-align: center;
font-family: georgia;
}
#pagination table{
width:960px;
margin:0px auto;
font-family:Tahoma,Arial,Verdana,sans-serif;
font-size:13px;
padding:4px;
border-collapse: collapse;
}
.head{
background:lightseagreen;
}
#pagination table tr td{
padding: 8px;
text-transform:capitalize;
border:1px solid #d1d1d1;
}
.pagination{
width:600px;
margin:0px auto;
}
.pagination .current{
padding: 4px 10px;
color: black;
margin: 1px 0px 9px 6px;
display: block;
text-decoration:none;
float: left;
text-transform: capitalize;
background: whitesmoke;
}
.pagination .page-numbers{
padding: 4px 10px;
color: white !important;
margin: 1px 0px 9px 6px;
display: block;
text-decoration:none;
float: left;
text-transform: capitalize;
background: #00b4cc;
}
I am not getting the issue,please help, thank you..
