You are here
Home > Web Development > AJAX Development > PHP Pagination with Ajax and MySQL

PHP Pagination with Ajax and MySQL

Hi PHP User, today I am going to tell you how to develop PHP pagination with MySQL and AJAX for your websites. PHP Pagination is a very important in every websites reporting and in this post i will help you to Develop PHP pagination.

First create a database and table

Database name => webtechtricks
Table name => pagination
Column names => id, post, postlink

Files that is used for pagination are

db.sql
db.php
style.css
function.php
index.php
loadData.php

Your Code started here

db.sql – this code for Database file run in your mysql to create database and add data in table.

create database `webtechtricks`;
use `webtechtricks`;
CREATE TABLE `pagination` (
`id` int(11) NOT NULL auto_increment,
`post` varchar(250) NOT NULL,
`postlink` varchar(250) NOT NULL,
PRIMARY KEY  (`id`)
) ENGINE=MyISAM AUTO_INCREMENT=48 DEFAULT CHARSET=latin1 AUTO_INCREMENT=48 ;
INSERT INTO `pagination` VALUES (1, ‘How to Resize text using jQuery’, ‘http://www.webtechtricks.com/?p=312’);
INSERT INTO `pagination` VALUES (2, ‘How to Integrate live search in PHP and MySQL with jQuery’, ‘http://www.webtechtricks.com/?p=309’);
INSERT INTO `pagination` VALUES (3, ‘How to implement jquery Timeago with php’, ‘http://www.webtechtricks.com/?p=290’);
INSERT INTO `pagination` VALUES (4, ‘How to Mask an input box in jQuery’, ‘http://www.webtechtricks.com/?p=304’);
INSERT INTO `pagination` VALUES (5, ‘How to block Inappropriate content with javascript validation’, ‘http://www.webtechtricks.com/?p=301’);
INSERT INTO `pagination` VALUES (6, ‘How to Crop Image with jQuery and PHP’, ‘http://www.webtechtricks.com/?p=298’);
INSERT INTO `pagination` VALUES (7, ‘How to Integrate jQuery Scroll Paging with PHP’, ‘http://www.webtechtricks.com/?p=294’);
INSERT INTO `pagination` VALUES (8, ‘Bug Reporting with Windows Program Steps Recorder (PSR)’, ‘http://www.webtechtricks.com/?p=291’);
INSERT INTO `pagination` VALUES (9, ‘How to Configure Google Cloud API in PHP’, ‘http://www.webtechtricks.com/?p=288’);
INSERT INTO `pagination` VALUES (10, ‘How to convert text to MP3 Voice’, ‘http://www.webtechtricks.com/?p=284’);

db.php –this code used for Database configuration file edit database name, user and password as per your configuration

<?php
$connection = mysql_connect(‘localhost’,’webtechtricks’,’********’) or die(mysql_error());
$database = mysql_select_db(‘webtechtricks’) or die(mysql_error());
?>

style.css – this is code used for styling your page

<style type=”text/css”>
ul.tsc_pagination { margin:4px 0; padding:0px; height:100%; overflow:hidden; font:12px \’Tahoma\’; list-style-type:none; }
ul.tsc_pagination li { float:left; margin:0px; padding:0px; margin-left:5px; }
ul.tsc_pagination li:first-child { margin-left:0px; }
ul.tsc_pagination li a { color:black; display:block; text-decoration:none; padding:7px 10px 7px 10px; }
ul.tsc_pagination li a img { border:none; }
ul.tsc_paginationC li a { color:#707070; background:#FFFFFF; border-radius:3px; -moz-border-radius:3px; -webkit-border-radius:3px; border:solid 1px #DCDCDC; padding:6px 9px 6px 9px; }
ul.tsc_paginationC li { padding-bottom:1px; }
ul.tsc_paginationC li a:hover,
ul.tsc_paginationC li a.current { color:#FFFFFF; box-shadow:0px 1px #EDEDED; -moz-box-shadow:0px 1px #EDEDED; -webkit-box-shadow:0px 1px #EDEDED; }
ul.tsc_paginationC01 li a:hover,
ul.tsc_paginationC01 li a.current { color:#893A00; text-shadow:0px 1px #FFEF42; border-color:#FFA200; background:#FFC800; background:-moz-linear-gradient(top, #FFFFFF 1px, #FFEA01 1px, #FFC800); background:-webkit-gradient(linear, 0 0, 0 100%, color-stop(0.02, #FFFFFF), color-stop(0.02, #FFEA01), color-stop(1, #FFC800)); }
ul.tsc_paginationC li a.In-active {
pointer-events: none;
cursor: default;
}
</style>

function.php – this is code used for your pagination functions

<?php
define(‘PAGE_PER_NO’,8); // number of results per page.
function getPagination($count){
$paginationCount= floor($count / PAGE_PER_NO);
$paginationModCount= $count % PAGE_PER_NO;
if(!empty($paginationModCount)){
$paginationCount++;
}
return $paginationCount;
}
?>

index.php – this is the code used for your index page

include_once(‘db.php’);
include_once(‘function.php’);
$query=”select id from pagination order by id desc”;
$res=mysql_query($query);
$count=mysql_num_rows($res);
if($count > 0){
$paginationCount=getPagination($count);
}
$content ='<div id=”pageData”></div>’;
if($count > 0){
$content .='<ul class=”tsc_pagination tsc_paginationC tsc_paginationC01″>
<li class=”first link” id=”first”>
<a  href=”javascript:void(0)” onclick=”changePagination(\’0\’,\’first\’)”>F i r s t</a>
</li>’;
for($i=0;$i<$paginationCount;$i++){
$content .='<li id=”‘.$i.’_no” class=”link”>
<a  href=”javascript:void(0)” onclick=”changePagination(\”.$i.’\’,\”.$i.’_no\’)”>
‘.($i+1).’
</a>
</li>’;
}
$content .='<li class=”last link” id=”last”>
<a href=”javascript:void(0)” onclick=”changePagination(\”.($paginationCount-1).’\’,\’last\’)”>L a s t</a>
</li>
<li class=”flash”></li>
</ul>’;
}

AJAX Code – this is AJAX code for pagination

<script type=”text/javascript”>
function changePagination(pageId,liId){
$(“.flash”).show();
$(“.flash”).fadeIn(400).html
(‘Loading <img src=”image/ajax-loading.gif” />’);
var dataString = ‘pageId=’+ pageId;
$.ajax({
type: “POST”,
url: “loadData.php”,
data: dataString,
cache: false,
success: function(result){
$(“.flash”).hide();
$(“.link a”).removeClass(“In-active current”) ;
$(“#”+liId+” a”).addClass( “In-active current” );
$(“#pageData”).html(result);
}
});
}
</script>

loadData.php – code for load data from database on auto load and onclick events.

<?php
include_once(‘db.php’);
include_once(‘function.php’);
if(isset($_POST[‘pageId’]) && !empty($_POST[‘pageId’])){
$id=$_POST[‘pageId’];
}else{
$id=’0′;
}
$pageLimit=PAGE_PER_NO*$id;
$query=”select post,postlink from pagination order by id desc
limit $pageLimit,”.PAGE_PER_NO;
$res=mysql_query($query);
$count=mysql_num_rows($res);
$HTML=”;
if($count > 0){
while($row=mysql_fetch_array($res)){
$post=$row[‘post’];
$link=$row[‘postlink’];
$HTML.='<div>’;
$HTML.='<a href=”‘.$link.'” target=”blank”>’.$post.'</a>’;
$HTML.='</div><br/>’;
}
}else{
$HTML=’No Data Found’;
}
echo $HTML;
?>

 

Leave a Reply

Top