mui / mui-x

MUI X: Build complex and data-rich applications using a growing list of advanced React components, like the Data Grid, Date and Time Pickers, Charts, and more!
https://mui.com/x/
4.53k stars 1.31k forks source link

[question] How can i remove column sorting from datagridView ? (^6.19.6) #13644

Closed Ankur-Marwaha closed 4 months ago

Ankur-Marwaha commented 4 months ago

The problem in depth

<DataGridPro
          sx={{
            '&, [class^=MuiDataGrid]': { border: 'none' },
            '&, [class^=MuiDataGrid-row]': {
              borderBottom: '1px solid rgba(0, 0, 0, 0.12)',
            },
            '&, [class^=MuiDataGrid-row--lastVisible]': { border: 'none' },
            marginTop: '20px',
            marginBottom: '20px',
            '& .MuiDataGrid-columnSeparator': {
              display: 'none',
            },
          }}
          getRowId={getRowId}
          rows={dataView}
          columns={stopSequenceColumns}
          disableRowSelectionOnClick
          disableMultipleRowSelection
          disableColumnPinning
          disableColumnReorder
          disableColumnResize
          disableColumnMenu
          disableMultipleColumnsSorting
          hideFooter
          disableChildrenSorting
          disableColumnFilter
          disableColumnSelector
          density="compact"
          loading={false}
          localeText={
            i18n.resolvedLanguage === 'en'
              ? enUS.components.MuiDataGrid.defaultProps.localeText
              : deDE.components.MuiDataGrid.defaultProps.localeText
          }
        />

How do i disable column sorting ?

image

Your environment

chrome browser "@mui/x-data-grid-pro": "^6.19.6",

Search keywords: column sorting Order ID: 85146

KenanYusuf commented 4 months ago

Hi @Ankur-Marwaha, thank you for providing a code sample and your environment details.

I see you are using v6. In this case, you can set the sortable property for each column definition to false. See this page on the docs. https://v6.mui.com/x/react-data-grid/sorting/#disable-the-sorting

If you upgrade to v7, there is a top level disableColumnSorting prop that can be applied to the data grid to disable column sorting for every column. https://mui.com/x/react-data-grid/sorting/#for-all-columns

Hope this helps with your question.

github-actions[bot] commented 4 months ago

:warning: This issue has been closed. If you have a similar problem but not exactly the same, please open a new issue. Now, if you have additional information related to this issue or things that could help future readers, feel free to leave a comment.

@Ankur-Marwaha: How did we do? Your experience with our support team matters to us. If you have a moment, please share your thoughts in this short Support Satisfaction survey.