Home > Back-end >  Hide Column in Material UI Data Grid
Hide Column in Material UI Data Grid

Time:07-21

I have successfully hide the id on the columns. However id is still appearing on the filter. Is there to a way to hide it too?

CLICK HERE

 const userColumns = [
    { field: "id", hide: true },
    {
      field: "name",
      headerName: "Name",
      flex: 1
    },
    { field: "email", headerName: "Email", flex: 1 },
    { field: "group", headerName: "Group", flex: 1 },
    { field: "supplier", headerName: "Supplier", flex: 1 }
  ];

CodePudding user response:

Please add the "filterable: false". You can refer the https://mui.com/x/react-data-grid/filtering/#single-and-multi-filtering

  const userColumns = [
    { field: "id", hide: true, filterable: false },
    {
      field: "name",
      headerName: "Name",
      flex: 1
    },
    { field: "email", headerName: "Email", flex: 1 },
    { field: "group", headerName: "Group", flex: 1 },
    { field: "supplier", headerName: "Supplier", flex: 1 }
  ];
  • Related