Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

304
Views
How can i edit a react-table input (React.js)

Hello fellow programmers.

Im new to react and i am trying to Update data inside react-table table.

I want to update the data in a particular cell with an onClick() event

following is my code snippet for code reference

return (
    <div>
        <table {...getTableProps()} style={{ border: 'solid 1px blue' }}>
        <thead>
            {headerGroups.map(headerGroup => (
            <tr {...headerGroup.getHeaderGroupProps()}>
                {headerGroup.headers.map(column => (
                <th
                    {...column.getHeaderProps()}>
                    {column.render('Header')}
                </th>
                ))}
            </tr>
            ))}
        </thead>
        <tbody {...getTableBodyProps()}>
            {rows.map(row => {
            prepareRow(row)
            return (
                <tr {...row.getRowProps()}>
                {row.cells.map(cell => {
                    return (
                    <td
                        {...cell.getCellProps()} onClick={() => console.log(cell.value)} >
                        {cell.render('Cell')}
                    </td>
                    )
                })}
                </tr>
            )
            })}
        </tbody>
        </table>
about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

if you want to make the table editable > you can try with following example , its self explanatory in their official docs.. check if it can help

https://codesandbox.io/s/github/tannerlinsley/react-table/tree/v7/examples/editable-data?file=/src/App.js:6709-6714

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!