English version  | Version française
Couplage SQL/HTML avec PEAR DataGrid et DataObject

Structures_DataGrid et DB_DataObject sont deux composants PEAR, qui peuvent être connectés l'un à l'autre, pour facilement générer des tableaux HTML à partir de données SQL, avec des fonctionnalités de tri et de pagination.

Dans ce tutoriel, je vais essayer de vous montrer comment prendre ce raccourci évitant d'avoir à : interpréter les paramètres GET, exécuter des requêtes SQL et générer le contenu HTML.

Prérequis :

I. Introduction à la méthode bind()

Commençons par un exemple simple et efficace :

<?php
class DataObject_Fruits extends DB_DataObject 
{
    var 
$__table "fruits";
    var 
$id;
    var 
$name;
    var 
$stock;
    var 
$price;
}

$dataobject = new DataObject_Fruits();
$datagrid =& new Structures_DataGrid(10);
$datagrid->bind($dataobject); // la magie est ici
$datagrid->render();
?>

Le code ci-dessus transforme la table SQL suivante en un tableau de données formaté et triable, ou plus exactement une datagrid. L'exemple est interactif, vous pouvez essayer le tri en cliquant sur les en-têtes de colonnes. Un deuxième clic sur la même colonne trie les données dans le sens inverse.

Table SQL (Télécharger)

mysql> select * from fruits limit 5;
+----+----------+-------+-------+
| id | name     | stock | price |
+----+----------+-------+-------+
|  1 | Apples   |   260 |  1.40 |
|  2 | Apricots |   420 |  2.30 |
|  3 | Bananas  |   240 |  0.80 |
|  4 | Cherries |   420 |  3.50 |
|  5 | Coconut  |   340 |  0.80 |
+----+----------+-------+-------+
5 rows in set (0.00 sec) 
Sortie de Structures_DataGrid

Résumons... Ce tableau de données dynamique est affiché :

  1. sans avoir à écrire du code HTML : il est généré par Structures_DataGrid
  2. pas besoin d'interpréter les paramètres GET : ils sont automatiquement analysés par Structures_DataGrid
  3. inutile d'écrire des requêtes SQL : elles sont générées et prises en charge par DB_DataObject

J'ai un petit nom pour cette fonctionnalité : Just Type Bind. En fait, la méthode bind() peut gérer de nombreux types de sources de données : XML, DB_Result, etc... C'est l'autre aspect de sa "magie", mais dans ce tutoriel je me concentre sur les sources de données de type DB_DataObject.

II. Un premier exemple complet

Dans la section précédente j'ai omis quelques lignes, pour une question de clarté. Avant de créer des instances DataObject ou DataGrid, il nous faut en effet inclure quelque fichiers, et configurer l'accès à la base de données. Ce qui suit est l'exemple complet et commenté. Le code fait moins de 20 lignes...

<?php
/* Quelques fichiers indispensables */    
require_once "PEAR.php";
define("DB_DATAOBJECT_NO_OVERLOAD",true); /* Nécessaire pour certaines versions défectueuses de PHP4 */
require_once "DB/DataObject.php";
require_once 
"Structures/DataGrid.php";    

/* Configuration base de données et DataObject */
$options = &PEAR::getStaticProperty("DB_DataObject","options");
$options["database"] =  "mysql://username:password@host/database";
$options["proxy"] = "full";

class 
DataObject_Fruits extends DB_DataObject 
{
    var 
$__table "fruits";
    var 
$id;
    var 
$name;
    var 
$stock;
    var 
$price;
}

/* Instantiation */
$dataobject = new DataObject_Fruits();
$datagrid =& new Structures_DataGrid(10); /* 10 enregistrements par page */

/* Couplage */
$datagrid->bind($dataobject);

/* Rendu */
$datagrid->render();
?>

III. Champs et Labels

Essayons maintenant d'améliorer un peu notre sortie HTML. Le champ 'id' n'est pas intéressant pour l'utilisateur final, c'est une référence interne et il n'est pas nécessaire d'inclure une colonne pour celle-ci. De plus, les noms de champs ne sont pas très explicites, nous allons utiliser des labels plus appropriés. C'est la méthode generateColumns() qui va nous y aider :

<?php
$datagrid
->bind($dataobject);

/* Génération des colonnes (on omet "id") : */
$datagrid->generateColumns(array(
    
"name"  => "Nom de produit"
    
"stock" => "Quantité en stock"
    
"price" => "Prix (&euro;)"
));

$datagrid->render();
?>

Ca devrait s'être arrangé :

IV. Pagination

Structures_DataGrid permet aussi de se déplacer de page en page. Comme pour le tri, les paramètres GET sont gérés de manière transparente. Pour utiliser cette fonctionnalité, il suffit d'utiliser le pilote de rendu approprié : Pager

<?php
$datagrid
->bind($dataobject);

/* Affichage des liens de pagination */
echo "<p>Pages : ";
$datagrid->render("Pager");
echo 
"</p>";

/* Rendu du tableau */
$datagrid->render();
?>

Nous pouvons maintenant nous déplacer :

V. Mise en page

Pour améliorer la mise en page nous allons configurer l'objet de bas niveau (Container) utilisé par le pilote de rendu (Renderer). Comme nous utilisons le pilote HTML par défaut, cet objet est de la classe HTML_Table qui provient du paquet PEAR du même nom.

HTML_Table représente un tableau HTML et possède beaucoup de méthodes pour ajuster la mise en page (Documentation). Dans l'exemple ci-dessous, je les utilise uniquement pour attribuer des classes CSS, mais vous pourriez aussi utiliser des attributs typiques tels que cellspacing, cellpadding, align, etc...

Mais avant de configurer la mise en page nous allons remplir ce tableau HTML avec les données, en utilisant la méthode fill() à la place de render().

<?php

// Création de l'objet HTML_Table (le Container) :
require_once "HTML/Table.php";
$table = new HTML_Table();

/* On utilise fill() à la place de render() pour remplir le tableau
 * avec les données : */
$datagrid->fill($table);

/* Attribution d'une classe CSS à la balise <table> : */
$table->updateAttributes(array("class" => "fruits"));

/* Classe CSS pour les <tr> impairs */
$table->altRowAttributes(0, array(), array ("class" => "odd"));

/* Affichage des liens de pagination, nouvelle classe CSS : */
echo "<p class=\"paging\">Pages : ";
$datagrid->render("Pager");
echo 
"</p>";

/* Rendu du tableau à partir de l'objet HTML_Table : */
echo $table->toHTML();
?>

Ajoutons maintenant un peu de CSS :

Voilà le résultat :

Source complète

VI. Conclusion et liens

Le but de ce tutoriel est de vous initier aux rudiments du couplage Structures_DataGrid et DB_DataObject. C'est une simple introduction. J'éspère vous avoir montré comment cette solution peut radicalement diminuer le besoin de coder encore et encore le même type de routines.

Pour des projets plus importants ou plus spécifiques, je vous recommande quelques lectures :

VII. L'auteur

Mon nom est Olivier Guilyardi, je vis à Paris, et propose des services de développement logiciel sous l'enseigne commerciale Samalyse.

Contribuant depuis plusieurs années à Structures_DataGrid, je peux vous assister lors de l'intégration de ce composant à vos projets professionnels.

Icon
Faites-nous part de votre projet
Progress bar