DEV Community

NardjesBen
NardjesBen

Posted on

Add onclick event to material table react js

I need to retrieve data from the server then I display this data in a table and if a user clicks on a button in the table he can download the file

Here is my data :

files = [ {name : "file1", created_at: "29/01/2021"},
          {name : "file2", created_at: "20/03/2021"}]
Enter fullscreen mode Exit fullscreen mode

table headers :

const tableColumns = [
  { title: "name", field: "name" },

  {
    title: "Date",
    field: "created_at",
    type: "date",
    dateSetting: { locale: "en-GB" },
    filterComponent: (props) => <CustomDatePicker {...props} />
  }
];
Enter fullscreen mode Exit fullscreen mode

My array :

{file && (
<Fragment>
<MaterialTable
columns={tableColumns}
data={file}
title="Material Table - Custom Filter Component"
options={{search: false, filtering: true }}

actions={[
  {
    icon: 'save',
    tooltip: 'Save User',
    onClick: () => window.open('http://localhost:5000/files/' + file.name, '_blank').focus()
  }
]}
/>
</Fragment>)}
Enter fullscreen mode Exit fullscreen mode

I get the error: ENOENT: no such file or directory, stat '/Users/admin//files/undefined'"}

how can i use in react js the link of each file, i tried to use the map function on my data but it doesn't work

Top comments (0)