Blazor DataGrid Example - External Form Editing
This sample shows how to edit a DataGrid using an external custom edit form. To edit a record, select the required row, make changes to the data, and then click Save.
Order ID | Customer ID | Freight | Order Date | Ship Country | Ship Name |
|---|
| 10001 | ALFKI | $2.30 | 5/15/1991 | Denmark | Simons bistro |
| 10002 | ANATR | $3.30 | 4/4/1990 | Brazil | Queen Cozinha |
| 10003 | ANTON | $4.30 | 11/30/1957 | Germany | Frankenversand |
| 10004 | BLONP | $5.30 | 10/22/1930 | Austria | Ernst Handel |
| 10005 | BOLID | $6.30 | 2/18/1953 | Switzerland | Hanari Carnes |
| 10006 | ALFKI | $4.60 | 5/15/1991 | Denmark | Simons bistro |
| 10007 | ANATR | $6.60 | 4/4/1990 | Brazil | Queen Cozinha |
| 10008 | ANTON | $8.60 | 11/30/1957 | Germany | Frankenversand |
| 10009 | BLONP | $10.60 | 10/22/1930 | Austria | Ernst Handel |
| 10010 | BOLID | $12.60 | 2/18/1953 | Switzerland | Hanari Carnes |
| 10011 | ALFKI | $6.90 | 5/15/1991 | Denmark | Simons bistro |
| 10012 | ANATR | $9.90 | 4/4/1990 | Brazil | Queen Cozinha |
The Blazor DataGrid allows you to perform CRUD operations using an external edit form via editing methods.
To edit grid records in this demo, external custom form editors are used. You can begin editing by selecting a row, and the currently selected row will be displayed on the external form, allowing you to change the row values and save the edited data to the datasource.
More information about the Custom edit form can be found in this documentation section.