DataTable Column Header Element

[konradkoc]

There is no guarantee in receiving an immediate response in GitHub Issue Tracker, If you'd like to secure our response, you may consider PrimeReact PRO Support where support is provided within 4 business hours

I'm submitting a ... (check one with "x")

[ ] bug report
[X ] feature request
[ ] support request => Please do not submit support request here, instead see https://forum.primefaces.org/viewforum.php?f=57

Current behavior I wish to add right aligned element, to dataTable column header. Like that 'X' icon I could achive this, by changing column.header content, but since its on the left I had to position absolute my icon, which works fine as long as I dont resize column to be smaller and then icon overlapping everything and it is a mess.

Expected behavior There should be a way to easily add element to columnHeader or/and make columns closable like in my screenshot. Both would work for me

Minimal reproduction of the problem with instructions

Please tell us about your environment:

• React version: 7.0.1

• PrimeReact version: 7.0.0

• Browser: [all | Chrome XX | Firefox XX | IE XX | Safari XX | Mobile Chrome XX | Android X.X Web Browser | iOS XX Safari | iOS XX UIWebView | iOS XX WKWebView ]

• Language: [all | TypeScript X.X | ES6/7 | ES5]

[mertsincan]

I think it can be z-index issue. Could you please try the following css?

.p-datatable .p-column-resizer {
   z-index: 99999999 !important;
}

I'll work on this enhancement in the next version. Maybe, title and header templates can refer to different places.