Membuat Pagination dengan PHP dan Mysql - Mari Belajar Coding

15 November 2019

Membuat Pagination dengan PHP dan Mysql

maribelajarcoding         
Membuat Pagination dengan PHP dan Mysql

Selamat datang kembali di blog Mari belajar coding. Jika tutorial sebelumnya kita pernah membuat pagination dengan PHP dan Plugin Datatables, kali ini kita akan membuat sebuah pagination dengan coding secara manual. Sebenarnya menggunakan plugin Datatables untuk menampilkan data dalam sebuah tabel lebih efisien, karena kita hanya memanggil fungsi datatables. Pagination, shorting, export data dan sebagainya telah di buat otomatis. Pagination merupakan sebuah cara untuk menampilkan data dalam beberapa halaman. 


Membuat Pagination dengan PHP dan Mysql
Membuat Pagination dengan PHP dan Mysql

Pertama-tama kita buat databasenya untuk menampung data. Buat database akademik dengan tabel siswa.

CREATE DATABASE akademik;
USE akademik;

CREATE TABLE `siswa` (
`SiswaID` int(11) NOT NULL PRIMARY KEY AUTO_INCREMENT,
`Nama` varchar(100),
`Alamat` text,
`JenisKelamin` varchar(50)
);

Insert data kedalam tabel siswa.

INSERT INTO `siswa` VALUES ('1', 'Ardin', 'Semarang', 'Laki-laki');
INSERT INTO `siswa` VALUES ('2', 'Vita', 'Kudus', 'Perempuan');
INSERT INTO `siswa` VALUES ('3', 'Wisnu', 'Tegal', 'Laki-laki');
INSERT INTO `siswa` VALUES ('4', 'Angga', 'Rembang', 'Laki-laki');
INSERT INTO `siswa` VALUES ('5', 'Dian', 'Wonosobo', 'Laki-laki');
INSERT INTO `siswa` VALUES ('6', 'Ali', 'Brebes', 'Laki-laki');
INSERT INTO `siswa` VALUES ('7', 'Nia', 'Pati', 'Perempuan');
INSERT INTO `siswa` VALUES ('8', 'Yudis', 'Salatiga', 'Laki-laki');
INSERT INTO `siswa` VALUES ('9', 'Iman', 'Surakarta', 'Laki-laki');
INSERT INTO `siswa` VALUES ('10', 'Yogi', 'Sleman', 'Laki-laki');
INSERT INTO `siswa` VALUES ('11', 'Rifki', 'Magelang', 'Laki-laki');
INSERT INTO `siswa` VALUES ('12', 'Anisa', 'Wonosobo', 'Perempuan');
INSERT INTO `siswa` VALUES ('13', 'Rani', 'Rembang', 'Perempuan');
INSERT INTO `siswa` VALUES ('14', 'Rahmat', 'Semarang', 'Laki-laki');
INSERT INTO `siswa` VALUES ('15', 'Ayu', 'Kudus', 'Perempuan');
INSERT INTO `siswa` VALUES ('16', 'Nabila', 'Sleman', 'Perempuan');
INSERT INTO `siswa` VALUES ('17', 'Heri', 'Pati', 'Laki-laki');
INSERT INTO `siswa` VALUES ('18', 'Nugroho', 'Magelang', 'Laki-laki');
INSERT INTO `siswa` VALUES ('19', 'Farida', 'Salatiga', 'Perempuan');
INSERT INTO `siswa` VALUES ('20', 'Andri', 'Tegal', 'Laki-laki');
INSERT INTO `siswa` VALUES ('21', 'Andi', 'Surakarta', 'Laki-laki');
INSERT INTO `siswa` VALUES ('22', 'Handayani', 'Brebes', 'Perempuan');
INSERT INTO `siswa` VALUES ('23', 'Rendy', 'Semarang', 'Laki-laki');

Buat koneksi.php untuk menghubungkan aplikasi dengan database akademik.

