DataTable column header templating

UI Components for Vue
Post Reply
freecorvette
Posts: 2
Joined: 10 Jan 2021, 12:23

28 Feb 2023, 14:20

There are some situations when column headers would need to accept HTML (or templating):
- show a help (?) icon next to the column name
- show a link that has an action upon clicking
- dynamically expand some text upon clicking on a "view more" icon
- render the column icon as an input/dropdown and bulk apply the value to all cells below using a button
- etc.

Currently, the DataTable component does not accept any such customizations and the only way I can think of around this would be to show a grid with no headers and a custom renderer that would render the custom headers as the table's first row, then render the data below, starting from the 2nd row. Which seems quite cumbersome for such a simple feature.

Any way to have column header templating or any plans to have in the near future?

Thanks!

shintoo
Posts: 1
Joined: 25 Apr 2023, 17:28

25 Apr 2023, 17:31

This appears to have been implemented, like so:

Code: Select all

<Column field="name">
  <template #header>
    <span class="name">Name (but in a template!)</span>
  </template>
</Column>

Post Reply

Return to “PrimeVue”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 15 guests