Présentation d'une sélection

Pour présenter les résultats d'une sélection multiple on utilise généralement une table HTML comme dans l'exemple ci-dessous. La table est bien sûr mise en forme et "stylée" avec CSS.

Exemple : liste alphabétique des auteurs

<?php
ob_start();
require('bib_params.php');
require('bib_fonctions.php');

htmlDebut('Liste des auteurs');

echo '<style>
		.tab-bd {
			border-collapse: collapse;
			border-spacing: 0;
			margin: 0 auto;
			min-width: 340px;
			}
		.tab-bd tr:nth-child(odd) {
			background: #eee;
			}
		.tab-bd tr:first-child {
			background: #ccc;
			font-weight: bold;
			}
		.tab-bd td {
			border: 1px solid #ddd;
			padding: 2px;
			}</style>';

$bd = bdConnecter();

//-- Requête ----------------------------------------
$sql = 'SELECT auNom, auPrenom, auPays
		FROM auteurs
		ORDER BY auNom, auPrenom';
		
$r = mysqli_query($bd, $sql) or bdErreur($bd, $sql);

//-- Traitement -------------------------------------
echo '<table class="tab-bd">',
	'<tr><td>Nom</td><td>Prénom</td><td>Pays</td></tr>';

while ($enr = mysqli_fetch_assoc($r)) {
	htmlProteger($enr);
	echo '<tr>',
		'<td>', $enr['auNom'], '</td>', 
		'<td>', $enr['auPrenom'], '</td>', 
		'<td>', $enr['auPays'], '</td>',
		'</tr>';
}

echo '</table>';

// Libération de la mémoire associée au résultat de la requête
mysqli_free_result($r);
//-- Déconnexion ------------------------------------
mysqli_close($bd);

htmlFin();
?>

Pour ne pas avoir un script comme le précédent avec du code CSS "brutalement" intégré au milieu de PHP, nous pouvons modifier dans bib_fonctions.php la fonction htmlDebut pour qu'elle accepte comme second paramètre éventuel le nom d'un fichier contenant une feuille de styles CSS :

/**
 * Envoie à la sortie standard le début du code HTML d'une page
 *
 * @param string	$titre	Titre de la page
 * @param string	$css	Fichier CSS éventuel
 */
function htmlDebut($titre, $css = '') {
	$titre = htmlentities($titre, ENT_COMPAT, 'ISO-8859-1');
	
	if ($css != '') {
		$css = "<link rel='stylesheet' href='$css'>";
	}

	echo '<!DOCTYPE html>',
		'<html lang="fr">',
			'<head>',
				'<meta charset="ISO-8859-1">',
				'<title>', $titre, '</title>',
				$css,
				'<style>',
				'body {	font-size: 13px;', 
						'font-family: Verdana, sans-serif}',
				'h3 {	font-size: 15px;',
						'margin: 0 0 15px 0;', 
						'padding: 5px 0;', 
						'text-align: center;', 
						'background: #FFF5AB}',
				'h4 {	font-size: 13px;',
						'margin: 1em 0 0 0;',
						'padding: 3px;',
						'background: #ebebeb}',
				'label {display: block;',
						'font-weight:', 
						'bold;margin-top: 10px;}',						
				'</style>',
			'</head>',
			'<body>',
				'<h3>', $titre, '</h3>';
}

Le code du fichier bd.css :

.tab-bd {
	border-collapse: collapse;
	border-spacing: 0;
	margin: 0 auto;
	min-width: 340px;
	}
.tab-bd tr:nth-child(odd) {
	background: #eee;
	}
.tab-bd tr:first-child {
	background: #ccc;
	font-weight: bold;
	}
.tab-bd td {
	border: 1px solid #ddd;
	padding: 2px;
	vertical-align: top;	
	}

Et le résultat :

Exemple : liste alphabétique des auteurs

De la même que vous avons déplacer le code CSS du script, nous pouvons déplacer le code HTML qui s'occupe de la table dans 2 nouvelles fonctions de notre bibliothèque bib_fonctions.php.

La fonction htmlLigne va générer le code HTML d'affichage d'une ligne d'une table. A noter que nous utilisons une boucle foreach pour prendre en compte aussi des tableaux avec un indice numérique que des tableaux associatifs.

/**
 * Envoie à la sortie standard une ligne d'une table HTML
 *
 * @param array		$elts	Elements à afficher dans les colonnes
 */
function htmlLigne($elts) {
	echo '<tr>';

	foreach ($elts as $elt) {
		echo '<td>', $elt, '</td>';
	}

	echo '</tr>';
}

La fonction htmlTable va générer le code HTML d'affichage de l'en-tete d'une table.

/**
 * Envoie à la sortie standard l'en-tête d'une table HTML
 *
 * @param array		$titres	Titres de colonnes de la table
 * @param string	$css	Classe CSS éventuelle de la table
 */
function htmlTable($titres, $css = '') {
	echo '<table', ($css == '') ? '>' : " class='$css'>";
	
	htmlLigne($titres);
}

Et le résultat :