.NET MAUI DataGrid Editing
The Telerik UI for .NET MAUI DataGrid provides built-in editing capabilities, which allow users to modify the data presented in the Grid.
Depending on the DataGrid column data type, the DataGrid provides a relevant editor which allows users to edit the content upon double-clicking the desired cell.
Editing Properties
To enable editing in the DataGrid, define the UserEditMode property of the component. UserEditMode is of type Telerik.Maui.Controls.DataGrid.DataGridUserEditMode and accepts the following values:
-
None—(default on Mobile) Editing is disabled. -
Cell—(default on Desktop) Enables the editing option.
You can also independently disable editing for specific columns through the CanUserEdit property of the DataGridColumn class. For more details, refer to the topic about columns in the .NET MAUI DataGrid.
Column Editors
Each DataGrid column type provides different editor, so that the content can be edited in a convenient manner according to its value type.
The following table lists the integrated .NET MAUI control for editing the values inside the DataGrid columns:
| Column Type | Editor |
|---|---|
TextColumn |
Entry |
NumericalColumn |
RadNumericInput |
BooleanColumn |
CheckBox |
DateColumn |
RadDatePicker |
TimeColumn |
RadTimePicker |
PickerColumn |
RadComboBox |
TemplateColumn |
A custom editor by defining CellEditTemplate. |
Custom Editors
If the default editors do not suit the scenario you have, create a custom editor for each column by utilizing the CellEditTemplate property of the DataGridColumn. For detailed information on how the CellEditTemplate can be applied, refer to the article about the .NET MAUI DataGrid column cell templates.
Editing Commands
The DataGrid provides the following commands related to the editing functionality:
-
BeginEdit—Provides an entry point just before the editing begins. -
CancelEdit—Provides an entry point just before the editing is canceled. -
CommitEdit—Provides an entry point just before the editing is committed.
For detailed information on how to use any of the listed commands, go to the topic about the .NET MAUI DataGrid editing commands.
Styling
You can change the visual appearance of each editor through the CellEditorStyle property of the DataGridColumn. To the CellEditorStyle, apply a Microsoft.Maui.Controls.Style with a TargetType set to the corresponding to each column editor control.
The following snippet shows a CellEditorStyle applied to the DataGridTextColumn.
<telerik:DataGridTextColumn.CellEditorStyle>
<Style TargetType="telerik:RadEntry">
<Setter Property="FontAttributes" Value="Bold" />
<Setter Property="ReserveSpaceForErrorView" Value="False" />
<Setter Property="HorizontalTextAlignment" Value="Center" />
<Setter Property="Margin" Value="2" />
</Style>
</telerik:DataGridTextColumn.CellEditorStyle>
Additional Resources
- .NET MAUI DataGrid Product Page
- .NET MAUI DataGrid Forum Page
- Telerik .NET MAUI Blogs
- Telerik .NET MAUI Roadmap