Classe pour tableau HTML

Version imprimable

Bonsoir à tous,

voilà, j'ai codé une classe pour me faciliter la vie pour la génération de tableau HTML. J'aimerai savoir si vous avez des suggestions pour l'améliorer, ou alors carrément me rediriger vers un existant complet et très facile à utiliser/modifier ? Merci d'avance.

Code:

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
class tableau_html {
		function __construct($arguments="") {
			echo (($arguments=="")?"<table>\n":"<table $arguments>\n");
		}
 
		function tr_td($contenu,$arguments="") {
			$donnees="<tr>\n";
			$donnees.=$this->td($contenu,$arguments);
			$donnees.="\n<tr>\n";
 
			return($donnees);
		}
 
		function tr_td_multiple($contenu) {
			$donnees="<tr>\n";
			foreach($contenu as $un_contenu) {
				if(isset($un_contenu[1]))
					$donnees.=$this->td($un_contenu[0],$un_contenu[1]);
				else
					$donnees.=$this->td($un_contenu[0]);
			}
			$donnees.="\n</tr>\n";
 
			return($donnees);
		}
 
		function tr_th($contenu,$arguments="") {
			$donnees="<tr>\n";
			$donnees.=$this->th($contenu,$arguments);
			$donnees.="\n<tr>\n";
 
			return($donnees);
		}
 
		function tr_th_multiple($contenu) {
			$donnees="<tr>\n";
			foreach($contenu as $un_contenu) {
				if(isset($un_contenu[1]))
					$donnees.=$this->th($un_contenu[0],$un_contenu[1]);
				else
					$donnees.=$this->th($un_contenu[0]);
			}
			$donnees.="\n</tr>\n";
 
			return($donnees);
		}
 
		function th($contenu,$arguments="") {
			return($arguments=="")?"<th>$contenu</th>":"<th $arguments>$contenu</th>";
		}
 
		function td($contenu,$arguments="") {
			return($arguments=="")?"<td>$contenu</td>":"<td $arguments>$contenu</td>";
		}
 
		function fin() {
			echo "</table>\n";
		}
	}

Exemple d'utilisation :

Code:

1
2
3
4
5
6
7
8
9
10
include('tableau_html.class.php');
 
		$t1=new tableau_html("border='1'");
 
		$les_td=array(array("l1c1","style='background-color: blue'"),array("l1c2"),array("l1c3"));
		echo $t1->tr_td_multiple($les_td);
		$les_td=array(array("l2c1"),array("l2c2"),array("l2c3","style='background-color: red'"));
		echo $t1->tr_td_multiple($les_td);
 
		$t1->fin();

23/09/2008, 13h39
ThomasR

Le plus facile, le plus lisible, et le plus performant pour la génération de tableau est de loin d'écrire <table><tr><td></td></tr></table>.

L'instanciation d'une classe, l'appel de méthodes, où tu ne gères pas correctement les attributs, les classes et id css, les légendes, est obsolète et useless.

Ta classe complique davantage qu'elle ne simplifie , tu auras du mal à y trouver un interêt.
23/09/2008, 13h40
Celira

Personnellement, j'aurais simplement créé des fonctions, sans passer par un objet.
Si tu veux vraiment utiliser un objet, je pense que tu devrais plutot avoir un tableau attribut de classe qui contiendrait les lignes et une méthode afficher qui construirait le tableau html à afficher, plutot que des méthodes pleines d'echo...

Mais franchement, je pense qu'il reste quand même plus simple d'écrire directement le tableau...
23/09/2008, 14h32
gui80

Bonjour, et merci des réponses.

Le fait de dire qu'il est plus simple d'écrire directement le tableau me surprend beaucoup.
Pour avoir codé plusieurs fois des tableaux non statiques, avec des particularités, je faisais des fonctions, j'imaginais que le mieux était de l'encapsuler dans une classe.
Si, j'avais écrit directement, celà aurait été carrément illisible !!
Est-ce mon formalisme qui est incompréhensible ? tr_td, td, tr_td_multiple ?

Citation:

Envoyé par ThomasR

L'instanciation d'une classe, l'appel de méthodes, où tu ne gères pas correctement les attributs, les classes et id css, les légendes, est obsolète et useless.

