:::: MENU ::::

convenience

  • Suitable for all screen sizes

  • Easy to Customize

  • Customizable fonts.

Friday, June 21, 2013

  • 9:30 AM
KUPAS TUNTAS TEKNIK PAGING

1.      Paging
Pagging juga dikenal dengan sebutan pagination (paginate), previous-next, tampilan perhalaman, page navigator, halaman 1..2..3, dst. Apapun namanya, intinya paging merupakan suatu teknik untuk membatasi data yang akan ditampilkan dalam suatu halaman web.
Biasanya paging digunakan untuk menampilkan data yang banyak dan hampir disetiap aplikasi web, si paging selalu ada. Oleh karena itu, maka pada bagian ini, kita akan mencoba mengupas teknik paging sampai tuntas.

1.1  Menampilkan data tanpa paging
Sebelum masuk ke pembahasan mengenai paging, ada baiknya kita mengetahui cara menampilkan data tanpa paging. Hal ini penting agar kita bisa menerapkan teknik paging pada skrip-skrip yang belum ada pagingnya. Sebelum lanjut lebih jauh tentang paging kita buat dulu folder untuk belajar dan buat database untuk paging. Nah sekarang buat folder belajar di Xampp htdocs. Lalu masuk ke phpmyadmin dan buat data base dengan nama paging, saya anggap temen-temen udah pada ngerti membuat database, databasenya bisa di download disini : http://www.4shared.com/document/tHxpKZBc/paging.html . Setelah di download import databasenya dari phpmyadmin, kalian bisa menambah sendiri datanya agar menjadi lebih banyak.
Sekarang kita akan buat skrip nonpaging.php, skripnya seperti ini:

<table border=1>
      <tr><th>No</th><th>Nama</th><th>Alamat</th></tr>

<?php
mysql_connect("localhost","root","");
mysql_select_db("paging");

$tampil="select * from anggota";
$hasil=mysql_query($tampil);

$no=1;
while ($data=mysql_fetch_array($hasil)){
  echo "<tr><td>$no</td><td>$data[nama]</td><td>$data[alamat]</td></tr>";
  $no++;
}
echo "</table>";
?>

nah sekarang sobat simpan skrip nonpaging.php di folder belajar yang sudah kita buat tadi, jalankan di browser dengan mengetikan localhost/belajar/nonpaging.php  maka akan muncul tabel beserta seluruh data yang ada di database. Dapat kita lihat pada gambar dibawah ini :




1.2  Skrip menggunakan paging
Oke sekarang kita lanjutkan dengan membuat skrip dengan paging. posisi data pertama dalam database dikenali/dimulai dari 0 dan contoh limit/batasnya adalah 5. Adapun sintak dari perintah limit adalah:
SELECT * FROM nama_tabel LIMIT posisi,batas;
Jadi misalnya kita ingin menampilkan hanya lima data pada halaman 1 (1 s/d 5) maka perintah SQL nya adalah :
SELECT * FROM nama_tabel LIMIT 0,5;
Kemudian apabila kita ingin menampilkan lima data berikutnya pada halaman 2 (6 s/d 10) maka perintah SQL nya adalah:
SELECT * FROM nama_tabel LIMIT 5,5;

Sekarang sudah mengerti kan logika dari paging ? Ayo kita implementasikan ….

1.3  Tiga langkah mudah menerapkan paging
Sebenarnya hanya diperlukan tiga langkah mudah untuk menerapkan paging pada suatu skrip yang belum ada pagingnya. Berikut jabaran dari langkah-langkahnya :
1.      Tentukan Limit atau batas, kemudian cek pada halaman dan posisi berapa pada saat skrip dijalankan.
2.      Sesuaikan perintah SQL dengan Limit (batas) dan posisi.
3.      Hitung total data dan halaman serta tampilkan link untuk navigasi halaman.
Untuk mempraktekannya, kita akan coba terapkan pada skrip nonpaging.php menjadi skrip berikut. 
  • Skrip paging_1.php
<table border=1>
      <tr><th>No</th><th>Nama</th><th>Alamat</th></tr>
<?php
mysql_connect("localhost","root","");
mysql_select_db("paging");

//Langkah 1: Tentukan batas,cek halaman & posisi data
$batas   = 5;
$halaman = $_GET['halaman'];
if(empty($halaman)){
$posisi=0;
$halaman=1;
}
else{
$posisi = ($halaman-1) * $batas;
}

//Langkah 2: Sesuaikan perintah SQL
$tampil="select * from anggota limit $posisi,$batas";
$hasil=mysql_query($tampil);

$no=1;
while ($data=mysql_fetch_array($hasil)){
  echo "<tr><td>$no</td><td>$data[nama]</td><td>$data[alamat]</td></tr>";
  $no++;
}
echo "</table>";

//Langkah 3: Hitung total data dan halaman serta link 1,2,3 ...
echo "<br>Halaman : ";
$file="paging_1.php";

$tampil2="select * from anggota";
$hasil2=mysql_query($tampil2);
$jmldata=mysql_num_rows($hasil2);
$jmlhalaman=ceil($jmldata/$batas);

for($i=1;$i<=$jmlhalaman;$i++)
if ($i != $halaman)
{
echo " <a href=$_SERVER[PHP_SELF]?halaman=$i>$i</A> | ";
}
else
{
echo " <b>$i</b> | ";
}
echo "<p>Total anggota : <b>$jmldata</b> orang</p>";
?>

jj
kKeterangan Skrip :  

  •       Saat skrip pertama kali dijalankan, maka akan memerikasa dulu apakah $halaman kosong? Kalau benar, maka $halaman=1 dan $posisi=0. Kalau $halaman tidak kosong, maka berlakulah rumus untuk menentukan nilai posisi, yaitu :$posisi = ($halaman-1) * $batas. Misalnya berada dihalaman 3, maka nilai $posisi = (3-1)*5 = 10.
  •            Pada langkah 3 ada perintah ceil($jmldata/$batas). Fungsinya ceil berguna untuk menghasilkan bilangan bulat, apabila hasilnya pecahan, maka akan dibulatkan keatas (tidak peduli pecahannya dibawah atau diatas koma). Misalnya $jmldata=36 dibagi $batas=5 hasilnya 7,2. Dengan fungsi ceil (36/5) hasilnya akan menjadi 8, maka aka nada 8 halaman.
   Sekarang coba jalankan skrip paging_1.php dan cobalah link untuk navigasi ke halaman 1,2,3 dan seterusnya. Lihat gambar dibawah ini :
n

   Oke begitulah cara menampilkan paging pada halaman website. Apakah kalian menemukan masalah dengan skrip paging_1.php ? Jawabannya iya… coba saja klik link halaman 2 dan perhatikan pada bagian No, maka akan terlihat nomor tetap dimulai dari nomor 1, bukan nomor 6, begitu juga dengan halaman lainnya, selalu dimulai dari nomor 1. Hal ini disebabkan karena variabel $no di skrip paging_1.php masih bersifat statis. Solusinya sangat mudah (tapi kalau gak tau.. susah juga), silahkan cari baris : $no=1; kemudian ubah menjadi $no=$posisi+1;  kemudian jalankan lagi skrrip paging_1.php , maka hasilnya akan berubah. Untuk menerapkan paging pada searching silahkan baca artikel selanjutnya disini  http://www.novzfypun.web.id/2013/06/menerapkan-paging-pada-searching.html

l


A call-to-action text Contact us