Avec Bootstrap vous pouvez définir les trois différents types de listes à puces: Listes non ordonné, listes ordonnées et liste de définitions.
Ce tutoriel va vous montrer comment sélectionner des données dans une base de données MySQL, les répartir sur plusieurs pages, pour les afficher page par page à l'aide de numéros de page
Ce tutoriel va vous montrer comment SÉLECTIONNER des données dans une base de données MySQL, les répartir sur plusieurs pages, pour les afficher page par page à l'aide de numéros de page. Dans ce tutoriel nous allons utiliser une base de données, mais on peut utiliser toute source de données qu’on veut comme un fichier XML, JSON ou autres.
Avant de commencer, nous avons besoin d’une base de données. Et donc pour pouvoir suivre ce tutoriel vous devez disposer d’une base de données, si vous n’avez pas de base de données disponible créer en une.(Vous pouvez consulter notre cours sur comment créer une base de données)
La base de données doit contenir une table avec un nombre plus ou moin important d’enregistrements, si vous ne disposer pas de cette table de données créer en une.
Voir notre cours sur la création d’une table de données
Dans ce tutoriel Nous allons utiliser une table MySQL appelée "students" contenant 100 enregistrements avec les champs suivants :
ID : autoincrement ID
Nom : varchar(250)
PhoneNumber: varchar(250) PhoneNumber
Nous voulons récupérer et afficher les enregistrements de la table de cette base de données, mais il serait inutile d’avoir une page web longe de plusieurs mètres et qui en plus de sa longueur elle sera très lourde à afficher, et donc ce que nous voulons faire c’est de répartir ces données sur plusieurs pages que nous pouvons parcourir une à une en suivant des liens hypertexte c e qu’on appelle la pagination.
Au lieu de faire une seule requête SELECT et d'afficher les 100 enregistrements sur une seule page, nous pouvons avoir 5 pages contenant chacune 20 enregistrements maximum ou 10 pages avec 10 enregistrements pour chaque page
Pour ce faire, nous devons utiliser la clause LIMIT de la commande SELECT afin de limiter la requête à 20, 10 enregistrements seulement ou ce que nous voulons.
La clause LIMIT vous permet également de spécifier à partir de quel enregistrement vous souhaitez commencer. Par exemple, cette requête
$sql = "SELECT * FROM students ORDER BY Nom ASC LIMIT 0, 20";
Qui veut dire affiche 20 enregistrements triés par nom PAR ORDRE ASCENDENT (CROISSANT), à partir du premier enregistrement.
Et cette autre requête
$sql = "SELECT * FROM students ORDER BY Nom ASC LIMIT 40, 20";
Qui veut dire affiche 20 enregistrements triés par nom PAR ORDRE ASCENDENT (CROISSANT), mais cette fois-ci à partir du 41éme enregistrement.
Ainsi, dans cette clause (LIMIT start, count), "start" indique l'enregistrement de départ et "count" indique le nombre d'enregistrements à afficher.
En résumé pour la close LIMIT x,y :
On sélectionne y éléments à partir du (x+1) ème élément, mais à condition de faire un tri (ORDER ASC) .
Donc pour faire un affichage page par page (c'est-à-dire une pagination) , notre scripte php va refaire plusieurs fois la même requête SQL avec :
Une close LIMIT x,y sauf qu'à chaque fois, et donc à chaque page, le paramètre x va changer.
Comme nous avons une table qui contient 100 éléments, et nous voulons afficher 20 résultats sur chaque page, le y prendra la valeur 20 et le x prendra les valeurs (0, 20, 40, 60 et 80) et nous aurons 5 pages à afficher soit 100 diviser par 20.
En général le nombre de pages= nombre d’enregistrements dans la table : nombre d’éléments à afficher.
Pour créer notre script nous aurons besoin des varibles :
- $page : le numéro de la page à afficher qui peut prendre les voleurs de 1 jusque dans notre cas 5.
- $resultats_par_page : le nombre d’éléments à afficher.
- $debut = ($page-1) * $resultats_par_page; : indique l'enregistrement de départ
Mais avant tout nous allons d'abord définir les variables de connexion MySQL et nous connecter à la base de données.
Code : HTML
<?php error_reporting(0); $servername = "localhost"; $username = "votre nom d’utilisateur"; $password = "votre mot de passe"; $dbname = "nom de votre base de données"; $datatable = "students"; // Nom de la table MySQL // Créer une connexion $connexion = new mysqli($servername, $username, $password, $dbname); // Check connection if ($connexion->connect_error) { die("Connection failed: " . $connexion->connect_error); }?>
Maintenant créer un fichier PHP que moi je vais nommer index.php qui affichera les 20 premiers enregistrements de notre table. Le code ci-dessous sélectionne et imprime les données dans un tableau.
Code : HTML
< ?php if (isset($_GET["page"])) { $page = $_GET["page"]; } else { $page=1; }; $debut = ($page-1) * $resultats_par_page; $sql = "SELECT * FROM ".$datatable." ORDER BY ID ASC LIMIT $debut, ".$resultats_par_page; $rs_result = $connexion->query($sql); ?> <table border="1" cellpadding="4"> <tr> <th bgcolor="#CCCCCC"><strong>ID</strong></th> <th bgcolor="#CCCCCC"><strong>Nom</strong></th> <th bgcolor="#CCCCCC"><strong>Numéro de téléphone</strong></th></tr> <?php while($row = $rs_result->fetch_assoc()) { ?> <tr> <td><? echo $row["ID"]; ?></td> <td><? echo $row["Nom"]; ?></td> <td><? echo $row["PhoneNumber"]; ?></td> </tr> <?php }; ?> </table>
Maintenant, lorsque vous ouvrez le fichier index.php dans votre navigateur Web, vous verrez un tableau affichant les 20 premiers enregistrements de votre table "students".
Les 2 premières lignes du code ci-dessus
if (isset($_GET["page"])){
$page = $_GET["page"]; } else { $page=1; };
$debut = ($page-1) * $resultats_par_page;
sont utilisées pour créer une variable $debut en fonction de la page que nous voulons afficher. Vous verrez plus tard que nous passerons une valeur "page" dans l'URL de la page (par exemple index.php?page=2) pour aller sur différentes pages.
Ensuite, nous devons déterminer le nombre total d'enregistrements dans notre table et le nombre de pages dont nous aurons besoin.
Pour ce faire, nous exécutons une autre requête en utilisant la fonction de PHP COUNT().
Code : HTML
$sql = "SELECT COUNT(ID) AS total FROM ".$datatable; $resultats = $connexion->query($sql); $row = $resultats->fetch_assoc(); $total_pages = ceil($row["total"] / $resultats_par_page);
La variable $total_records est maintenant égal au nombre d'enregistrements que nous avons dans notre base de données, dans notre cas 100.
$total_records = $row["total"] ;
Nous avons 20 enregistrements par page, donc le nombre total de pages nécessaires est de 5 .
Le calcul du nombre de pages nécessaires en PHP peut être effectué à l'aide de la fonction ceil().
Nous utilisons la fonction ceil() pour arrondir un nombre avec vergule à l'entier supérieur le plus proche, si nécessaire.
Ce qui donne le code :
$total_pages = ceil($total_records/$resultats_par_page);
Nous divisons le nombre total d'enregistrements par les enregistrements par page, puis la fonction ceil() arrondit le résultat. Maintenant nous avons 2 nouvelles variables - $total_records égale à 100 et $total_pages égale à 5.
Pour imprimer les numéros de page et associer des URL à chaque numéro, nous utiliserons la boucle for().
Code : HTML
<?php for ($i=1; $i<=$total_pages; $i++) { echo "<a href='index.php?page=".$i."'>".$i."</a> "; }; ?>
Le code ci-dessus imprimera les numéros de 1 à 5 et pour chaque numéro, il créera un lien différent.
index.php?page=1
index.php?page=2
index.php?page=3
index.php?page=4
index.php?page=5
Comme vous pouvez le constater, chaque lien transmet une valeur de page différente qui sera récupérée via la variable super globales de PHP $_GET[ ] .
À la fin, si vous rassemblerez tous ces bouts de code qu’on vient de voir, vous devriez avoir un fichier comme celui-ci (n'oubliez pas d'ajouter la connexion MySQL) :
Code .
Code : HTML
<?php if (isset($_GET["page"])) { $page = $_GET["page"]; } else { $page=1; }; $debut = ($page-1) * $resultats_par_page; $sql = "SELECT * FROM ".$datatable." ORDER BY ID ASC LIMIT $debut, ".$resultats_par_page; $rs_result = $connexion->query($sql); ?> <table border="1" cellpadding="4"> <tr> <th bgcolor="#CCCCCC"><strong>ID</strong></th> <th bgcolor="#CCCCCC"><strong>Nom</strong></th> <th bgcolor="#CCCCCC"><strong>Numéro de téléphone</strong></th></tr> <?php while($row = $rs_result->fetch_assoc()) { ?> <tr> <td><? echo $row["ID"]; ?></td> <td><? echo $row["Nom"]; ?></td> <td><? echo $row["PhoneNumber"]; ?></td> </tr> <?php }; ?> </table> <?php $sql = "SELECT COUNT(ID) AS total FROM ".$datatable; $result = $connexion->query($sql); $row = $result->fetch_assoc(); /* calcule le nombre de pages */ $total_pages = ceil($row["total"] / $resultats_par_page); /* crée et affiche un lien pour chaque page */ for ($i=1; $i<=$total_pages; $i++) { echo "<span>".$<a href='index.php?page=".$i."'"; if ($i==$page) echo "> i."</a></span> "; }; ?>
Vous pouvez aussi ajouter ce code dans toutes pages de votre site.
Le code ci-dessus vous donne un désigne basique vous pouvez l’améliorer en ajoutant du css.