Tu mets tes définitions d'attributs, classes, id css, légendes dans le 2ème champ.
Exemple :
$les_td=array(array("l1c1","style='background-color: blue'"),array("l1c2"),array("l1c3"));
23/09/2008, 15h07
ThomasR

Citation:

Envoyé par gui80

Tu mets tes définitions d'attributs, classes, id css, légendes dans le 2ème champ.
Exemple :
$les_td=array(array("l1c1","style='background-color: blue'"),array("l1c2"),array("l1c3"));

Non c'est très compréhensible, c'est juste plus compliqué à mettre en oeuvre, à maintenir, plus couteux en resources, moins lisible, en gros je n'y vois aucun avantages mais libre à toi de l'utiliser.

Tu trouves $les_td=array(array("l1c1","style='background-color: blue'"),array("l1c2"),array("l1c3")); mieux et plus optimisé que d'écrire <td style="backgruond-color....."/> ??

Sachant que il faut connaitre la ligne l et la colonne c, c'est vraiment laborieux pour si peu. Si on veut affecter un style a tous les <td/> on doit faire n fois ce traitement ? nan ? :p

Niveau lisibilité l'indentation des table tr et td est ce qu'il y a de plus lisible.

Tu piétinne un des principes fondamentaux de la conception objet, à savoir la distinction forme/contenu que tu mélanges à tout va dans ta classe.
23/09/2008, 15h52
gui80

Citation:

Envoyé par ThomasR

Non c'est très compréhensible, c'est juste plus compliqué à mettre en oeuvre, à maintenir, plus couteux en resources, moins lisible, en gros je n'y vois aucun avantages mais libre à toi de l'utiliser.

Donc, en gros, il vaudrait mieux écrire directement les balises ?
Quand tu débugges, c'est pas la galère ?
Pour moi je pensais que c'est plus facile à débugger, et surtout plus lisible, après en ressources, c'est moins bon, c'est sûr.
Sinon, dis moi comment ça se passe pour toi ?
Je ne tiens pas spécialement à garder cette classe, mais utiliser la manière la plus lisible, et rapide à coder.

Citation:

Envoyé par ThomasR

Tu trouves $les_td=array(array("l1c1","style='background-color: blue'"),array("l1c2"),array("l1c3"));
mieux et plus optimisé que d'écrire <td style="backgruond-color....."/> ??
Sachant que il faut connaitre la ligne l et la colonne c, c'est vraiment laborieux pour si peu.

La structure n'est peut-être pas la meilleure, mais quelle autre structure dans ce cas ?

Citation:

Envoyé par ThomasR

Si on veut affecter un style a tous les <td/> on doit faire n fois ce traitement ? nan ? :p

Oui, çà, après, on peut écrire d'autres méthodes où ajouter des paramètres au méthodes existantes pour le gérer. Mais quand tu mets tes balises directement, tu fais n fois ton traitement également.

Citation:

Envoyé par ThomasR

Niveau lisibilité l'indentation des table tr et td est ce qu'il y a de plus lisible.

Je suis d'accord, quand on a pas beaucoup de code à situer dans les td.

Citation:

Envoyé par ThomasR

Tu piétinne un des principes fondamentaux de la conception objet, à savoir la distinction forme/contenu que tu mélanges à tout va dans ta classe.

Tu ferai à quel moment avec cette classe l'injection du contenu dans la forme ?

Je cherche juste à comprendre les choses, et merci d'avance de ton futur avis et des avis déjà donnés.
23/09/2008, 16h10
ThomasR

Citation:

Envoyé par gui80

Donc, en gros, il vaudrait mieux écrire directement les balises ?

Oui

Citation:

Envoyé par gui80

Pour moi je pensais que c'est plus facile à débugger, et surtout plus lisible, après en ressources, c'est moins bon, c'est sûr.
Sinon, dis moi comment ça se passe pour toi ?
Je ne tiens pas spécialement à garder cette classe, mais utiliser la manière la plus lisible, et rapide à coder.

Dans ce cas n'essayes pas de réinventer la roue, le plus rapide a coder c'est d'écrire <tr><td> dans des for, des while si besoin est.

Citation:

Envoyé par gui80

