Questions tagged [material-react-table]
36 questions
2
votes
1 answer
Material React Table simple filtering not working Cannot read properties of null (reading 'value')
Hello we've been using Material React Table npm package for showing data, but filtering isn't working, so every time I type a letter this error pops out
Uncaught TypeError: Cannot read properties of null (reading 'value')
at…

HardRock
- 809
- 2
- 12
- 37
2
votes
0 answers
How to use custom component in Material React Table
I would like to provide a custom component when editing/displaying data the storybook example is here. However this prop muiTableBodyCellEditTextFieldProps does not allow me to render a custom component nor is it flexible enough to take "any…

Jamie Hutber
- 26,790
- 46
- 179
- 291
1
vote
1 answer
How to access the row data from a single cell in Material React Table
I'm using https://www.material-react-table.com/docs/guides/row-actions
I can render the cell a specific way according to this example
const columns = useMemo(
() => [
{
header: 'Relevance',
…

erotsppa
- 14,248
- 33
- 123
- 181
1
vote
1 answer
how to use Material React Table in noRecordsToDisplay custom component
My Project using table libraruy is material-react-table
When there is no data in the table, I want to render a custom component of table body while including column header
The only type of noRecordsToDisplay is string, is there any other…

moolbum
- 109
- 1
- 8
1
vote
2 answers
How to disable some specific columns from edit in react material react table?
By default with Material React Table all fields are editable. I would like be able to make some read-only. However I cannot see it in the documentation anywhere.
import MaterialReactTable from 'material-react-table'
const columns = [
{…

Jamie Hutber
- 26,790
- 46
- 179
- 291
0
votes
0 answers
Material React Table component typing issue
I'm using MRT in my react project. I've created a component that returns MRT and I'm reusing this component across the application to avoid repeating the same props everywhere. I'm running through an issue in typing the columns props in the…
0
votes
0 answers
Avoid using the default edit form with Material-React-Table
In the following Material-React-Table code that I extracted from an example, a default form is used to edit the record, but it doesn't work for me because I need to be able to create my own.
Could you give me a guide on how to create it and pass it…

Jorge
- 13
- 4
0
votes
1 answer
In material-react-table, how do I change the styling for different density values?
I just want to change the styling for the different density modes like "compact" and "comfortable" in the table component. This is using the material-react-table npm library by Material UI.

Jeremy Bernier
- 1,746
- 1
- 17
- 17
0
votes
0 answers
Tanstack table headerprops not accessible anymore
I am currently working with tanstack table and material-ui and I am currently working on a custom filter where when the user clicks the header for a table a popover will appear, right now I am trying to anchor the popover to the I've…

Jam
- 117
- 11
0
votes
0 answers
Gap Between Rows in Material React Table
I have problem with collapsible table in react, when the table in collapsed mode it has gap between row. How to remove the gap?
I am using Material-React-Table
I want it to be like this
CollapsibleTableMain

Nicky Apriliani
- 321
- 4
- 25
0
votes
0 answers
material-react-table row re-order not working
I am trying to make a table in react where I can re-order the rows in two ways:
drag and drop the rows
auto sort by clicking the col header, so if i click the 'name' col header, that col will get re-ordered alphabetically.
In my codesandbox.io…

Martin
- 1,336
- 4
- 32
- 69
0
votes
1 answer
Is there a way to disable or hide fields of "create new" item modal of material react table?
Material React Table lets you disable editing fields by setting "enableEditing" to false. But when you click on "Create new item", the modal opens with all fields and editable. In my case, I want certain fields to be created at the server. Is there…

PrasadB
- 57
- 1
- 6
0
votes
1 answer
Material React Table - OnClick not working
I am using Material React Table, below is the code -
muiTableBodyCellProps: ({cell}) => ({
onClick: (event) => {
console.log(event);
return handleCellClicked(event);
},
})
I am getting the log message, however not…

Pratik das baghel
- 155
- 3
- 10
0
votes
0 answers
Custom edit checkbox on material react table
I am trying to create custom checkbox edit on modal editing mode, but I can't fine the way to update the row data with the new chekbox state.
I have this custom component:
import { Checkbox, FormControlLabel } from "@mui/material"
import React from…

Yossi Shaish
- 57
- 6
0
votes
0 answers
Material React Table filtering should have multi-select and filter based on a text search per column
In the below image, there is a multi-select option for state column, what's the way to have both search and multi-select option for filtering the state column. Currently the filterVariant property is accepting either "multi-select" or "text". How to…

Deepak
- 1
- 1