How to get hidden columns from datagrid

user_15793323 0
Viewed 1931

I'm using the commercial version of material-ui DataGrid, called x-Grid. It allows users to hide/show columns through the column options menu or the Columns Panel on the toolbar.

What I'm trying to do: I want to get information on current state of columns (which ones are hidden or rearranged) so I can save it for future visits.

In the x-Grid API documentation I don't see a callback fired when a user hides a column.

Is there a way for me to get that information from the component?

material-ui reactjs datagrid
1 Answers

There is a onColumnVisibilityChange prop available on XGrid where you can manage the hidden columns.

For example -

const [hiddenColumns, setHiddenColumns] = useState([]);

return ( 
  <XGrid
    columns={Columns}
    rows={Rows}
    onColumnVisibilityChange={(col) => setHiddenColumns([...hiddenColumns, col.field])}
  />
)

check more - datagrid

user_103153870
Related