Créer un tableau html dans un contrôleur de Drupal

Drupal 8

Créer un tableau html dans un contrôleur de Drupal

Soumis par Antoine le sam 21/03/2020 - 20:33

Plutôt que de créer un tableau HTML dans un gabarit, il est possible d'utiliser la classe table pour le créer depuis le contrôleur.

Pour cela, on va créer un tableau associatif dans le contrôleur qu'on fera passer comme variable au thème. Pour que cela fonctionne, il faut avoir déclarer la variable dans le fichier nommodule.module comme nous l'avons vu dans le tuto "Attacher un gabarit à une route".

//NommoduleController.php    
$table = [
      //On utilise la clé #table pour indiquer que ce tableau associatif décrit un tableau html
      '#type' => 'table',

      //La clé #attribute permet d'ajouter des classes au tableau
      '#attributes' => [
        'class' => ['table-class'],
      ],

      //La clé header permet de décrire le header
      '#header' => [
        //On commence par faire un tableau par cellule du header.
        // Chaque cellule contient soit une valeur simple, soit un tableau avec une clé data pour les valeurs, 
       // et des clés pour les attributs ou les classes :
            'col1' => 'th1',
            'col2' => [
              'class'=>'th-header-class',
              'data'=>'th2',
              'colspan'=>2
            ],       
      ],

      
      //La clé #rows est un tableau qui permet d'ajouter des lignes qui seront elles aussi décrite par un tableau
      '#rows' => [
        //chaque  ligne est un tableau. Si elle ne contient que des valeurs on peut les indiquer directement
        [1, 2, 3],
        //On peut rajotuter un niveau et avoir une clé #data pour les valeurs et une clé pour chaque attribut que l'on veut donner à la ligne.
        //Pour les valeurs des attributs ou des classes on peut les placer dans un tableau
        [
          'id'=>'row2',
          'class' => ['tr-class'],
          'data' => [
            4,5,6
          ]
        ],
        //Enfin chaque cellule peut être aussi décrite par un tableau qui contient une cle data et des clé pour les attributs
        [
          'class' => ['tr-class'],
          'data' => [
            [
              'data'=>8,
              'class'=>['td-class1', 'td-class2'],
              'id'=>'cellule8'
            ],
            [
              'data'=>9,
              'class'=>'td-class1 td-class2'
            ],
            [
              'data'=>10,
              'class'=>['td-class']
            ]
          ]
        ]
      ], //ferme #row

      //La clé #footer fonctionne comme une row
      '#footer' => [
        //On commence par faire un tableau par tr du footer. Chaque tr contient une clé data pour les valeurs, des clé pour les attributs ou les classes :
        [
          'class' => 'tfoot-tr-class',
          //Si une cellule ne contient qu'une valeur alors on peut l'indiquer simplement.
          //S'il faut ajouter des classes ou des attributs alors il faurt faire un tableau assoicatif avec une clé data pour les valeurs et des clé class pour a class et des clé qui porte le nom des attributs qu'on veut ajouter (ici colspan)

          'data' => [
            // La première cellule contient une valeur simple
            'Titre de colonne 1 dans le footer',
            
            // La seconde cellule doit posséder une claasse et l'attribut colspan. 
            [
              'class' => 'th-footer-class',
              'data' => 'Titre de colonne 2 dans le footer',
              'colspan' => 2
            ],
          ],
        ],
      ],

    ];

//Il ne reste plus qu'à ajouter la table au tableau de rendu
$arr['content'] = [
      '#theme' => 'home',
      '#table'=>$table,
    ];

Pour afficher le tableau dans le thème il suffit d'afficher la variable qui contient notre tableau {{table}}

Version