Search
CRUD Operations

 Create, Read, Update, and Delete (CRUD) Operations

Creating records

Users can add new records to the grid's model interactively by typing in the new empty row, that is shown at the bottom of the list. When a cell's value is changed, the rowCreating event is raised, which allows you to cancel the operation or to initialize default values for the new row. A common task is to increment the value of the unique key field for the new record. You can use your custom function, generating unique values, or the ArrayModel's getMaxKey method, which returns the maximum value of its specified key field as determined by a data type dependent sorting function. The incremented value can then be set in the record's rowData, provided in the event arguments.

JavaScript  Copy Code

grid.rowCreating.addEventListener((sender, args) =>
{
    var maxIndex = sender.model.getMaxKey();
    args.rowData["index"] = ++maxIndex;
});

If the rowCreating event is not cancelled, the new record is added to the grid's model and the rowCreated event is raised.
Rows can be added programmatically by using the addRow method of the grid and passing the rowData as a parameter.

Updating records

Users can update records interactively by using the built-in inplace editing functionality of the grid. When a cell's value is changed, the rowUpdating event is raised, which allows you to cancel the operation or to change the input, by setting values in the newValues dictionary, provided in the event arguments. If the rowUpdating event is not cancelled, changes are applied to the grid's model and the rowUpdated event is raised.
 
If changes are applied programmatically to the grid's model, use the refresh method to repaint the grid's contents, or refreshRows to repaint only the affected rows.

Deleting records

Users can delete records interactively by clicking the "Delete row(s)" option in the row context menu. The rowDeleting event allows you to cancel the operation and the rowDeleted event is raised after the record is removed from the model. Rows can be deleted programmatically by using the removeRows method.

Accessing records by key

The keyField, provided in the ArrayModel's constructor can be used to access records independently of the current sorting. The getKeyRow method returns the row index of the row with the specified key. The getRowKey returns the key of the row at the specified index.