How to update a cell value in the selected row of Flutter DataTable (SfDataGrid)?

In this article, we will show you how to update a cell value in the selected row of Flutter DataTable.

Initialize the SfDataGrid with the necessary properties. You can access the currently selected row using DataGridController.selectedRow. The row index is determined using DataGridSource.rows, which identifies the position of the selected row. The getCells() method returns a list of cells in the row, allowing you to update specific cells (e.g., ID and Name). After modifying a cell’s value, call the notifyDataSourceListeners method with the RowColumnIndex argument to specify the corresponding row and column index. This ensures that only the updated cell is refreshed in the DataGrid.

TextButton(
    onPressed: () {
    if (dataGridController.selectedRow != null) {
        final selectedRow = dataGridController.selectedRow!;
        final rowIndex =
            employeeDataSource._employeeData.indexOf(selectedRow);

        if (rowIndex >= 0) {
        final List<DataGridCell> cells =
            employeeDataSource._employeeData[rowIndex].getCells();

        // Find the index of the 'id' column in the row.
        final int colIndex =
            cells.indexWhere((cell) => cell.columnName == 'id');
        if (colIndex != -1) {
            employees[rowIndex].id = 100;
            employeeDataSource._employeeData[rowIndex]
                    .getCells()[colIndex] =
                const DataGridCell<int>(columnName: 'id', value: 100);
            employeeDataSource.updateDataGridSource(
                rowColumnIndex: RowColumnIndex(rowIndex, colIndex));
          }
        }
    }
    },
    child: const Text('Cell value')
),

You can download this example on GitHub.