# Report Sheet Data Entry Support

A description of the data entry support for SpreadJS ReportSheets, including the data entry methods available, with UI and code examples

## Content

ReportSheet supports data entry through the DataManager. Users need to configure the data source in DataManager and the [Data Entry settings](/spreadjs/docs/v18/features/reportsheet/templatesheet/set-data-entry-settings) of the TemplateSheet.
ReportSheet offers a set of Data Entry methods in the `ReportSheet` class to perform various operations with the report data.

* `addRecordAt()`: Add a record based on the specified cell.
* `deleteRecordAt()`: Delete a record based on the specified cell.
* `updateCellValue()`: Update the specified cell value with a new value.
* `submit()`: Submit the changes to the remote database based on the data entry setting through the DataManger.
    Note that the order of records saved in the database may be changed if multiple records are submitted in one submission.

You can use the following code samples to set data entry methods.

```
// Add record.
reportSheet.addRecordAt(1, 2);
// Update cell value.
reportSheet.updateCellValue(2, 2, 'test');
// Delete record.
reportSheet.deleteRecordAt(4, 5);
// Submit changes.
reportSheet.submit();
```

SpreadJS also allows you to add, delete, and submit data entry records using the **Add Record**, **Delete Record**, and **Submit** options available in the context menu in Designer.

![RS-DataEntry-contextmenu](https://cdn.mescius.io/document-site-files/images/ef9b66d1-0ae2-4e94-b8cb-f9f893aacc8d/RS-DataEntry-contextmenu.4c0781.png?width=300)

Additionally, ReportSheet allows customization of the dirty cell style in the data entry preview. If a cell value is modified in the preview, it will be displayed with the applied dirty style. The report sheet has the default dirty style as a red corner fold of the dirty cell. 

![RS-defaultDirtyCell](https://cdn.mescius.io/document-site-files/images/ef9b66d1-0ae2-4e94-b8cb-f9f893aacc8d/RS-defaultDirtyCell.9bfca6.png?width=850)

You can customize the dirty cell style using the `dirtyStyle` option of the `IReportOptions` interface.
The following code sample sets a red background to depict the dirty cell in the report.

```
// Create a style.
const style = new GC.Spread.Sheets.Style();
style.backColor = 'red';
reportSheet.options.dirtyStyle = style;
reportSheet.refresh();
```

The output of the above code will look like below.

![RS-customDirtyCell](https://cdn.mescius.io/document-site-files/images/ef9b66d1-0ae2-4e94-b8cb-f9f893aacc8d/RS-customDirtyCell.47bb15.png?width=850)

<br>