logo    MySQL - Paginering (sideopdeling).




Paginering er opdeling af en ofte meget lang liste i et antal sider, der hver indeholder et hensigtsmæssigt antal linier etc.


Iagtagelse fortæller, at paginering kan opbygges på mange måder./


Den metode til paginering, der beskrives nedenfor, placerer 2 interfaces på den aktuelle side:


  1. Vælg linier pr side
    En form med drop-down til valg af, hvor mange linier der skal vises på hver delliste.
     pagination
    Formen (kode vist nedenfor) placeres lige før udskrivning af listen påbegyndes.

    Intervallerne kan sættes efter behov. 'Alle' bør sættes så højt (9..9), at det er urealistisk nogensinde at nå tallet.

  2. Paginering menu
    Menu til navigation i listen ser sådan ud. Udover den aktuelle side, der vises i midten, vises også indtil 2 foregående og efterfølgende sider til selektion. Desuden kan en specifik side tilgås.
     pagination
    Hele menuen er samlet i en enkelt variabel. Denne kan placeres lige over eller lige under visningen af de paginerede data, eller begge steder. Det gøres med:


    <?php
    // Indsætning af paginering menuen
    echo "<div class='tar'>";
       echo $pag_menu;
    echo "</div>"; ?>


De to dele er som udgangspunkt så integrerede, at de begge skal anvendes samtidig.


$_GET / $_SESSION

Når den oprindelige side styres med $_GET og tilførte URL-parametre, skal der foretages følgende omlægning af $_GET-koden:

if ( isset ($_GET['x_id'])) // indkommende URL-arameter
{
$_SESSION['x_id'] = $_GET['x_id']; // Gemmes som $_SESSION og bruges derfra
header ("Location: aktuelt.php"); // genstart af aktuelt program
exit;
}
else // else for $_GET
{
$x_id = $_SESSION['x_id']; // Oprindeligt URL-parameter hentes her


$query = "SELECT * FROM kategori where x_id = $x_id"; // Oprindelig SELECT

Derved opnås:
- at programmet frigøres fra den udefrakommende paramenter - at programmet kan køres 'lokalt' så længe der er behov derfor - at pagineringen kan bruge sine egne URL-parametre.


CSS

Paginering menuen anvender et antal CSS-selektorer som vist nederst på siden.




Linier pr side

Formen til valg af antal linier i hvert udtræk placeres i den oprindelige kode lige efter udtrækket med SELECT;


Defaultværdien er sat til 10 i 'paginering.php'.


if ($antal > 0)
{
?>
<!-- HER STARTER Vælg linier pr side -->
    <form method="post">
    <select name="linPerSide" class='pagfnt' >
    <option value="1">Vælg</option>
    <option value="5">5</option>
    <option value="10">10</option>
    <option value="15">15</option>
    <option value="999">Alle</option>
    </select>
    <span class='pagknap'><input type="submit" name="linside" value ="linier pr side" </span> >
    </form>
<!-- HER SLUTTER Vælg linier pr side -->

<?php
echo '<table>';




Paginering

Koden til paginering fylder omkring 80 linier. Den skal anvendes som en samlet blok og overflødiggør ikke noget i den oprindelige kode. Det skønnes derfor mest overskueligt at indsætte den som en include lige efter udtrækket med SELECT.

$result = mysqli_query($db_link, $query) or die(mysqli_error($db_link));
$antal = mysqli_num_rows ($result);

//HER INDSÆTTES BLOKKEN MED PAGING-KODE
include ("/includes/paginering.php");

if ($antal > 0)


Kodeblokken har berøring med sin omverden 4 steder:


  • Variablen $antal som produceret med den oprindelige SELECT bruges af 'ceil()'. (Den oprindelige SELECT anvendes ikke til andet).

  • I $pag_query selecten er en kopi af den oprindelige 'select' med '$limit' tilføjet til sidst. Husk at ændre den oprindelige $query-ident til $pag_query.

  • Nogle få kodelinier fra den oprindelige start på opbygning af uddata, skal typisk flyttes ind mellem ' HER SLUTTER PAGINERING' og 'HER STARTER Vælg linier pr side'. (Al kode fra den oprindelige opbygning skal bruges enten før blokken, sat ind i den eller efter den).

  • Uddata skal nu hentes fra pagineringens SELECT. While-løkken ændres derfor til:.
    while ($row = mysqli_fetch_assoc ($pag_result))




/includes/pagineringxx.php.
Der skal være en separat fil for hver side, der skal laves paginering på.
// HER STARTER PAGINERING -----------------------------------------------------
$linPerSide = "";
$linPerSide2 = 2;
$sidsteSide = "";

$server = $_SERVER['PHP_SELF'];

if (isset($_GET['sidenr'])) // Modtager data fra paginering menuen
{
$sidenr = $_GET['sidenr'];
}
else
{
$sidenr = 1;
} // GET

if (isset($_GET['linPerSide'])) // Modtager data fra 'vælg antal linier'
{
$linPerSide2 = $_GET['linPerSide'];
if($linPerSide2 != "")
{
$linPerSide = $linPerSide2;
}// GET linPer
}

if (isset($_POST['linside'])) // Modtager data fra paginering menuen
{
$linPerSide = $_POST['linPerSide'];
}

// beregning af sideantal start
if($linPerSide == "")
{
$linPerSide = 4;
}

$sidsteSide = ceil($antal / $linPerSide); //rund op

if ($sidenr < 1)
{
$sidenr = 1;
}
elseif ($sidenr > $sidsteSide)
{
$sidenr = $sidsteSide;
}
// beregning af sideantal slut

// Opbygning af 'knapper' start
$knapper = "";
$ven1 = $sidenr - 1;
$ven2 = $sidenr - 2;
$hoj1 = $sidenr + 1;
$hoj2 = $sidenr + 2;

if($sidenr == 1)
{
$knapper .= ' <span class="sideNumAktiv">' . $sidenr . '</span> ';
$knapper .= ' <a href="' . $server . '?sidenr=' . $hoj1 . '&linPerSide=' . $linPerSide . '">' . $hoj1 . '</a> ';
}
elseif ($sidenr == $sidsteSide) {
$knapper .= ' <a href="' . $server . '?sidenr=' . $ven1 . '&linPerSide=' . $linPerSide . '">' . $ven1 . '</a> ';
$knapper .= ' <span class="sideNumAktiv">' . $sidenr . '</span> ';
}
elseif ($sidenr > 2 && $sidenr < ($sidsteSide - 1)) {
$knapper .= ' <a href="' . $server . '?sidenr=' . $ven2 . '&linPerSide=' . $linPerSide . '">' . $ven2 . '</a> ';
$knapper .= ' <a href="' . $server . '?sidenr=' . $ven1 . '&linPerSide=' . $linPerSide . '">' . $ven1 . '</a> ';
$knapper .= ' <span class="sideNumAktiv">' . $sidenr . '</span> ';
$knapper .= ' <a href="' . $server . '?sidenr=' . $hoj1 . '&linPerSide=' . $linPerSide . '">' . $hoj1 . '</a> ';
$knapper .= ' <a href="' . $server . '?sidenr=' . $hoj2 . '&linPerSide=' . $linPerSide . '">' . $hoj2 . '</a> ';
}
else if ($sidenr > 1 && $sidenr < $sidsteSide) {
$knapper .= ' <a href="' . $server . '?sidenr=' . $ven1 . '&linPerSide=' . $linPerSide . '">' . $ven1 . '</a> ';
$knapper .= ' <span class="sideNumAktiv">' . $sidenr . '</span> ';
$knapper .= ' <a href="' . $server . '?sidenr=' . $hoj1 . '&linPerSide=' . $linPerSide . '">' . $hoj1 . '</a> ';
}
// Opbygning af 'knapper' slut

// Udtræk af sidedata - start

$limit = 'LIMIT ' .($sidenr - 1) * $linPerSide .',' .$linPerSide;
//echo $linPerSide;
// den oprindelige select med ' $limit' tilføjet.

    $pag_query = "SELECT * FROM varestam
    inner join producent on fk_prod_id = prod_id
    where fk_kat_id = $kat_id
    order by vare_navn asc $limit
    ";

$pag_result = mysqli_query($db_link, $pag_query) or die(mysqli_error($db_link));

$pag_antal = mysqli_num_rows ($pag_result);

// Udtræk af sidedata - slut
// Opbyg variablen pag_menu start.
$pag_menu = "";

if ($sidsteSide != "1")
{
    $pag_menu .= '<span class="pagfnt">Aktuel side <span class="b">' . $sidenr . '</span> af ' . $sidsteSide. '</span>     ';
       if ($sidenr != 1)
       {
       $forr = $sidenr - 1;
       $pag_menu .= ' <a class="fornaes pagfnt" href="' . $server . '?sidenr=' . $forr . '&linPerSide=' . $linPerSide . '"> Forrige</a> ';
       }
    $pag_menu .= '<span class="sideNum pagfnt">' . $knapper . '</span>';
       if ($sidenr != $sidsteSide) {
       $nesteSide = $sidenr + 1;
       $pag_menu .= ' <a class="fornaes pagfnt" href="' . $server . '?sidenr=' . $nesteSide . '&linPerSide=' . $linPerSide .'"> Næste</a> ';
       }
    $goside ="";
    $sidenr = "";
    $goside .= "<form class='pagfnt' name='sidenr' action='$server' method='get'>";
    $goside .= "<span class='pagknap'><input type='submit' value='Gå til side'></span> ";
    $goside .= "<span class='pagtext'><input id='pagbred' type='text' name='sidenr' value='$sidenr'></span>";
    $goside .= "<input type='hidden' name='linPerSide' value='$linPerSide'>";
    $goside .= "</form>";
    $pag_menu .= $goside;
}
// Opbyg variablen pag_menu slut.

// HER SLUTTER PAGINERING -----------------------------------------------------




CSS

Til især design af knapperne i paginering menuen kan tages udgangspunkt i denne css-kode:


<style type="text/css">
<!--
/*aktiv side */
.sideNumAktiv {
   color: #000;
   border:#060 1px solid; background-color: #ff9e41; padding-left:3px; padding-right:3px;
}
.sideNum a:link {
   color: #000;
   text-decoration: none;
   border:#999 1px solid; background-color:#F0F0F0; padding-left:3px; padding-right:3px;
}
.sideNum a:visited {
   color: #000;
   text-decoration: none;
   border:#999 1px solid; background-color:#F0F0F0; padding-left:3px; padding-right:3px;
}
/*mouse over knapper*/
.sideNum a:hover {
   color: #000;
   text-decoration: none;
   border:#060 1px solid; background-color: #ff9e41; padding-left:3px; padding-right:3px;
}
.sideNum a:active {
   color: #000;
   text-decoration: none;
   border:#999 1px solid; background-color:#F0F0F0; padding-left:3px; padding-right:3px;
}
/*til Gå til side feltet */
#pagbred {
   Width: 40px;
}
.b{
   font-weight: bold;
}
.pagfnt{
font-size: 10px;
}
.pagknap input[type=submit]{
   font-size: 10px;
}
.pagtext input[type=text]{
   font-size: 10px;
}
.fornaes{
   text-decoration: none;
   color: #ff9e41
}
.fornaes:link{
   color:inherit;
}
-->
</style>

Bør indsættes i 'pagineringxx.php' eller i selvstændig css-fil. Kan tilpasses efter behov.





















x
x