Editing and Validation in Blazor Grid

• Feb 21, 2024
• 2 minutes to read

DevExpress Blazor Grid supports multiple edit modes. Use any of these modes to allow users to create, modify, and delete grid rows. In all edit modes, the Grid component validates input data and displays errors if necessary.

Edit Cell

In EditCell mode, users can click a data cell to display its in-place editor. When focus moves to another row, the control validates pending user input and saves changes.

Read Tutorial: Cell Editing Run Demo: Edit Cell Run Demo: Edit Batch View Example: Enable Batch Data Editing with Entity Framework Core

Edit Forms

In the EditForm or PopupEditForm mode, the Grid displays an inline or pop-up edit form instead of the edited data row. Users can click command buttons to create, modify, and delete grid rows.

Read Tutorial: Edit Forms Run Demo: Edit Forms

Edit Row

In EditRow mode, the Grid component displays in-place editors in all data cells of the edited row. Users can click command buttons to create, modify, and delete grid rows.

Read Tutorial: Inline Edit Row Run Demo: Edit Row View Example: Inline Editing

Input Validation

The Grid component validates user input based on data annotation attributes defined in the edit model. Once validation is completed, the component marks editors with colored outlines or displays validation icons. Users can hover the mouse pointer over an error icon to display the corresponding error message within the tooltip.

Run Demo: Input Validation Read Tutorial: Validate User Input View Example: Custom Validation