|
|
|
|
|
|
|
|
|---|---|---|---|---|---|---|
| Nancy | Davolio | Sales Representative | Ms. | 12/8/1978 | 5/1/2005 | |
| Andrew | Fuller | Vice President, Sales | Dr. | 2/19/1965 | 8/14/1992 | |
| Janet | Leverling | Sales Representative | Ms. | 8/30/1985 | 4/1/2002 | |
| Margaret | Peacock | Sales Representative | Mrs. | 9/19/1973 | 5/3/1993 | |
| Steven | Buchanan | Sales Manager | Mr. | 3/4/1955 | 10/17/1993 | |
| Michael | Suyama | Sales Representative | Mr. | 7/2/1981 | 10/17/1999 | |
| Robert | King | Sales Representative | Mr. | 5/29/1960 | 1/2/1994 | |
| Laura | Callahan | Inside Sales Coordinator | Ms. | 1/9/1985 | 3/5/2004 | |
| Anne | Dodsworth | Sales Representative | Ms. | 1/27/1980 | 11/15/2004 | |
Data grid with 9 rows and 7 columns
The DevExpress Blazor Grid allows users to edit its data in the inline edit row. The control automatically generates and configures cell editors for individual columns based on associated data types. To enable this functionality, follow the steps below:
- Declare a DxGridCommandColumn object in the Columns template. This column displays predefined New, Edit, Save, Cancel, and Delete command buttons.
- Set the EditMode property to
EditRow. - Handle the following events to make any final data changes, check access permissions, post changes to the underlying data source, and reload Grid data:
- EditModelSaving — Fires when a user saves the edited row and validation passes.
- DataItemDeleting — Fires when a user confirms the delete operation in the delete confirmation dialog.
- If your data object has a primary key, assign it to the KeyFieldName or KeyFieldNames property. The Grid uses field values to compare and identify data items. If you do not specify these properties, the Grid uses the standard .NET value equality comparison to identify data items.
- (Optional) Handle the CustomizeEditModel event to initialize an edit model for new data rows.
For detailed information on how to enable data editing and use edit-related options, refer to the following help topic: Inline Edit Row in Blazor Grid.