Search code examples
reactjsmaterial-uimaterial-table

Error sending the data of the row from the detail panel material-table


I am trying to pass the actions to the material-table detail panel but for some reason the buttons are not sending the row data to the dialog. The other props are passed but not the row data.

Check it out by looking at the props

{show: true, rowUser: undefined, ƒ}

Am I passing the data in the right waythe row? What could be the problem?

          detailPanel={[{
             icon: 'account_circle',
             tooltip: 'Show Surname',
             render: rowData=> {
               return (
              <IconButton aria-label="User" onClick={(event, rowData)=>{
                setRows(rowData);
                setOpen(true);} }>
              <MenuBookIcon />
            </IconButton>

               )
             },
           },
       ]}  

Solution

  • You want rowData on your first function. The onClick of the iconButton has one param: event; not two. you need to change your function to this

    <IconButton aria-label="User" onClick={(event)=>{
                    setRows(rowData);
                    setOpen(true);} }>