javascriptreactjsmaterial-uidatagridmui-x-data-grid

How to remove select all checkbox in MUI X Data Grid header

I want to remove the Select All checkbox which is at the top of the checkbox datacolumn.

checkboxSelection

adds checkboxes for every row but also adds the select all checkbox on top in the header. How can i remove this?

Solution

  • I had the same problem and was looking at the MUI-X git. I found a solution for this, is hide the header of the checkbox, so in that way you will remove the select all behavior.

    Hope this works for you as well.

    Here is the original solution on git: https://github.com/mui/mui-x/issues/1904#issuecomment-1219293315

    <DataGrid
...
sx={{
  "& .MuiDataGrid-columnHeaderCheckbox .MuiDataGrid-columnHeaderTitleContainer": {
    display: "none"
  }
}}/>

    Example