Wednesday, September 29

PHP : Dynamic Pagination [paginasi]

Paging ini diperlukan jika data yang ditampilkan sangat panjang akan dibagi menjadi beberapa halaman. Misalnya record data berjumlah 10000 maka jika ditampilkan sekali akan terlihat sangat panjang dan kurang menarik, maka dari itu paging diperlukan di sini, agar tampilan data dapat dibatasi.

langkah-langkahnya adalah sebagai berikut:
1. buat code php seperti di bawah ini

<?php

$paginationObj = new pagination(total_limit);
$limit = $paginationObj->paginationGetLimit();

mysql query(variable $limit goes here)

$paginationObj->paginationCreatePages();

?>



2. Buat Class Pagination

class pagination
{

private $max_rows = 30;//MAXIMUM NUMBER OF DISPLAYING ITEMS
private $max_num = 5;//MAXIMUM NUMBER OF NUMERIC LINKS
private $limit;
private $maxId;//TOTAL NUMBER OF ITEMS
private $lastpage;
private $page;
private $url;
private $match = "page=";


public function __construct($maxId = null)
{
if(!$maxId)
{
$this->maxId = 500;
}
else
{
$this->maxId = $maxId;
}
}


public function getPage()
{
return $this->page;
}


public function paginationGetLimit()
{
$this->page = isset($_GET['page']) ? strip_tags($_GET['page']) : 1;
$this->lastpage = ceil($this->maxId / $this->max_rows);
$this->page = (int)$this->page;

if($this->page < 1)
{
$this->page = 1;
}
elseif($this->page > $this->lastpage)
{
$this->page = $this->lastpage;
}

return ($this->limit = 'LIMIT ' .($this->page - 1) * $this->max_rows .',' .$this->max_rows);
}


public function paginationCreatePages()
{

$this->url = $_SERVER['REQUEST_URI'];//THE REQUESTED URL
$pos = strpos($this->url, $this->match);
.
echo "";
}


}


3. Buat CSS filenya


.pagination
{
width:100%;
margin-top:20px;
margin-left:10px;
clear:left
}

.pagination ul
{
list-style-type: none;
margin:0;
padding:0;
}

.pagination ul li
{
color:#666666;
float:left;
font: Eras Bold ITC;
font-size: 12px;
letter-spacing: .01em;
}

.pagination ul li a
{
color: #47809E;
display: block;
margin: 0 0.1em;
padding: 2px;
padding-left: 4px;
padding-right: 4px;
text-decoration: none;
}

li#f
{
background-color:#fff;
display: block;
margin: 0 0.1em;
padding: 2px;
padding-left: 4px;
padding-right: 4px;
text-decoration: none;
color:#666666;
}

.pagination ul li a:hover
{
text-decoration:underline;
}

No comments:

Post a Comment

Pencarian Google