DEV Community

NardjesBen
NardjesBen

Posted on

2 1

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

Heroku

Simplify your DevOps and maximize your time.

Since 2007, Heroku has been the go-to platform for developers as it monitors uptime, performance, and infrastructure concerns, allowing you to focus on writing code.

Learn More

Top comments (0)

Sentry image

See why 4M developers consider Sentry, “not bad.”

Fixing code doesn’t have to be the worst part of your day. Learn how Sentry can help.

Learn more

👋 Kindness is contagious

Please leave a ❤️ or a friendly comment on this post if you found it helpful!

Okay