Page 1 of 1

Conditional columns for Datatable

Posted: 16 May 2019, 10:49
by sajjanhubale
HI,

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

Thanks in advance!

Regards,
Sajjan Hubale

Re: Conditional columns for Datatable

Posted: 16 May 2019, 19:04
by 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.

Re: Conditional columns for Datatable

Posted: 24 Jun 2019, 10:56
by aragorn
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,