Séparation du code php du code html

**aymen8219** · 04/11/2011, 10h05

Bonjour,

je suis débutant dans le développement web et je cherche une solution comment séparer le code HTML du code PHP, est que vous pouvez m'aider SVP ?

Merci.

**Epliknot** · 04/11/2011, 10h22

Bonjour,

qu'entend tu pars la ? as tu un exemple à donner ?

**aymen8219** · 04/11/2011, 11h19

bonjour,

je vous donnes un exemple d'un tableau en php et html les variables var1et var.. je le récupère depuis une base de données.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
 
echo"<table>";
echo"<tr>";
echo"<td>".$var1."</td>";
echo"<td>".$var12."</td>";
echo"<td>".$var2."</td>";
echo"<td>".$var2."</td>";
echo"</tr>";
echo"</table>";

ce que je demande c'est si possible de ne pas écrire echo"<table>"....dans le fichier php et de l'ecrire dans un fichier html séparer et d'appeler le résultat du fichier php dans le tableau du fichier html.

Merci une autre fois.

**Palca** · 04/11/2011, 11h37

Ce n'est pas possible de séparer complètement le PHP du HTML vu que le PHP assure en partie l'affichage, mais c'est possible (même recommandé à mon avis) de séparer le code en différentes parties, comme c'est notamment le cas en MVC.

De manière simplifiée et pour reprendre ton exemple :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<?php
// Logique de la page, PHP uniquement
$viewData = array(
'tdVars' => array($var1, $var2, $var3...),
'otherVar' => 'Hello',
...
);
?>
<!-- Code HTML, et PHP uniquement utilisé pour l'affichage -->
<table>
<tr>
<?php foreach($viewData['tdVars'] as $var): ?>
<td><?php echo $var ?></td>
<?php endforeach; ?>
</tr>
</table>

**Benjamin Delespierre** · 04/11/2011, 16h24

Ce n'est pas possible de séparer complètement le PHP du HTML vu que le PHP assure en partie l'affichage, mais c'est possible (même recommandé à mon avis) de séparer le code en différentes parties, comme c'est notamment le cas en MVC.

Eeeeh si, c'est possible. C'est d'ailleurs ce qui à fait le lit des moteurs de templates comme Smarty ou les squelletes de SPIP.

