Does anybody know how to prevent the delete key to empty the cell content on the react Material-UI Grid?
Today when you click on a cell and hit Delete it deletes its content. I'd like to prevent it from happening.
1 Answers
DataGrid will set the cell data to an empty string if you hit Delete or Backspace while not in edit mode. If you don't like that behavior, you can disable it by attaching a keydown handler in the parent element in capture phase and call stopPropagation():
<div
onKeyDownCapture={(e) => {
if (e.key === "Backspace" || e.key === "Delete") {
e.stopPropagation();
}
}}
style={{ height: 400, width: "100%" }}
>
<DataGrid rows={rows} columns={columns} />
</div>
Live Demo
Related