Tutorial llmu llmu komputer dan download program gratis

Menampilkan Gambar dari Database dengan Paging via PHP

Sebelumnya saya sudah berbagi tentang menampilkan gambar dari database dengan php, tetapi jika kita lihat hasilnya kurang efektif, kenapa? karena bila gambar yang diambil dari database bayak misalnya 100, maka tidak mungkin kita menampilkan semuanya dalam satu halaman. Untuk itu kali ini saya berbagi tentang menambahkan paging (halaman). Seperti anda lihat di pencarian google, di bawahnya ada navigasi Halaman 1, 2, 3 da seterusnya. Oke langsung saja.

Database

CREATE DATABASE `dbtutor` ;

Table
CREATE TABLE `dbtutor`.`gambar` (
`id_gambar` INT NOT NULL AUTO_INCREMENT PRIMARY KEY ,
`nama` VARCHAR( 50 ) NOT NULL ,
`lokasi` VARCHAR( 50 ) NOT NULL ,
`diskripsi` TEXT NOT NULL ,
`link` VARCHAR( 50 ) NOT NULL
)

Mengisi Tabel Gambar
INSERT INTO `dbtutor`.`gambar` (
`id_gambar` ,
`nama` ,
`lokasi` ,
`diskripsi` ,
`link`
)
VALUES (NULL , '', 'images/elephant.jpg', '', ''), 
(NULL , '', 'images/cat.jpg', '', ''),
(NULL , '', 'images/bee.jpg', '', ''),
(NULL , '', 'images/ant.jpg', '', ''),
(NULL , '', 'images/dog.jpg', '', ''),
(NULL , '', 'images/bird.jpg', '', ''),
(NULL , '', 'images/lion.jpg', '', ''),
(NULL , '', 'images/tiger.jpg', '', ''),
(NULL , '', 'images/fish.jpg', '', ''),
(NULL , '', 'images/hourse.jpg', '', ''),
(NULL , '', 'images/mouse.jpg', '', ''),
(NULL , '', 'images/monkey.jpg', '', ''),
(NULL , '', 'images/pig.jpg', '', ''),
(NULL , '', 'images/buffalo.jpg', '', ''),
(NULL , '', 'images/giraffe.jpg', '', ''),
(NULL , '', 'images/camel.jpg', '', ''),
(NULL , '', 'images/butterfly.jpg', '', ''),
(NULL , '', 'images/snake.jpg', '', '');


Kode PHP untuk menampilkan gambar dengan paging
<html>
<head>
<title>Gambar Thumbnail</title>
<style type="text/css">
 .gambar{
  border:1px solid #999;
  margin:3px;
  padding:5px;
 }
 .gambar:hover{
  background-color:#36F;
 }
 .gambar img{
  
 }
 .hal{
  border:1px solid #999;
  background-color:#CCC;
  width:20px;
  float:left;
  padding:1px;
  margin:1px;
  text-align:center;
  display:block;
 }
 .hal:hover{
  border-color:#333;
 }
  
</style>
</head>

<body>
<?php
mysql_connect("localhost","root","");
mysql_select_db("dbtutor");


$batas=6;
if ($_GET['hal']<=1){
 $posisi=0;
}else{
 $posisi=($_GET['hal']-1)*$batas; 
}

$jum_per_bar=3;


$sql_rec=mysql_query("select * from gambar");
$jum_rec=mysql_num_rows($sql_rec);

$sql_paging=mysql_query("select * from gambar limit $posisi,$batas");
$no=$posisi+1;
while ($row=mysql_fetch_array($sql_paging)){
 echo "<a href=$row[link] title='$row[nama]'><img class='gambar' src='$row[lokasi]' width=150px height=150px /></a>";
 if ($no % $jum_per_bar==0 || $no==$jum_rec){
  echo "</br>"; 
 }
 $no++;
}


$jum_hal=ceil($jum_rec/$batas);

for ($i=1;$i<=$jum_hal;$i++){
 if ($i==$_GET['hal']){
  echo "<div class='hal'><b>$i</b></div>";
 }else{
  echo "<a href='gambar_paging.php?&hal=$i' class='hal'>$i</a>";
 }
}
?>
</body>
</html>

Share on Facebook
Share on Twitter
Share on Google+
Tags :

Related : Menampilkan Gambar dari Database dengan Paging via PHP

0 komentar:

Post a Comment

Silahkan kirimkan komentar atau merequest tutorial...