Long days back I had posted an article Pagination with jQuery, MySQL and PHP with out refreshing page. Ravi Tamada modified old script and added extra features like First, Previous, Next and Last buttons. Use it and enrich your web applications. Demo link

Download Script
Live DemoAbout Author

MySQL messages table contains two columns msg_id and message
CREATE TABLE messages
(
msg_id INT PRIMARY KEY AUTO_INCREMENT,
message VARCHAR(150)
);
(
msg_id INT PRIMARY KEY AUTO_INCREMENT,
message VARCHAR(150)
);
JavaScript Code
This script works like a data controller.
<script type="text/javascript" src="http://ajax.googleapis.com/
ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
function loading_show()
{
$('#loading').html("<img src='images/loading.gif'/>").fadeIn('fast');
}
function loading_hide()
{
$('#loading').fadeOut();
}
function loadData(page)
{
loading_show();
$.ajax
({
type: "POST",
url: "load_data.php",
data: "page="+page,
success: function(msg)
{
$("#container").ajaxComplete(function(event, request, settings)
{
loading_hide();
$("#container").html(msg);
});
}
});
}
loadData(1); // For first time page load default results
$('#container .pagination li.active').live('click',function(){
var page = $(this).attr('p');
loadData(page);
});
});
</script>
ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
function loading_show()
{
$('#loading').html("<img src='images/loading.gif'/>").fadeIn('fast');
}
function loading_hide()
{
$('#loading').fadeOut();
}
function loadData(page)
{
loading_show();
$.ajax
({
type: "POST",
url: "load_data.php",
data: "page="+page,
success: function(msg)
{
$("#container").ajaxComplete(function(event, request, settings)
{
loading_hide();
$("#container").html(msg);
});
}
});
}
loadData(1); // For first time page load default results
$('#container .pagination li.active').live('click',function(){
var page = $(this).attr('p');
loadData(page);
});
});
</script>
load_data.php
Contains PHP coding. Displaying data from the messages table.
<?php
if($_POST['page'])
{
$page = $_POST['page'];
$cur_page = $page;
$page -= 1;
$per_page = 15; // Per page records
$previous_btn = true;
$next_btn = true;
$first_btn = true;
$last_btn = true;
$start = $page * $per_page;
include"db.php";
$query_pag_data = "SELECT msg_id,message from messages LIMIT $start, $per_page";
$result_pag_data = mysql_query($query_pag_data) or die('MySql Error' . mysql_error());
$msg = "";
while ($row = mysql_fetch_array($result_pag_data))
{
$htmlmsg=htmlentities($row['message']); //HTML entries filter
$msg .= "<li><b>" . $row['msg_id'] . "</b> " . $htmlmsg . "</li>";
}
$msg = "<div class='data'><ul>" . $msg . "</ul></div>"; // Content for Data
/* -----Total count--- */
$query_pag_num = "SELECT COUNT(*) AS count FROM messages"; // Total records
$result_pag_num = mysql_query($query_pag_num);
$row = mysql_fetch_array($result_pag_num);
$count = $row['count'];
$no_of_paginations = ceil($count / $per_page);
/* -----Calculating the starting and endign values for the loop----- */
//Some Code. Available in download script
}
?>
if($_POST['page'])
{
$page = $_POST['page'];
$cur_page = $page;
$page -= 1;
$per_page = 15; // Per page records
$previous_btn = true;
$next_btn = true;
$first_btn = true;
$last_btn = true;
$start = $page * $per_page;
include"db.php";
$query_pag_data = "SELECT msg_id,message from messages LIMIT $start, $per_page";
$result_pag_data = mysql_query($query_pag_data) or die('MySql Error' . mysql_error());
$msg = "";
while ($row = mysql_fetch_array($result_pag_data))
{
$htmlmsg=htmlentities($row['message']); //HTML entries filter
$msg .= "<li><b>" . $row['msg_id'] . "</b> " . $htmlmsg . "</li>";
}
$msg = "<div class='data'><ul>" . $msg . "</ul></div>"; // Content for Data
/* -----Total count--- */
$query_pag_num = "SELECT COUNT(*) AS count FROM messages"; // Total records
$result_pag_num = mysql_query($query_pag_num);
$row = mysql_fetch_array($result_pag_num);
$count = $row['count'];
$no_of_paginations = ceil($count / $per_page);
/* -----Calculating the starting and endign values for the loop----- */
//Some Code. Available in download script
}
?>









