How to disable the menu button option in MUI X Data Grid?

Question

I want to disable the button that pops all the options like: Sort, Filter, Hide, Etc.

I know you can remove the sorting option in the columns with sortable: false and if I want to remove everything else then I can simply use Both of this disableColumnFilter to remove the filter and disableColumnSelector to remove pretty much everything else However even if I remove all the options the button is still there and I want to remove it.

Answer 1

I should have done more research before asking but I found the answer after checking for something else.

So you have 3 'modifiers'

• disableColumnMenu
• disableColumnFilter
• disableColumnSelector

disableColumnMenu will completely remove the button with the options disableColumnFilter will just remove the filter option disableColumnSelector will remove the hide/show columns

you can check the sort true/false while creating the columns with a simple sortable = true/false

Ej:

const columns = [
        { field: 'name', headerName: 'Name', width: 450, sortable: true/false}
      ]

And this is how it looks with disableColumnMenu it doesn't show the button anymore at all

Answer 2

I just ran into the same issue regarding having to disable only a single column from being sorted and filtered.

Found the MUI GridColDef Interface documentation very helpful: https://mui.com/x/api/data-grid/grid-col-def/.

• sortable
• disableColumnMenu