<?php
 $host = "localhost"; 
 $username = "root"; 
 $password = ""; 
 $database = "akademik"; 
 $con = mysqli_connect($host, $username, $password, $database); 
?>

Buat tabel html untuk menampilkan data dari database. Data yang akan ditampilkan hanya lima data, untuk mengubah berapa data yang akan di tampilkan kedalam tabel, ganti value pada parameter data. Lihat baris yang diberi highlight. Query pada tabel siswa akan menggunakan limit untuk membatasi jumlah data yang akan ditampilkan. Contoh limit 0,5 akan menampilkan data mulai dari row pertama (0) pada tabel sebanyak lima data. Sedangkan limit 2, 5 akan menampilkan data mulai dari data ke tiga(2) dari tabel siswa sebanyak 5 data.

<table class="table table-striped table-bordered table-hover">
  <thead>
    <tr>
      <th>No.</th>
      <th>Nama</th>
      <th>Alamat</th>
      <th>Jenis Kelamin</th>
    </tr>
  </thead>  
  <tbody>
    <?php
    include "koneksi.php";
    
    $page = (isset($_GET['page']))? (int) $_GET['page'] : 1;
    
    // Jumlah data per halaman
    $limit = 5;

    $limitStart = ($page - 1) * $limit;
              
    $SqlQuery = mysqli_query($con, "SELECT * FROM Siswa LIMIT ".$limitStart.",".$limit);
    
    $no = $limitStart + 1;
    
    while($row = mysqli_fetch_array($SqlQuery)){ 
    ?>
      <tr>
        <td><?php echo $no++; ?></td>
        <td><?php echo $row['Nama']; ?></td>
        <td><?php echo $row['Alamat']; ?></td>
        <td><?php echo $row['JenisKelamin']; ?></td>
      </tr>
    <?php           
    }
    ?>
  </tbody>      
</table>

Buat button pagination, disini kita menggunakan class bootstrap.

<div align="right">
  <ul class="pagination">
    <?php
    // Jika page = 1, maka LinkPrev disable
    if($page == 1){ 
    ?>        
      <!-- link Previous Page disable --> 
      <li class="disabled"><a href="#">Previous</a></li>
    <?php
    }
    else{ 
      $LinkPrev = ($page > 1)? $page - 1 : 1;
    ?>
      <!-- link Previous Page --> 
      <li><a href="index.php?page=<?php echo $LinkPrev; ?>">Previous</a></li>
    <?php
      }
    ?>

    <?php
    $SqlQuery = mysqli_query($con, "SELECT * FROM Siswa");        
    
    //Hitung semua jumlah data yang berada pada tabel Sisawa
    $JumlahData = mysqli_num_rows($SqlQuery);
    
    // Hitung jumlah halaman yang tersedia
    $jumlahPage = ceil($JumlahData / $limit); 
    
    // Jumlah link number 
    $jumlahNumber = 1; 

    // Untuk awal link number
    $startNumber = ($page > $jumlahNumber)? $page - $jumlahNumber : 1; 
    
    // Untuk akhir link number
    $endNumber = ($page < ($jumlahPage - $jumlahNumber))? $page + $jumlahNumber : $jumlahPage; 
    
    for($i = $startNumber; $i <= $endNumber; $i++){
      $linkActive = ($page == $i)? ' class="active"' : '';
    ?>
      <li<?php echo $linkActive; ?>><a href="index.php?page=<?php echo $i; ?>"><?php echo $i; ?></a></li>
    <?php
      }
    ?>
    
    <!-- link Next Page -->
    <?php       
    if($page == $jumlahPage){ 
    ?>
      <li class="disabled"><a href="#">Next</a></li>
    <?php
    }
    else{
      $linkNext = ($page < $jumlahPage)? $page + 1 : $jumlahPage;
    ?>
      <li><a href="index.php?page=<?php echo $linkNext; ?>">Next</a></li>
    <?php
    }
    ?>
  </ul>
</div>