Very nice....
Please write tutorial Codeigniter and Jquery...
Great!
good one brother
Nice ;)
Its nice script :)
thanks
very niceeeeeeeeeeeee..............
very nice....this type of paging i expected thanks.
Hi, thank a lot for this!
hope you some day write some implementation with codeigniter!
greetings!
Note : New Subscribers
new email data updating every 6 hours
nice and like it very much.
Thanks a ton Srinivas... working awesome...
You rock :)
nice script ;)
Thanks..It's Good
Thanks
Hi srinivas
Firstly Thank For this nice script. But ı can't download this script Though I Subscribed my mail. When ı dowload it a warning comes on the screen as "1 Email Pending Verification. Please active or Subscribe" but I've activated my mail. what is wrong I dont know?
For some reason this demo crash any website hosted in a basic Godaddy hosting.
Any fix for this?
its a great job...
thanks a lot ^^
salam bloglang \m/ :D
Thank you it's nice, my social media is done but yours pagination i add.
Signup & active:
1.activated my mail
Download:
2.Sorry no email present subscribe below...
signup:
3.My Email is already subscribed to the mailing list of 9lessons.
Download again:
4.Sorry no email present subscribe below...
Download again,again and again:
5.Sorry no email present subscribe below...
help me?
@Lori
New subscriber emails updating every 12 hours
oic....thanks you so much...
Hi Ravi, sorry, but I've subscribed since this morning, and still cannot download it :S Need help!! :)
Very Nice, I implement this post using POO, PDO and MVC, Coming soon in my blog!!!
Thank you Ravi Tamada.
@Norant
You are Welcome :)
thanks for the nice tutorial.
Ravi, can you make another tutorial about how to apply pagination on search result.
thanks for the nice script! I really love it, but it doesn't work on iOS Devices :-(
The navigation isn't clickable...
Cannot enter a page number with Firefox :(
Brilliant posting you have done great job, it’s so great helpful for me. And I am looking forward of this post thank you.
Hi,
The page numbers are flashing on mouseover and I am unable to see any changes on clicking them.
I am using Google Chrome, any idea what's wrong?
Thanks
Just in case anyone's having a problem with iOSX devices (iphone,ipads) you need add:
$('#pagination .pagination li.active').live('touchend',function(){
var page = $(this).attr('p');
loadData(page);
});
in the JavaScript for iOSX Support as these devices do not support 'click' ...
Great Script, Many Thanks...
@Chris : Thanks for the Great tip!
Thanks for sharing such a nice stuff. Please share some more stuff of AJAX with php/mysql.
Thanks beforehand.
man this is so cool i love your pagination tutorial, keep it coming.
THANKS
Subscribers emails updated..
thanks for this nice tutorial. a very big help to me. btw, how can I pass a parameter into the load_data.php script? e.g. search result
ur site is my first reference now..
The Best Tutorial. Thank you.
It's really great. Thanks ~
Nice work bro..its really good..
I know this may sound stupid but, how can I add the tables already on my website to my mysql database named as messages since this program needs them to be called messages. Thank You
this tutorial is great. One suggestion though. it would be very much helpful if can also advice how to make this AJAX more SEO friendly.. please assist someone..
good
bug: on refresh goes to page 1: How do I fix that?
This is ajax pagination. Once page refresh It will show fist page.
good work
how to apply pagination on search result.
urgent
help me,
I need a search model
I've modified the file load_data.php
$query_pag_data = "SELECT msg_id,message from messages";
$query_pag_data = $query_pag_data ."where msg_id is not null ";
if (isset($_POST['txt_search'])) {
$txt_search = $_POST['txt_search'];
$query_pag_data = $query_pag_data ."and message like '%$txt_search%'";
}
$query_pag_data = $query_pag_data ."LIMIT $start, $per_page ";
file pagination.php
function loadData(page){
loading_show();
var txt_search = $("input#txt_search").val();
$.ajax
({
type: "POST",
url: "load_data.php",
data: "page="+page+txt_search,
success: function(msg)
{
$("#container").ajaxComplete(function(event, request, settings)
{
loading_hide();
$("#container").html(msg);
});
}
});
}
not work
anyone can help me
thank you
Thank you.
It is really seemed a good tutorial , but i need to download it.
I subscribe but nothing happened to download the script
Can anyone demonstrate a classic asp version of this?
Emails updated
I not Javascript programmer but found this part of the code would load in an increment times each times I click the next or previous page, which mean:
$("#container").ajaxComplete(function(event, request, settings) { alert("load"); ... }
it seem to load with one alert prompt, when I click "page 2", it would prompt 2 times,
click "page 5", it would prompt 3 times,
click "page 1", it would prompt 4 times
if I click 50 pages, am I expect it to prompt 50 times rather than once? I not sure where is the problem. I would appreciate to know if anyone can solve this bug.
Hi,
Thanks for the code.
Could you please update the emails database ?
Thanks!
Yep, looks very nice. Unfortunately, I can't download the script even if I confirmed my subscription.
Can you update the email database please?
Oups, just see, database update every 18 hours, thks.
Hi, Need email id, i want to download the file..
Can u update the email db please?
nice tut's Ravi,
and i think i'm already get 18 hours but why still can't reach the data for download,
please update the database,..thx
Oink
excellent, thanks.
Excellent script, I used this script in my codeigniter project...
Thanks for sharing this kind of stuff.
Why are you mixing presentation with business layer?
please Update your database as soon as possible as i want to download script
Hi,
thaks for this script but I have a problem using with fancybox.this lines
$("#container").ajaxComplete(function(event, request, settings)
{
loading_hide();
$("#container").html(msg);
});
are not compatible with Fancybox call.
Do you have any solutions?
Thanks
Nice tutorial, but I've a problem with loading icon. In first load appears there for ever unless if you click to move to another page. Then works fine (IE8). Also, how I can change the mouse pointer?
This is *great*. Thank you very much.
Cheers.
Awesome - can you refresh the email list?
can u provide me the pagination.php page ?????
How can I sort the results?
Awesome - can you refresh the email list?
Hi, nice script, but I have problem with it in ie (all version).
when I have more then 1 page it doesn´t work - I mean it doesn´t show comments just pagination without style etc.
don´t you know where is mistake?
thank for your answer.
thanks it a great help
dude, seriously? you're making people subscribe before they can dl the tutorial? and then you have an 18 hour wait?!? not cool.
@Mike
We are not charging anything, if you want this script wait sometime.
hey man you are great !!!!
Thanx...
Wow, I just Love This Man
You Rocks
jQuery Rocks
can i ask if we can add search for a record. and can we jump for a specific page because i have a large database thanks
Thanks
Thanks, but i am waiting forever for download code....
also to fix multiple requests when click add
return false; after loadData(page)
excellent, thanks.
Hi Srinivas,
Any update about this:
Quote:
I not Javascript programmer but found this part of the code would load in an increment times each times I click the next or previous page, which mean:
$("#container").ajaxComplete(function(event, request, settings) { alert("load"); ... }
it seem to load with one alert prompt, when I click "page 2", it would prompt 2 times,
click "page 5", it would prompt 3 times,
click "page 1", it would prompt 4 times
if I click 50 pages, am I expect it to prompt 50 times rather than once? I not sure where is the problem. I would appreciate to know if anyone can solve this bug.
Thanks
Nice!
How can i run multiple instances of this on a page? i have a page with tabs showing different content that i want to paginate.
Hello friend, very nice tutorial.
I have a problem. I cannot display Greek characters from my db. It shows "?? ????? SEO?".
i try this on db.php "mysql_query("SET CHARACTER SET utf8");" but nothing.
Any Help?
Help! Need emails update! I want to download it!
Does this supports Arabic ?
greate bro...
Great script. Just one suggestion for future revision - and this is common to a lot of AJAX pagination scripts: hard-coding the page size into the script may not be helpful for all applications. I use a variation of this script with a database which returns anything from 1 - 132 results, depending on the search term. For a majority of search terms, a page with 10 results is fine (and more importantly, keeps all the important information in view on even a smallish desktop), but not so useful for the small number of search terms returning a lot of results.
hi,
im beginer in developing... How can i add another column to this scrpit. I would like to display id image and description. Thanks:)
thanks for this nice tutorial. But don't work for me. show object not found and below pagination buttons only. btw, how can I pass a parameter into the load_data.php script? e.g. search result using php array to javascript
hopefully you still update the emails :) I liked one of your old tutorials a lot! Hopefully this will shed some lights in my head!
Hi,
My Name is vishal from last some days i was searching the code of paging
....and i want to tell you thank you this code solved my all problems
hi Ravi. What is the reason to check for Emails not in the database of the subscripers? I can't see any advantage "updating" the database every 18 hours.
it dont have first, last , prev and next link...
some visitors comments insert in different language, e.g. Russian (in Cyrillic) so i have problem with encoding, i have database with utf-8 coding and i changed charset to utf-8 but with no success. Any advice ?
hiiiiiiiiii
your script is not downloaded by.I m already subscribed.plz tell me how it is poassible
nice work done appreciated!! :-)
Hi,
What should I change to the content to be visible in the source code to the script was more SEO friendly. Any ideas?
Hi,
I want to download script but i can't, please help me??
This one is great, I wonder if you could make it stay on the same page every time you refresh?
Hi,
Thanks for the code. It's very nice
Could you please update the emails database ? I want to download scripts
Thanks!
great script. a lot of the jquery/mysql pagination tutorials ive come across just leave out the first/last buttons, which are pretty important imo, especially when there are lots of pages
thanks is amazing i can do it
Thank you very much!!!
good good :_)
great
hi how can i pass another value with the page value in this, i tried but failed to
function loadData(page)
i want to pass another value like
function loadData(page, catid)
coz it will be filtered for catid
nice
nice
gr8
@Anonymous @ysetiawan
i'm not good at programming but, to avoid those recurring alert box, try to change
$("#container").ajaxComplete(function(event, request, settings)
{
loading_hide();
$("#container").html(msg);
});
to just this
loading_hide();
$("#container").html(msg);
when i tried it, alert box only appears once each click..
@anonymous
to get the css hover, and pointer works correclty in IE 8,9 just like firefox and chrome (haven't tested it in IE6 or IE7)
you can change the DOCTYPE to this
!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">"
good
Hi,
Thanks for your script.
George Luiz
You have done very nice pagenation
where i can download? trying last two days??
Thanks for your pagination code which meet my requirement. I subscribed with email.Please update the database to download the script.
Thanks.
hi good code.
please suggest me how can i implement seralise() method in this
thanks man :)
Thanks for the script. I use this script in all my coding. Many Thanks.
i am struck coz, i need to seriailze the data sent. could you please tell me how to do that
Great tut but would love it even better if you'd indented your code!
great job
nice job!!!!!
Very good coding, I found this article useful. Thanks
I'm not giving my email just to obtain your code. Nice try.
Great work , Sir . Can you please update the Subscriber info.People like you are essential for the well being of open-source community. Good luck.
Wow, Absolutely Fantastic... Thank you very much sir.... It helps me a lot.
Thnx.. a lot for the awesome code!!!!
its really useful for me.
Thanks bro.... This is really a nice script. Like it.. Thanks for sharing such a nice code with us !!!!!!!!!!!!!!
Hey Srinivas,
well thanks for this nice post, i need a urgent help on this topic.
I am using this script in one of my project, i need a slide effect in each page click, so i am using bxslider for this. but its not working over it.. can you help me to sort out this..
Thanks a lot for this script, can't wait to download and use it.
But when will the subscriber info be updated? Why can't it just be an hour or something?
Please update the subscriber email list -- THX --- Awesome script!!!
Use SQL_CALC_FOUND_ROWS in the first statement to prevent having to COUNT(*) the results afterwards. Then retrieve the total number of rows with 'SELECT FOUND_ROWS() AS `count`;'
Hello Srinivas,
first of all i would like to thank you for your very helpful script.
I made the script to work perfect on all browsers but on iphone,ipads and android browsers the pagination bar(numbers,first,last) doesn't show at all.
Is there a hint that could help me fix it?
i want this coding.. but i can't..
Hi..this demo looks really nice! thanks for sharing..
i found what i'm looking for......thnx
i found what i'm looking for......thnx
How do i pass along GET variabel ?
like
index.php?categori=".$categori."categori_sub=".$categori_sub etc ?
some exp ? pls
How do i pass along GET variabel ?
like
index.php?categori=".$categori."categori_sub=".$categori_sub etc ?
some exp ? pls
I mean like this
--------------------------
URL :index.php?categori=2&categori_sub=12&cat_options=3
Hi, i need to show the search results based on some parameters. can you let me know how i pass those variables from pagination.php to pagination_data.php.
-Thanks
it's working perfectly in every combination, but i want to user group by in 'query_pag_num'.
when i use group by it will not working correctly.
for example : SELECT COUNT(*) AS count ,members.m_id as m_id,product.productname as pname,product.p_id as p_id,product.pimage FROM members left join product ON members.m_id=product.m_id where members.status='1' AND members.ccity LIKE '%".$_POST['city']."%' AND ( members.companyname LIKE '%".$_POST['name']."%' OR product.productname LIKE '%".$_POST['name']."%') group by members.m_id
plz tell me solution.
thanks
How to download the COde
but i need to download it, I subscribe but nothing happened to download the script
Why do you need someones email address or to subscribe for something he does not want to. If you put some tutorial then leave it to the people if they want to give you their email address so you can sell it.
This is greate tut ! Thank so much !
if we pass negative no to "go" option, we get below message:
--Pagination with jquery, Ajax and PHP(tutorial link)--.
MySql ErrorYou have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '-45, 15' at line 1
nice tip
Grt Wrk.. Thanks So much
I was looking for tutorial which shows pagination results on the same page without refreshing the page. You tutorial was helpful for me.
nice tutorial, please update the records, i need download the source code.
tks
the subscription is the most annoying thing you can put your visitors in front of... thanks for not being able to check the code...
Great script. Just one suggestion for future revision - and this is common to a lot of AJAX pagination scripts: hard-coding the page size into the script may not be helpful for all applications. I use a variation of this script with a database which returns anything from 1 - 132 results, depending on the search term. For a majority of search terms, a page with 10 results is fine (and more importantly, keeps all the important information in view on even a smallish desktop), but not so useful for the small number of search terms returning a lot of results.
please update the records, i need download the source code.
Thanks....
thanks a lot.. is very good!
I have a form on pagination.php page and it have 3 fields name "fromdate" "todate" and "called_number" when i submit the form 3 different-2 mysql queries executes.
so i need pagination in this case.
please help me.
good
Hi! Can i see a preview?
Sorry, it's on the page :)I saw it just now.
Thanks for the code. It's very nice
Could you please update the emails database ? I want to download scripts
Thanks For The Code Man i have a Question i use your code with my Rewrtie Url its Not Working Can you tell me how can it Works ? Thanks in advance :)
THANKS FOR THIS CODE
Exactly what I'm looking for...
Thanks a lot my friend
Thank you so much.
You made my day. :)
Can you please try to minimize new subscriber updation time? I can wait more for this script really loving this script by live link.
Hello,
It is NOT working with touch devices (Like smart phones). Do you have any idea to activate Touch ?
Please let us know
Naseem
Thank you so much. This kind of code is hard to find.
Stay well.
joseph bupe
Got an idea.. use click + tap, so it will work with touch mobiles.
See this
$('#container .pagination li.active').live('click tap',function()
I think it`s better to calculate the total pages first and then validate the requested page number to be >= 1 and <= totalPages and change it to 1 or totalPages if it is not valid
hi i got following error
MySql ErrorYou have an error in your SQL syntax; check the manual that corresponds to your MySQL server version for the right syntax to use near '-2, 2' at line 1
pagination is not working on mobile device
can you please give solution here
your live demo and download buttons are epic now
How do i make thise code working for MSSQL ? through ODBC ?
how to limit records in sql server 2008
excellent thank you man
Error with Jquery 1.9.0 .How to fix ?Ravi
Nice !
This is a great post, and helping me in understanding and resolving one of my wishlist for a long time. However, I have a small glitch in downloading the content. It is kind of going in a loop. Not sure what is going on ... even after registering and confirming over 48 hours. Please let us know the current download for this post works. Thanks you.