## Callback function

RealGrid provides various callback functions to handle user interaction and system events.

You can check the types of callback functions and calling methods below.

## Click

Callback to notify that a grid cell has been clicked

```js
gridView.onCellClicked = function (grid, clickData) {
    console.log("onCellClicked: " + JSON.stringify(clickData));
};
```

Callback to notify that a grid cell has been double-clicked

```js
gridView.onCellDblClicked = function (grid, clickData) {
    console.log("onCellDblClicked: " + JSON.stringify(clickData));
};
```

Callback to notify that an element in a grid cell has been clicked

```js
gridView.onCellItemClicked = function (grid, index, clickData) {
    console.log("onCellItemClicked: " + JSON.stringify(clickData));
    return true;
};
```

Callback to notify that the user has selected or deselected all by clicking the Header of the checkBar or entering checkAll true / false

```js
gridView.onItemAllChecked = function (grid, checked) {
    console.log("onItemAllChecked: " + checked);
};
```

A callback to notify that the user changed the check by clicking the checkbox of the checkBar or calling checkItem

```js
gridView.onItemChecked = function (grid, itemIndex, checked) {
    console.log("onItemChecked: " + checked + " at " + itemIndex);
};
```

A callback to notify that the user changed the check by clicking the checkbox of the checkBar or calling checkItem

```js
gridView.onItemsChecked = function (grid, items, checked) {
    console.log(
        "onItemChecked: " + items.join() + " are checked as " + checked
    );
};
```