La structure n'est peut-être pas la meilleure, mais quelle autre structure dans ce cas ?

Structure HTML de la forme <table><tr><td></td></tr></table> sans que ce soit une classe qui génère le rendu. Donc l'utilisation basique ou plutot la non-utilisation d'une classe à cet effet.[/QUOTE]

Citation:

Envoyé par gui80

Oui, çà, après, on peut écrire d'autres méthodes où ajouter des paramètres au méthodes existantes pour le gérer. Mais quand tu mets tes balises directement, tu fais n fois ton traitement également.

Sur ce point je suis d'accord, j'avais mal compris ton système mais ca revient au meme en fait.

Citation:

Envoyé par gui80

Je suis d'accord, quand on a pas beaucoup de code à situer dans les td.
Tu ferai à quel moment avec cette classe l'injection du contenu dans la forme ?

Justement en fait moi ce que je veux te dire c'est de ne pas utiliser de classe pour générer du contenu. Ta classe doit te permet de représenter des données, de les traiter, les renvoyer sous des formes différentes afin que le client de cette classe (ta page test.php par exemple) puisse manipuler les données et les écrire à sa guise.
C'est juste sur le principe que ca me choque, mais après rien ne t'empeche de l'utiliser et d'y trouver un intérêt.

Citation:

Envoyé par gui80

Je cherche juste à comprendre les choses, et merci d'avance de ton futur avis et des avis déjà donnés.

Et tu es dans ton droit ;)
23/09/2008, 16h26
gui80

Ok, je vais continuer à coder comme je faisais jusqu'à maintenant. :D

Il est vrai que j'utilisais une classe pour juste utiliser des méthodes, j'aurai utiliser les méthodes de manière statique, c'était pareil. Niveau utilisation des structures, je faisais quelque chose de non académique c'est vrai.

Oui, je voulais juste dire que tes propos ne m'énervaient pas du tout, que je n'étais pas un être borné, mais à l'écoute, et présent ici pour m'améliorer.

Merci de cette discussion ThomasR.

A bientôt sûrement dans d'autres discussions sur le forum.

Hello les jeunes,

De mon point de vue, l'approche de gui80 peut apporter certains avantages, d'abord éviter les erreurs de code HTML, qui ne sont repérables qu'avec un validator ou un éditeur approprié, tandis qu'une erreur php sera tout de suite repérée. Deuzio, cela permet de faire un suivi de la génération des pages (genre connaître le nombre de tags générés suivant le type). De prime abord c'est ce à quoi j'ai pensé.
Bien entendu il y'a le désavantages des ressources systèmes utilisée, mais bon ça me parait anodin.

