Drupal 8: du code HTML dans les en-têtes d'un tableau

Petite prise de tête ce matin sur un dev perso: j'ai une classe de type "Form" qui permet d'afficher un tableau contenant des éléments de formulaire. Grosso-modo, j'affiche une liste de données modifiable par l'utilisateur.

Cette liste de données est un peu particulière car elle propose des données "statiques" (extraites à partir de données précédement mises en place par l'utilisateur via d'autres procédés) ainsi que des données dynamiques (ajoutable manuellement par l'utilisateur directement à partir du formulaire).

L'idée, c'est de pouvoir indiquer à l'utilisateur que selon le type de données (statique ou dynamique), les champs du formulaire vont avoir des effets différents.

Pour ce faire, je me suis dit qu'une petite icône "point d'interrogation" dans l'en-tête d'une des colonnes de ma table serait du plus bel effet. Le but est donc d'afficher, dans l'en-tête d'une colonne, une icône ainsi que le titre standard de la colonne.

J'ai bêtement essayé d'intégrer directement un lien dans mon en-tête, comme ceci:

    $icon_text = $this->t('<span class="icon">Info</span>');
    $url = Url::fromUserInput('#custom-info', [
      'attributes' => [
        'class' => [
          'customize-info',
        ],
        'title' => $this->t('A useful information for final user.'),
      ],
    ]);
    $link = \Drupal::service('link_generator')->generate($icon_text, $url);
 
    $header = [
      $this->t('Category'),
      $link . $this->t('Customize'),
      $this->t('Information'),
      $this->t('Weight'),
      $this->t('Delete'),
    ];

Mais il fallait bien se douter que ça ne serait pas aussi simple... En faisant ça, je me retrouve avec le code HTML du lien affiché ().

J'ai donc cherché un peu sur le net, et la documentation officielle indique ceci:

data: The localized title of the table column, as a string or render array.

Ahh... On est donc sensé pouvoir lui passer un tableau de rendu... Alors qui ne tente rien n'a rien, comme on dit:

    $icon_text = $this->t('<span class="icon">Info</span>');
    $url = Url::fromUserInput('#custom-info', [
      'attributes' => [
        'class' => [
          'customize-info',
        ],
        'title' => $this->t('A useful information for final user.'),
      ],
    ]);
    $link = \Drupal::service('link_generator')->generate($icon_text, $url);
 
    $header = [
      $this->t('Category'),
      [
        'data' => [
          '#markup' => $link . $this->t('Customize'),
        ]
      ],
      $this->t('Information'),
      $this->t('Weight'),
      $this->t('Delete'),
    ];

Et cette fois ça passe. Il ne manque plus qu'un peu de CSS pour faire en sorte d'afficher une icône en lieu et place du texte "Info" et le tour est joué !

Ajouter un commentaire

CAPTCHA
Cette question permet de savoir si vous êtes un visiteur ou un robot de soumission de spams