0

I have a DataTable with the following columns:

const columns = [
    {   name: "Matric",
        selector: "matric",
        sortable: true        
    },
    {
        name: "Forename",
        selector: "forename",
        sortable: true
    },
    {
        name: "Surname",
        selector: "surname",
        sortable: true
    }
]


    <DataTable
        pagination
        selectableRows 
        columns = {columns}
        data = {studentData}
        defaultSortField="matric"
    />

SelectableRows adds a checkbox to each row. I'm using the datatable to take attendance but I was hoping to also allow the user to upload the attendance via a .csv, or if an attendance record already exists it will display it in the datatable.

By uploading the csv or fetching the attendance record, I'm hoping that the datatable will rerender with the respective rows checked so the user can double check. But I'm not sure how to select a row on render.

Any help would be great!

gannothor
  • 9
  • 1
  • 3

3 Answers3

0

Just pass a prop with the prop with the rows you want checked: selectedData = { studentData[0], studentData[1] }

k-wasilewski
  • 3,943
  • 4
  • 12
  • 29
0

This is deprecated. We have to use a row format like row => row.name.

cigien
  • 57,834
  • 11
  • 73
  • 112
Rajsekhar Chatterjee
  • 1
0

for the dynamic row, we have to use a format like this col.push({name: fields_map[key], selector: row => {return row[key] } })

Ishwori ghimire
  • 1
  • 1
  • Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Oct 17 '22 at 22:22