Kode lengkap seperti dibawah ini, simpan dengan nama index.php

<!DOCTYPE html>
<html lang="en">
<head>
  <title>Maribelajarcoding.com - Pagination dengan PHP dan Mysql</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- css bootstrap -->
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
</head>
<body>

<nav class="navbar navbar-inverse">
  <div class="container-fluid">
    <div class="navbar-header">
      <a class="navbar-brand" href="#">maribelajarcoding.com</a>
    </div>
  </div>
</nav>
  
<div class="container">
  <div align="center">
    <h3><b>Pagination PHP dan Mysql</b></h3>
    <h4><b>maribelajarcoding.com</b></h4>
  </div>
  <table class="table table-striped table-bordered table-hover">
    <thead>
      <tr>
        <th>No.</th>
        <th>Nama</th>
        <th>Alamat</th>
        <th>Jenis Kelamin</th>
      </tr>
    </thead>  
    <tbody>
      <?php
      include "koneksi.php";
      
      $page = (isset($_GET['page']))? (int) $_GET['page'] : 1;
      
      // Jumlah data per halaman
      $limit = 5;

      $limitStart = ($page - 1) * $limit;
                
      $SqlQuery = mysqli_query($con, "SELECT * FROM Siswa LIMIT ".$limitStart.",".$limit);
      
      $no = $limitStart + 1;
      
      while($row = mysqli_fetch_array($SqlQuery)){ 
      ?>
        <tr>
          <td><?php echo $no++; ?></td>
          <td><?php echo $row['Nama']; ?></td>
          <td><?php echo $row['Alamat']; ?></td>
          <td><?php echo $row['JenisKelamin']; ?></td>
        </tr>
      <?php           
      }
      ?>
    </tbody>      
  </table>
  <div align="right">
    <ul class="pagination">
      <?php
      // Jika page = 1, maka LinkPrev disable
      if($page == 1){ 
      ?>        
        <!-- link Previous Page disable --> 
        <li class="disabled"><a href="#">Previous</a></li>
      <?php
      }
      else{ 
        $LinkPrev = ($page > 1)? $page - 1 : 1;
      ?>
        <!-- link Previous Page --> 
        <li><a href="index.php?page=<?php echo $LinkPrev; ?>">Previous</a></li>
      <?php
        }
      ?>

      <?php
      $SqlQuery = mysqli_query($con, "SELECT * FROM Siswa");        
      
      //Hitung semua jumlah data yang berada pada tabel Sisawa
      $JumlahData = mysqli_num_rows($SqlQuery);
      
      // Hitung jumlah halaman yang tersedia
      $jumlahPage = ceil($JumlahData / $limit); 
      
      // Jumlah link number 
      $jumlahNumber = 1; 

      // Untuk awal link number
      $startNumber = ($page > $jumlahNumber)? $page - $jumlahNumber : 1; 
      
      // Untuk akhir link number
      $endNumber = ($page < ($jumlahPage - $jumlahNumber))? $page + $jumlahNumber : $jumlahPage; 
      
      for($i = $startNumber; $i <= $endNumber; $i++){
        $linkActive = ($page == $i)? ' class="active"' : '';
      ?>
        <li<?php echo $linkActive; ?>><a href="index.php?page=<?php echo $i; ?>"><?php echo $i; ?></a></li>
      <?php
        }
      ?>
      
      <!-- link Next Page -->
      <?php       
      if($page == $jumlahPage){ 
      ?>
        <li class="disabled"><a href="#">Next</a></li>
      <?php
      }
      else{
        $linkNext = ($page < $jumlahPage)? $page + 1 : $jumlahPage;
      ?>
        <li><a href="index.php?page=<?php echo $linkNext; ?>">Next</a></li>
      <?php
      }
      ?>
    </ul>
  </div>
</div>

</body>
</html>

Tutorial membuat pagination dengan PHP mysql telah selesai. Sekian, semoga bermanfaat.

Related Posts

Load comments