Tout repose sur un seul concept: la bufferisation de contenu (bonjour l'anglicisme).

Voici concrêtement de quoi il s'agit. Nous avons un application pilotée par un ensemble de scripts PHP que nous appelleront les contrôleurs. Pour afficher les données que ces contrôleurs manipulent, nous utilisons des vues HTML (utiliser un autre format est tout à fait possible par ailleurs).

Voici notre vue:
fichier ma_page.html

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Insert title here</title>
</head>
<body>
  <h1>Ma Page</h1>
  <p>Bonjour je m'appelle %nom% %prenom% et j'ai %age% ans.</p>
</body>
</html>

Ce code HTML ne devra jamais être appellé par le navigateur du client, et pour cause, il manque les données. Afin de pouvoir insérer ces dernières, nous avons placé un certain nombre de pseudo tags pour identifier l'endroit ou les mettre. Il faut donc mettre ce fichier de vue dans une partie inaccessible au navigateur du client.

Maintenant, nous allons créer le contrôleur, c'est lui qui sera effectivement chargé de tout le travail:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 
// initialisons les variables
$nom = "Delespierre";
$prenom = "Benjamin";
$age = 24;
 
// On va charger le contenu de la vue, plusieurs méthode sont possibles:
// - réccupérer le contenu avec file_get_contents
// - bufferiser le contenu avec ob_start / ob_end
// - on peut même utiliser une URL, du XML ou tout ce qui te passe par la tête
// nous allons utiliser la seconde alternative
 
// on commence à "bufferiser"
// ce qui signifie qu'au lieu d'afficher 
// les donnés sur le navigateur, 
// PHP va les stocker dans un buffer
ob_start();
 
// on inclut la vue à charger
include "ma_page.html";
 
// on réccupère ce qu'on vient d'écrire
$html = ob_get_contents();
 
// on arrête de bufferiser
ob_end_clean();
 
// Maitenant on fait les remplacements:
$remplacement = array(
  '%nom%' => $nom,
  '%prenom%' => $prenom,
  '%age%' => $age
);
 
$html = str_replace(array_keys($remplacement), array_value($remplacement), $html);
 
// Finalement on affiche ce qu'on a produit
echo $html;

Et voilà, nous venons de séparer totalement le traitement (le PHP) de l'affichage (le HTML). Cet exemple se veut volontairement simpliste, il n'est destiné qu'a comprendre la logique de la bufferisation de contenus.

Bien d'autres techniques existent pour séparer proprement le traitement de la mise en forme. Si tu souhaite en apprendre plus, je te recommande d'apprendre le paradigme MVC, c'est de loin ce qui est le plus utilisé dans ce cas à l'heure actuelle pour la réalisation d'IHM.

**Marc3001** · 04/11/2011, 16h58

Moi perso, j'utilise un process perso qui consiste à créer par page un HTML avec des tags et un php qui valorise une variable par tag. A la fin du traitement PHP, tu remplaces les tags par le contenu des variables et tu affiches ce HTML généré.

J'imagine qu'il existe des frameworks qui le permettent....

**piotrowski-s** · 05/12/2012, 10h30

Envoyé par Benjamin Delespierre

Eeeeh si, c'est possible. C'est d'ailleurs ce qui à fait le lit des moteurs de templates comme Smarty ou les squelletes de SPIP.

Tout repose sur un seul concept: la bufferisation de contenu (bonjour l'anglicisme).

Voici concrêtement de quoi il s'agit. Nous avons un application pilotée par un ensemble de scripts PHP que nous appelleront les contrôleurs. Pour afficher les données que ces contrôleurs manipulent, nous utilisons des vues HTML (utiliser un autre format est tout à fait possible par ailleurs).

Voici notre vue:
fichier ma_page.html

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
 
<?xml version="1.0" encoding="ISO-8859-1" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>Insert title here</title>
</head>
<body>
  <h1>Ma Page</h1>
  <p>Bonjour je m'appelle %nom% %prenom% et j'ai %age% ans.</p>
</body>
</html>

Ce code HTML ne devra jamais être appellé par le navigateur du client, et pour cause, il manque les données. Afin de pouvoir insérer ces dernières, nous avons placé un certain nombre de pseudo tags pour identifier l'endroit ou les mettre. Il faut donc mettre ce fichier de vue dans une partie inaccessible au navigateur du client.

Maintenant, nous allons créer le contrôleur, c'est lui qui sera effectivement chargé de tout le travail:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
 
// initialisons les variables
$nom = "Delespierre";
$prenom = "Benjamin";
$age = 24;
 
// On va charger le contenu de la vue, plusieurs méthode sont possibles:
// - réccupérer le contenu avec file_get_contents
// - bufferiser le contenu avec ob_start / ob_end
// - on peut même utiliser une URL, du XML ou tout ce qui te passe par la tête
// nous allons utiliser la seconde alternative
 
// on commence à "bufferiser"
// ce qui signifie qu'au lieu d'afficher 
// les donnés sur le navigateur, 
// PHP va les stocker dans un buffer
ob_start();
 
// on inclut la vue à charger
include "ma_page.html";
 
// on réccupère ce qu'on vient d'écrire
$html = ob_get_contents();
 
// on arrête de bufferiser
ob_end_clean();
 
// Maitenant on fait les remplacements:
$remplacement = array(
  '%nom%' => $nom,
  '%prenom%' => $prenom,
  '%age%' => $age
);
 
$html = str_replace(array_keys($remplacement), array_value($remplacement), $html);
 
// Finalement on affiche ce qu'on a produit
echo $html;

Et voilà, nous venons de séparer totalement le traitement (le PHP) de l'affichage (le HTML). Cet exemple se veut volontairement simpliste, il n'est destiné qu'a comprendre la logique de la bufferisation de contenus.

Bien d'autres techniques existent pour séparer proprement le traitement de la mise en forme. Si tu souhaite en apprendre plus, je te recommande d'apprendre le paradigme MVC, c'est de loin ce qui est le plus utilisé dans ce cas à l'heure actuelle pour la réalisation d'IHM.

Bonjour, dans le cadre de votre exemple comment sont gérées les boucles exemple si l'on récupère des données de la bdd, avec un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part