Callback to notify that a button was clicked in [SearchCellEditor](https://docs.realgrid.com/refs/Interface/SearchCellEditor)

```js
gridView.onSearchCellButtonClick = function (grid, index, text) {
    console.log("onSearchCellButtonClick: " + " button was clicked!");
};
```

## Move

Callback to determine the change in the position of the grid's focus cell

```js
gridView.onCurrentChanging = function (grid, oldIndex, newIndex) {
    console.log(
        "grid.onCurrentChanging: " +
            "(" +
            oldIndex.itemIndex +
            ", " +
            oldIndex.column +
            ") => (" +
            newIndex.itemIndex +
            ", " +
            newIndex.column +
            ")"
    );
    // return false; If you do this, the location does not change.
};
```

Callback that notifies the change in the location of the grid's focus cell

```js
gridView.onCurrentChanged = function (grid, newIndex) {
    console.log(
        "grid.onCurrentChanged: " +
            "(" +
            newIndex.itemIndex +
            ", " +
            newIndex.column +
            ")"
    );
};
```

Callback that notifies the change in the location of the data row

```js
gridView.onCurrentRowChanged = function (grid, oldRow, newRow) {
    console.log(
        "grid.onCurrentRowChanged: " + "(" + oldRow + " => " + newRow + ")"
    );
};
```

Callback to notify that a data row has been moved

```js
dataProvider.onRowMoved = function (provider, row) {
    console.log("provider.onRowMoved: " + row + " to " + newRow);
};
```

Callback to determine the movement of a data row

```js
dataProvider.onRowMoving = function (provider, row, newRow) {
    console.log("provider.onRowMoving: " + row + " to " + newRow);
    return true;
};
```

Callback to notify that multiple data rows have been moved

```js
dataProvider.onRowsMoved = function (provider, row, count, newRow) {
    console.log("provider.onRowsMoved: " + count + " rows moved");
};
```

## Copy Paste

Callback to determine copying with control + c keys

```js
gridView.onCopy = function (grid, selection, event) {
    console.log("grid.onCopy");
};
```

Callback to determine pasting to grid

```js
gridView.onPaste = function (grid, index, event) {
    console.log("grid.Paste");
};
```

Callback to notify that pasting has been done to grid

```js
gridView.onPasted = function (grid) {
    console.log("grid.Pasted");
};
```

Callback to notify that pasting has been done to a grid cell

```js
gridView.onEditRowPasted = function (
    grid,
    itemIndex,
    row,
    fields,
    oldValues,
    newValues
) {
    console.log("grid.onEditRowPasted: {" + newValues.join() + "}");
};
```

Callback to notify that multiple rows have been pasted

```js
gridView.onRowsPasted = function (grid, items) {
    console.log("grid.onRowsPasted" + items);
};
```

## Add/Edit/Delete

A callback that notifies that editing is canceled when the user presses the ESCAPE key during editing or cancel() is called

```js
gridView.onEditCanceled = function (grid, index) {
    console.log(
        "grid.onEditCanceled driven, edit index=" + JSON.stringify(index)
    );
};
```

A callback that notifies that the value of an item has changed due to the user's key input, etc.

```js
gridView.onEditChange = function (grid, index, value) {
    console.log(
        "grid.onEditChange driven, " +
            index.column +
            " at " +
            index.dataRow +
            " was replaced by value: " +
            value
    );
};
```

Callback that determines whether user input is reflected in the cell

```js
gridView.onEditCommit = function (grid, index, oldValue, newValue) {
    console.log("grid.onEditCommit driven, " + oldValue + " => " + newValue);
};
```

Callback that notifies that the value changed by user input is reflected in the row

```js
gridView.onEditRowChanged = function (
    grid,
    itemIndex,
    dataRow,
    field,
    oldValue,
    newValue
) {
    var v = grid.getValue(itemIndex, field);
    console.log("grid.onEditRowChanged: " + oldValue + " => " + newValue);
};
```

A callback that has the cell's position and editing result when cell editing is complete

```js
gridView.onGetEditValue = function (grid, index, editResult) {
    console.log("grid.onGetEditValue: " + JSON.stringify(editResult));
};
```

A callback that notifies that a field value of an edit item being edited or added has been edited

```js
gridView.onCellEdited = function (grid, itemIndex, row, field) {
    console.log("grid.onCellEdited: " + itemIndex + ", " + field);
};
```

A callback when the user decides to cancel row editing

```js
gridView.onItemEditCancel = function (grid, itemIndex, state) {
    console.log("grid.onItemEditCancel: " + state);
    //return false; It is not canceled if you do this.
};
```

Callback to notify that the user has canceled editing a row

```js
gridView.onItemEditCanceled = function (grid, itemIndex, state) {
    console.log("grid.onItemEditCanceled: " + state);
};
```

A callback that determines whether to add a data row

```js
gridView.onRowInserting = function (grid, itemIndex, dataRow) {
    console.log("grid.onRowInserting: " + itemIndex);
    //To prevent addition, return a string message or boolean false.
    return null;
};
```

A callback that determines the actual deletion when the user presses Ctrl+Del or deletes with [deleteSelection()](https://docs.realgrid.com/refs/Class/GridBase#deleteselection)

```js
gridView.onRowsDeleting = function (grid, rows) {
    console.log("grid.onRowsDeleting: " + rows);
    //If a non-null value is returned, display the specified text and cancel the deletion.
    return null;
};
```

Callback to determine the display of the Editor opened by Cell

```js
gridView.onShowEditor = function (grid, index, props, attrs) {
    console.log("grid.onShowEditor: " + index.itemIndex + "," + index.column);
};
```

Callback to notify that editing is complete and the editor is hidden

```js
gridView.onHideEditor = function (grid, index) {
    console.log("grid.onHideEditor: " + index.itemIndex + "," + index.column);
};
```

Callback to notify that data has changed

```js
dataProvider.onDataChanged = function (provider) {
    console.log("provider.onDataChanged");
};
```

Callback to notify that multiple data rows have been restored

```js
dataProvider.onRestoreRows = function (provider, rows) {
    console.log("provider.onRestoreRows: " + rows.join(", "));
};
```

Callback to notify that the number of data rows has changed

```js
dataProvider.onRowCountChanged = function (provider, newCount) {
    console.log("provider.onRowCountChanged: " + newCount);
};
```

Callback to notify that a data row has been deleted

```js
dataProvider.onRowDeleted = function (provider, row) {
    console.log("provider.onRowDeleted: " + row);
};
```

Callback to determine when a data row is deleted

```js
dataProvider.onRowDeleting = function (provider, row) {
    console.log("provider.onRowDeleting: " + row);
    return true;
};
```

Callback to notify when a data row has been added

```js
dataProvider.onRowInserted = function (provider, row) {
    console.log("provider.onRowInserted");
};
```

Callback to determine when a data row is added

```js
dataProvider.onRowInserting = function (provider, row, values) {
    console.log("provider.onRowInserting: " + row);
    return true;
};
```

Callback to notify that multiple data rows have changed

```js
dataProvider.onRowListUpdated = function (provider, rows) {
    console.log("provider.onRowListUpdated: " + rows.join(", "));
};
```

Callback to notify that rows have been deleted

```js
dataProvider.onRowsDeleted = function (provider, rows) {
    console.log("provider.onRowsDeleted: " + rows.join(", "));
};
```

Callback to notify that multiple data rows have been added in bulk

```js
dataProvider.onRowsInserted = function (provider, row, count) {
    console.log("provider.onRowsInserted: " + count + " rows inserted!");
};
```

Callback to notify that row state has changed

```js
dataProvider.onRowStateChanged = function (provider, row) {
    console.log("provider.onRowStateChanged: " + row);
};
```

Callback to notify that multiple rows have changed state

```js
dataProvider.onRowStatesChanged = function (provider, rows) {
    console.log("provider.onRowStatesChanged: " + rows.join(","));
};
```

Callback to notify that all rows have been cleared state

```js
dataProvider.onRowStatesCleared = function (provider) {
    console.log("provider.onRowStatesCleared");
};
```

Callback to notify that multiple data rows have changed

```js
dataProvider.onRowsUpdated = function (provider, row, count) {
    console.log("provider.onRowsUpdated");
};
```

Callback to notify that a row has been modified

```js
dataProvider.onRowUpdated = function (provider, row) {
    console.log("provider.onRowUpdated: " + row);
};
```

Callback to determine row modification

```js
dataProvider.onRowUpdating = function (provider, row) {
    console.log("provider.onRowUpdating: " + row);
    return true;
};
```

Callback that notifies that the value of the data has changed

```js
dataProvider.onValueChanged = function (provider, row, field) {
    console.log(
        "provider.onValueChanged: " + row + " row, " + field + " fieldIndex"
    );
};
```

## Keyboard input callback

Callback that determines key input

```js
gridView.onKeyDown = function (grid, event) {
    console.log("You pressed... " + event);
};
```

Callback that notifies that a key is being pressed

```js
gridView.onKeypress = function (grid, event) {
    console.log("You are pressing... " + event);
};
```

Callback that notifies that a key has been pressed.

```js
gridView.onKeyUp = function (grid, event) {
    console.log("You pressed... " + event);
};
```

## Rendering Complete Event

```js
gridView.onDataLoadComplated = function (grid) {
    alert(
        "onDataLoadComplated event occurred. Row count: " +
            dataProvider.getRowCount()
    );
};
```
