gregnb / gregnb/mui-datatables

expandable rows with real API example

Open
#1,840 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
2.7k
Forks
906
PR merge metrics
No merged PRs in 30d

Description

I'm trying to create a MUI table where I could show a typical one-to-many relationship using expandable rows for that.
I receive data from API with this format - an array of objects for table data and an array of objects for expanded rows
```
`
[
{
"name": "Row 1",
"status": "status1",
"description": "desc1,
"applicants": [
{
"name": "expanded row 1",
"id": "11091700",
},
{
"name": "expanded row 2",
"id": "1132323",
}
]
},
{
"name": "Row 2",
"status": "status2",
"description": "desc2,
"applicants": [
{
"name": "expanded row 1",
"id": "44444",
},
{
"name": "expanded row 2",
"id": "55555",
}
]
},
]
`
```
## Expected Behavior

I expected that I can simply map data for expanded rows from my API but looking at [expended row example ](https://github.com/gregnb/mui-datatables/blob/master/examples/expandable-rows/index.js) I don't understand how can I do it

## Current Behavior

I built [ cadesandbox example ](https://codesandbox.io/s/jolly-lederberg-mhk4h?file=/src/expandedRows.js) where I created testData file like my API and I can use it as data for my table but I can't find a way how to use it for expanded rows...
I was trying to use **data.applicants.map()** but got undefined "applicants" error

## Steps to Reproduce (for bugs)
In ExpandedRows.js I'm trying to {data.applicants.map((applicantsRow) => (
applicantsRow.name
))}
but got an undefined "applicants" error so I commended it and now can show only static data
[ cadesandbox example ](https://codesandbox.io/s/jolly-lederberg-mhk4h?file=/src/expandedRows.js)

1.
2.
3.
4.

I hope I can find some advice for my problem here. anyway, I think a more realistic ExpandebleRow example would be nice.
Nowadays all data comes from the API and it would be nice to have an example of how to work with it...

## Your Environment

| Tech | Version |
|--------------|---------|
| Material-UI | 5.2.2 |
| MUI-datatables | 4.0.0 |
| React | 17.0.2 |
| browser | |
| etc | |

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.