Conditional columns for Datatable

[sajjanhubale]

HI,

Can you please let us know how to hide/show columns based on condition?

Thanks in advance!

Regards,
Sajjan Hubale

[Jomo86]

I was not able to find a native way to do this within the DataTable component.
However, it is easy to do with conditional CSS.

You'll want to initialize state within your component, and set it to true or false. For example, on my current project, I have a "debugMode" that shows or hides certain columns that end users do not need to see.

Code: Select all

<Column field='ID' header='ID' style={{display: this.state.showHiddenColumns ? ' ' : 'none' }}/> 

When your state "showHiddenColumns" is false, the CSS will be

Code: Select all

"display: 'none'

and will override the default style.
But when the boolean is true, the blank ' ' value will revert to the default style.

[mert.sincan]

Hi,

Yes, you can add a custom style for this issue Or you can use dynamic column feature of datatable. Please see this demo; https://www.primefaces.org/primereact/#/datatable (the second demo)

Best Regards,