Stack Overflow
Stack Overflow

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
2 answers

Material UI React table hangs on switching tabs

I created SPA using react with these compnents: BrowserRouter, Route, Link, AppBar, Toolbar, Tabs, Tab, MaterialTable. Everything works fine except, when I switch between the tabs (clicking on PAGE1, PAGE2 links) rapidly the browser hangs. This…
user22317
  • 59
  • 1
  • 5
4
votes
1 answer

material-table Make Row Editable on Click

Using the material-table library, I am trying to make table rows editable on double click. Clicking the row should have the same effect as clicking the edit button on the leftmost side in the actions column. I have successfully linked into the…
Dynamic
  • 497
  • 1
  • 10
  • 17
4
votes
1 answer

Is there a way to remove currency prefix from material-table react?

Is there any way to remove the currency prefix from react's material-table since I am using different currencies on the table, it becomes confusing to stick to just one prefix as I have a different column to display the type of currency Any help…
Adwera
  • 53
  • 5
4
votes
2 answers

eslint: Component Definition is missing displayName

Using material-table (https://material-table.com/#/docs/features/component-overriding), I'm trying to override a certain component of a table. It renders just fine, but I'd like to get rid of the eslint error intellij throws at me without just…
Bishonen_PL
  • 1,400
  • 4
  • 18
  • 31
4
votes
1 answer

Select renderValue function not being called [ReactJS/Material-UI]

I have a select function within a material-table (a module which I installed). I am also using the Chips component from Material-UI. However, in this function I have tried troubleshooting why nothing appears when I select something and it seems that…
nathvv
  • 125
  • 2
  • 12
4
votes
1 answer

Getting async data in a react material table component

I'm building a small react app using firebase for both hosting and storing data, I am using a Material-Table for showing the data. The problem is i get this error when I'm trying to load the data into the table: Error: Objects are not valid as a…
Daan van de Haar
  • 119
  • 2
  • 6
4
votes
1 answer

Create dynamic action column in React Material UI Table

I have a DataTable component that contains Material React Table. I pass the column and row data as props to the DataTable component. I now wanted to add an action column having option like edit and delete. I got stuck here. I provide my code below,…
Manush
  • 1,852
  • 7
  • 26
  • 39
4
votes
1 answer

How to show hidden columns only in editing or creation mode using material-table react?

Hi I using https://github.com/mbrn/material-table and I want to show hidden columns only in editing or creation mode, this is possible?
Murilo Fernandes
  • 61
  • 7
4
votes
1 answer

MaterialUI theme styling for nested classes

I'm creating a theme for an app with createMuiTheme. I'm using material-table and I need to target to this icon of the column table header that is currently sorted: Watching in developer tools it has the following CSS…
David Ferreira
  • 1,233
  • 17
  • 24
4
votes
4 answers

How to conditionally style ReactJs material-table cell based on cell values?

I am having a column in material-table with values like success,failed etc. Based on these values I need to apply color on cell. How to achieve it using material-table.
yb007
  • 1,377
  • 2
  • 11
  • 17
4
votes
1 answer

How to edit multiple fields in single column material-table

I'm using material-table for a project. There I have a scenario I need to render and edit multiple fields in a single column conditionally. This is the scenario { title: intl.formatMessage({ ...commonMessages.rate }), field: 'fixed', render:…
Thidasa Pankaja
  • 930
  • 8
  • 25
  • 44
4
votes
1 answer

Col span and Row span in material-table header React

I am trying to use the material-table and I would like to use colspan and rowspan in the material-table. I already search for example and sample but I don't see anything. Currently, I use to like that in the material table …
Loran
  • 772
  • 4
  • 16
  • 38
4
votes
2 answers

how to read material-table column headers array while dragging occurred using reactjs

How to read material-table column headers array while dragging occurred using reactjs? I used onColumnDragged function but getting sourceIndex,destinationIndex only. I need to get all column headers order for passing to rest call to save the new…
Parvin
  • 71
  • 4
4
votes
2 answers

How to change default sorting icon on table header column on React Material-Table?

Can I change the default sorting icon on React Material-Table table header column ? ex. I want to change asc sorting icon to ArrowDownward and desc sorting icon to ArrowUpward. I try to set SortArrow icons props on MaterialTable but its show on…
Mashizilla
  • 43
  • 1
  • 3
4
votes
3 answers

how to change material table action fields icon

actions={[ { icon: 'edit', tooltip: 'Edit User', onClick: (event, rowData) => alert('You are editing ' + rowData.name) }, { icon: 'delete', tooltip:…
Jargalan
  • 81
  • 2
  • 3
1 2 3
…
48 49