Sinon j'avais commencé une approche de génération HTML en objet (pas uniquement tableaux) L'avantage est d'utilisé plusieurs classes pour simplifier la génération de tags qui se répètent. Voici le code, ça fait quelques lignes c pas lourd. Il est composé de deux classes Tag et Attribute. Ci-dessous un petit exemple d'utilisation :
Code:

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 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 /* * Tag **/ class HTML_Tag { var $name; var $attributes = Array(); var $content; var $forceClosure = false; public function __construct($name) { $this->name = $name; } public function addAttribute($name, $val) { $this->attributes[$name] = new HTML_Attribute($name, $val); } public function setContent($val) { $this->content = $val; } public function __toString() { // Attributs if (count($this->attributes)) $attributes = ' '.implode(' ', $this->attributes); else $attributes = ''; $txt = '<'.$this->name.$attributes; // Content if ($this->content || $this->forceClosure) $txt .= '>'.$this->content.'</'.$this->name.'>'; else $txt .= ' />'; return $txt; } } /* * Attribut **/ class HTML_Attribute { var $name; var $content; public function __construct($name, $content) { $this->name = $name; $this->content = $content; } public function __toString() { return $this->name.'="'.htmlentities($this->content).'"'; } }
Et un petit exemple d'utilisation :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 class HTML { /* * Crée un lien <style> vers le fichier donné en paramètre **/ public static function linkCSS($href) { $node = new HTML_Tag('link'); $node->addAttribute('rel', 'stylesheet'); $node->addAttribute('href', $href); $node->addAttribute('type', 'text/css'); $node->addAttribute('media', 'screen, projection'); return $node; } } echo HTML::linkCSS('defaut.css');
Après pour générer une tableau il faudrait refaire une classe, si ça t'intéresse j'essaierai de regarder à l'occas.

P.S pour ThomasR qui me lira je l'espère : Je ne vois pas bien en quoi la conception objet fait référence à la distinction forme/contenu !? Un modèle MVC, oui c fait pour, le XHTML et le CSS aussi, mais pas les objets.
Qui plus est le code HTML n'a précisément pas vocation à déterminer une mise en page, mais uniquement la structure logique d'un contenu, adaptée par la suite par les CSS. Les objets, tout comme le procédural sont là pour servir ces technologies.

24/09/2008, 12h22
ThomasR

Salut :)

Je faisais bien référence au modèle MVC, dans ta classe tu fais bien une distinction forme / données puisque le contenu est définit par l'utilisateur de ta classe. Ta classe a pour seule but de manipuler les données et les générer au format HTML. Elle n'impose rien au contraire de celle de gui_80 qui, peu flexible, possède certaines restrictions.

Le principe en lui même est sympa, faisant beaucoup de asp.net je suis habitué à la manipulation des tags html sous la forme d'objets, ca apporte beaucoup d'avantages nottament pour certains traitement récurents comme tu le dis si bien.

Là où je veux en venir c'est qu'il y a un fossé qui sépare ce que tu as fait sur la modélisation objet des tags et attributs html et la classe de génération de <table> de gui_80.

J'ai corrigé mes classes, et ajouter des nouvelles classes pour gérer les tableaux de manière aisée.

D'abord les 2 classes Tag et Attribute, la classe Tag ayant été corrigée pour inclure les enfants dans le contenu :

Code:

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
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
  /*
   * Tag
   **/
 
  class HTML_Tag {
 
    var $name;
    var $attributes = Array();
    var $children = Array();
    var $forceClosure = false;
 
    public function __construct($name) {
 
      $this->name = $name;
    }
 
    public function addAttribute($name, $val) {
 
      $this->attributes[$name] = new HTML_Attribute($name, $val);
    }
 
    public function addChild($node) {
 
      $this->children[] = $node;
    }
 
    public function __toString() {
 
      // Attributs
 
      if (count($this->attributes)) $attributes = ' '.implode(' ', $this->attributes);
      else $attributes = '';
 
      $txt = '<'.$this->name.$attributes;
 
      // Content
 
      $content = '';
 
      foreach ($this->children as $child) $content .= $child;
 
      if ($content || $this->forceClosure) $txt .= '>'.$content.'</'.$this->name.'>';
      else $txt .= ' />';
 
      return $txt;
    }
  }
 
  /*
   * Attribut
   **/
 
  class HTML_Attribute {
 
    var $name;
    var $content;
 
    public function __construct($name, $content) {
 
      $this->name = $name;
      $this->content = $content;
    }
 
    public function __toString() {
 
      return $this->name.'="'.htmlentities($this->content).'"';
    }
  }

Puis les nouvelles classes Table et TableRow :

Code:

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
39
40
41
42
43
44
45
46
  class HTML_Table extends HTML_Tag {
 
    function __construct() {
 
      parent::__construct('table');
    }
 
    function addRow() {
 
      $row = new HTML_TableRow();
      $this->addChild($row); 
 
      return $row;
    }
  }
 
  class HTML_TableRow extends HTML_Tag {
 
    function __construct() {
 
      parent::__construct('tr');
    }
 
    function addCell($content, $attributes = NULL) {
 
      $cell = new HTML_Tag('td');
      $this->addChild($cell);
 
      $cell->addChild($content);
      if (is_array($attributes)) foreach ($attributes as $key => $val) $cell->addAttribute($key, $val);
 
      return $cell;
    }
 
    function addMultiCell($cells) {
 
      if (is_array($cells)) {
 
        foreach($cells as $key => $val) {
 
          if (is_array($val)) $this->addCell($key, $val);
          else $this->addCell($val);
        }
      }
    }
  }

Et un exemple d'utilisation, j'ai mis plusieurs méthode pour rendre le même résultat, ça paraît un peu lourd mais en fait c facile :

Code:

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
  $tableau = new HTML_Table;
  $tableau->addAttribute('style', 'border: 1px solid gray');
 
  // Création des enfants
 
  $row = $tableau->addRow();
  $cell = $row->addCell('hello');
  $cell->addAttribute('class', 'jolicell');
  $row->addCell('bafoui', Array('style' => 'color: orange'));
  $row->addCell('bilibilibil');
  $row = $tableau->addRow();
  $cell = $row->addCell('Helllooooooooo');
  $cell->addAttribute('colspan', 3);
  $row = $tableau->addRow();
  $row->addMultiCell(Array('cellA', 'cellB' => Array('colspan' => 2, 'style' => 'background-color: blue')));
 
  // Idem à :
 
  $tableau->addRow()->addMultiCell(Array('hello' => Array('class' => 'jolicell'), 'bafoui' => Array('style' => 'color: orange'), 'bilibilibil'));
  $tableau->addRow()->addCell('Helllooooooooo', Array('colspan' => 3));
  $tableau->addRow()->addMultiCell(Array('cellA', 'cellB' => Array('colspan' => 2, 'style' => 'background-color: blue')));
 
  // On peut aussi ajouter des attributs au tr
 
  $row = $tableau->addRow();
  $row->addAttribute('style', 'background-color: violet');
  $row->addCell('Je suis le plus violet', Array('colspan' => 3));
 
  echo $tableau;

Voili, j'en suis plutôt content je dois dire :D

24/09/2008, 15h55
gui80

Bonjour,

je reviens sur le forum sans penser que le débat sur des classes pour la génération de tableaux HTML soient réactivés.

ThomasR a raison, mais bon, j'ai mis un 1er code pour en parler et bien entendu ensuite l'améliorer, c'était pour se faire un début d'idée.

Daajack a fait un super code j'avoue, félicitations.
Et en plus, j'ai l'impression que Daajack reprend des noms de méthodes similaires à ceux de la librairie Spreadsheet pour manier facilement des fichiers excel à créer. Donc, c'est bien sympathique.

Je fais des tests de ton code ce soir pour en reparler.
24/09/2008, 15h57
ThomasR

Oui c'est du bon boulot ce qu'il a fait, ya plus qu'a enrichir avec les méthodes qui vont bien (getChild($index); getChildrenByTagName($tagname); etc etc mais je lui apprends rien :) )

Oui, ça marche bien.

Bon, la propriété forceClosure dans HTML_Tag ne sert pas.
Sinon, il faudrait définir les méthodes qui serait utile à implémenter.
J'ai implémenté celà évoqué par ThomasR. A toi de dire si celà peut être mieux fait en apportant un autre code.
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 protected function getAttribute($name) { return(($this->attributes[$name])?$this->attributes[$name]->content:NULL); } public function getChild($index) { return((count($this->children)-1>=$index)?$this->children[$index]:NULL); } public function getChildrenByTagName($tagname) { $match_childs=Array(); foreach ($this->children as $child) { if($child->getAttribute($tagname)) array_push($match_childs,$child); } return($match_childs); }

La propriété forceClosure sert à éviter des tags vide de se transformer en tag simple genre <li/> au lieu de <li></li>.

Pour tes fonctions pourquoi pas, maintenant ce sont des méthodes qu'on retrouve dans la librairie DOM, qui est certainement bien plus pratique pour la manipulation des nœuds, mais pour des petits bouts de code elle est un peu lourde. D'où l'intérêt de ma classe qui a surtout pour vocation de générer l'HTML en séquentiel.

Le problème c'est qu'il n'y a pas forcément une persistance des noeuds, le tableau children pouvant contenir de simples chaînes, c pourquoi il faut faire un contrôle dans ta méthode getChildrenByTagName, si le child en question est bien dérivé de la classe Tag :
Code:

1 2 3 4 5 6 7 8 9 10 public function getChildrenByTagName($tagName) { $matchChildren = Array(); foreach ($this->children as $child) if ((get_class($child) == 'HTML_Tag' || is_subclass_of($child, 'HTML_Tag')) && $child->name == $tagName) $matchChildren[] = $child; return($matchChildren); }
Ni testé, ni approuvé.