Questions tagged [material-table]

material-table is a npm package that based on reactjs and material-ui.

material-table is a npm package that based on reactjs and material-ui. You can access its source code and documentation from github or its website.

731 questions
4
votes
3 answers

How to remove the overlay loader from material table?

How can I remove the overlay loader completely from the table? (Table used: https://github.com/mbrn/material-table)
Yash Sangai
  • 43
  • 1
  • 3
4
votes
1 answer

Material-table editable: Making all rows editable at once

I have a table with multiple rows and I want to be able to make them all editable at once. Using the editable tag I've been able to go into edit mode and make one row at a time editable, but if I tab from one row to the next it doesn't save changes.…
Lyric
  • 41
  • 1
  • 3
4
votes
4 answers

Is it possible to make fields required on material-table

I am working on a project, where I basically do crud using material-table interface. I am wondering is there a way if I can make fields required if I want too? I tried researching but not much results. Please see the code below which is straight…
4
votes
2 answers

material-table edit/delete button change action

I'm using material-table in react js https://material-ui.com/components/tables/#material-table I need to redirect the user to a separate edit page for the item. I don't understand how to redirect to the edit page.
Mahendra Pratap
  • 3,174
  • 5
  • 23
  • 45
4
votes
2 answers

How to use custom 'editComponent' in material-table?

I'm trying to use 'material-table' in my project. My 'icon' column contains icon name. I need change this icon by selecting it from external dialog. I have problem with updating table data from external dialog. When I use 'input' element and I…
ks099
  • 93
  • 1
  • 2
  • 11
3
votes
2 answers

React Material Table Front End Pagination only

I have MUI 4 and doing table pagination. I received all the data from API which has no pagination, only about 50 items, so it will be small front end pagination. Are there any easy input to set properties for this table? I tried copying examples…
mattsmith5
  • 540
  • 4
  • 29
  • 67
3
votes
0 answers

How to put selection as single(only one row should be selected) in MaterialTable react

Is there any option for selecting Only one row instead of multiple rows setSelectedRows(rows)} columns={columns} …
Vamsi Krishna
  • 279
  • 1
  • 2
  • 8
3
votes
1 answer

Material-table: prop.theme is undefined

I am using Material-table in reactjs to display data. However, it compiles with the warning: Uncaught TypeError: props.theme is undefined renderFooter material-table.js:872 render material-table.js:1019 React 17 js index.js:7 factory react…
Jerevick
  • 51
  • 6
3
votes
1 answer

How to filter by date greater than in Material Table?

How to filter by date greater than current value in Material table? This is what I managed so far, it's filtering by exact date and I need to filter all values which are >= that current value in table.
HardRock
  • 809
  • 2
  • 12
  • 37
3
votes
2 answers

How check the state of individual checkbox in reactjs (material-table)

I am having a table which will contain list of students fetched from a database. When I click each student row a modal popup will be shown containing another table of 4 rows and 3 columns. Each column in the modal will contain 4 checkboxes. When I…
hamdan
  • 203
  • 1
  • 5
  • 12
3
votes
1 answer

is there a way to add a to every column header using Material Table React

Hi I am trying to add a to every cell of table. I am using Material table here: https://material-table.com/#/docs/features/component-overriding I tried like this:
Hongli Bu
  • 461
  • 12
  • 37
3
votes
0 answers

Add Flipmove to Material Table but not working

This is my code for customize material table with react-flip-move animation when row change. But it's not working. components={{ Body: rowData => { return (
Thai Son
  • 91
  • 2
  • 3
3
votes
0 answers

Override Material Table Export Button Design React js

I am new in react js I am using material UI. I have used Material Table to display server side data. I want to change the Export button design. Is there any way to override the export button design or use material table export function with custom…
Balwinder
  • 72
  • 1
  • 9
3
votes
0 answers

How to create dynamic custom style on mat -dialog on each mat-table row with top triangle in Angular - Material

Here is my sample code. Please find my working sample code here I need to set triangle on right top corner in mat-dialog box - Angular. I am getting top right corner triangle dialog box using static css on last row. But here not able to get on each…
Mit Jacob
  • 159
  • 1
  • 15
3
votes
1 answer

How can I set position of a dialog box under the button click event of each row in Mat table?

Here is my sample code. I created code here please see my working code here I tried to set up a position for a dialog box dialogConfig.position = { top: '370px',left: '500px'} But for each row it's opening at the same position. Here, I need to…
Mit Jacob
  • 159
  • 1
  • 15