DataGrid cells can be edited using in-place editors built into DataGrid. Editing can be initiated by double clicking on a cell or by starting typing the new value for the cell.
DataGrids are not editable by default. Editing can be enabled by setting editable property to True. Selection enablement is required for editing to work and it is set automatically to cell mode if it is none when editing is enabled.
Editing is initiated for the cursor cell. Cursor cell is the same as the selected cell if there is a single cell selected. If there are multiple cells / rectangles selected then cursor cell is the cell where the last selection rectangle was started.
Cursor can be moved in four directions by using the following keyboard keys.
Once done with editing a cell, cursor can be moved to next cell based on the keyboard hit following the rules above.
from ipydatagrid import DataGrid
from json import load
import pandas as pd
with open("./cars.json") as fobj:
data = load(fobj)
df = pd.DataFrame(data["data"]).drop("index", axis=1)
datagrid = DataGrid(df, editable=True, layout={"height": "200px"})
datagrid
All grid views are updated simultaneously to reflect cell edit changes.
datagrid
# keep track of changed cells
changed_cells = {}
def create_cell_key(cell):
return "{row}:{column}".format(row=cell["row"], column=cell["column_index"])
def track_changed_cell(cell):
key = create_cell_key(cell)
changed_cells[key] = cell
Changes to cell values can be tracked by subscribing to on_cell_change event as below.
def on_cell_changed(cell):
track_changed_cell(cell)
print(
"Cell at primary key {row} and column '{column}'({column_index}) changed to {value}".format(
row=cell["row"],
column=cell["column"],
column_index=cell["column_index"],
value=cell["value"],
)
)
datagrid.on_cell_change(on_cell_changed)
A cell's value can also be changed programmatically by using the DataGrid methods set_cell_value and set_cell_value_by_index
datagrid.set_cell_value("Cylinders", 2, 12)
Whether new cell values are entered using UI or programmatically, both the DataGrid cell rendering and the underlying python data are updated.
datagrid.data.iloc[2]["Cylinders"]
datagrid.set_cell_value_by_index("Horsepower", 3, 169)
datagrid.data.iloc[3]["Origin"]
def select_all_changed_cells():
datagrid.clear_selection()
for cell in changed_cells.values():
datagrid.select(cell["row"], cell["column_index"])
return datagrid.selected_cells
Show all cells changed using UI or programmatically by selecting them.
select_all_changed_cells()
Setting an entire row at once is also possible.
datagrid.set_row_value(0, [260, "USA", 10, "Very fast car", "", 0, "1999-01-01", 0, 0, 0])