PHP MySQL Table Data Pagination using TableSort Plugin

We have Seen Sorting HTML Table element using tablesort plugin in the previous tutorial , here in this tutorial by using the same plugin we will see one more useful feature of it that is pagination of the table element , this feature is useful when you have large amount of data to be displayed into HTML Table element .

Download            Live Demo


Create a database countries with table country .

       idCountry           int(5)    AUTO_INCREMENT,
       countryCode      char(2) ,
       countryName     varchar(45) ,
       currencyCode    char(3) ,
       capital                varchar(30) ,
  PRIMARY KEY ('idCountry')

Insert data into table you can find the .sql file inside the download and all the table data is available .

Installing TableSorter Plugin

include css file and all required js file like jquery , tablesort and tablesort pager inside the head tag of the html page .

      <link rel="stylesheet" href="css/style.css" type="text/css"  />
type="text/javascript" src="js/jquery-latest.js"></script>
type="text/javascript" src="js/jquery.tablesorter.js"></script>
type="text/javascript" src="js/jquery.tablesorter.pager.js"></script>

CSS Theming

There are two style sheets which you can find in download one for blue theme  and another for green theme.

    For Blue Theme
         <link rel="stylesheet" type="text/css" href="blue/style.css">

    For Green Theme
        <link rel="stylesheet" type="text/css" href="green/style.css">


add the below javaScript inside the head tag of your html page

<script type="text/javascript">
    $(function() {
            .tablesorter({widthFixed: true, widgets: ['zebra']})
            .tablesorterPager({container: $("#pager")});

PHP Script

connect to mysql database with php script

file : config.php

$mysql_hostname = "localhost";
$mysql_user = "root";
$mysql_password = "";
$mysql_database = "countries";

$bd = mysql_connect($mysql_hostname, $mysql_user, $mysql_password) or die("Opps some thing went wrong");
mysql_select_db($mysql_database, $bd) or die("Opps some thing went wrong");


now using php script fetch data from mysql database table and show it on to html table element using the below php script.

file : index.php
<table cellspacing="1" class="tablesorter">



$result = mysql_query("SELECT * FROM country");

while ($row = mysql_fetch_array($result)) {