How to update a particular cell programmatically ?

[mcaquet]

Hello

How can I update a given cell programmatically please ?
For example, with the grid in the Quick Start section, how can I set title of row 1 to be Hello (instead of Demo) ?

I didn't find an answer to this simple question in the readme...

[beltrewilton]

Something like that, also see the README file.

...
import { useState } from "react";
import { textEditor } from 'react-data-grid';
.... 

const initialRows = [...] // all your rows

const [rows, setRows] = useState(initialRows);

const columns =  [
            { key: 'id', name: 'ID' }, // relate to rowKeyGetter
            { key: 'name_of_my_field', name: 'My editable field', editor: textEditor},
           .......
          ];
}); 


const rowChange = (new_rows, changes) => {
    console.log('new_rows: ', new_rows);
    console.log('changes: ', changes);
    setRows(...rows, new_rows);
};

const function rowKeyGetter = (row: Row) => {
  return row.id; // important: set with your unique ID
};

<DataGrid 
      columns={columns} 
      rows={rows} 
      onRowsChange={rowChange}
      rowKeyGetter={rowKeyGetter} 
/>

[mcaquet]

Thanks, but my question is not about cell editing, it is about how to refresh a cell after its data model has been updated, For example, a cell displays a price, and the underlying price value has changed => How to refresh the UI ?

Actually I found the answer. Let me know if you'd like me to post it.

[mani-cafs]

where do you find the answer..?

[vaibhav-systango]

@MatDev can you post the solution here please ?

[vaibhav-systango]

@beltrewilton

[msindal]

Looking for the same feature in my app, please post your answer here