How to end editing a cell when it becomes hidden from the visible region in .NET MAUI DataGrid?

By default, the editing cell in the .NET MAUI DataGrid remains in edit mode and cannot be committed when the respective cell hides from the scroll view’s visible area. This behavior can be addressed by utilizing the scroll view’s scrolled event. Please refer to the code example below.

XAML:

<syncfusion:SfDataGrid  ItemsSource="{Binding Employees}"
                     AutoGenerateColumnsMode="None"
                     AllowEditing="True"
                     NavigationMode="Cell"
                     SelectionMode="Single"
                     DefaultColumnWidth="155">
 <syncfusion:SfDataGrid.Columns>
     <syncfusion:DataGridTextColumn MappingName="EmployeeID"
                                    HeaderText="Employee ID" />
     <syncfusion:DataGridTextColumn MappingName="Name"
                                    HeaderText="Name" />
     <syncfusion:DataGridTextColumn MappingName="IDNumber"
                                    HeaderText="ID Number" />
 </syncfusion:SfDataGrid.Columns>

 <syncfusion:SfDataGrid.Behaviors>
     <behaviors:DataGridBehavior />
 </syncfusion:SfDataGrid.Behaviors>
 
</syncfusion:SfDataGrid> 

Behavior:

public class DataGridBehavior : Behavior<SfDataGrid>
{
 protected override void OnAttachedTo(SfDataGrid dataGrid)
 {
     dataGrid.GetVisualContainer().ScrollOwner.Scrolled += ScrollOwner_Scrolled;
     base.OnAttachedTo(dataGrid);
 }

 protected override void OnDetachingFrom(SfDataGrid dataGrid)
 {
     dataGrid.GetVisualContainer().ScrollOwner.Scrolled -= ScrollOwner_Scrolled;
     base.OnDetachingFrom(dataGrid);
 }

 private void ScrollOwner_Scrolled(object? sender, ScrolledEventArgs e)
 {
     SfDataGrid grid = (sender as DataGridScrollView).Parent as SfDataGrid;

     var visualContainer = grid.GetVisualContainer();
     var row = visualContainer.ScrollRows.GetVisibleLineAtLineIndex(grid.CurrentCell.RowIndex);

     if (row != null && row.Region == Syncfusion.Maui.GridCommon.ScrollAxis.ScrollAxisRegion.Header)
         return;

     var column = visualContainer.ScrollColumns.GetVisibleLineAtLineIndex(grid.CurrentCell.ColumnIndex);

     // Need to perform EndEdit only when current cell disappears from the view. 
     if ((row == null || column == null))
     {
         grid.EndEdit();
     }
 }
}

Download the complete sample from GitHub

Conclusion

I hope you enjoyed learning how to end editing a cell when it becomes hidden from the visible region in .NET MAUI DataGrid (SfDataGrid).

You can refer to our .NET MAUI DataGrid feature tour page to learn about its other groundbreaking feature representations. Explore our .NET MAUI DataGrid Documentation to understand how to present and manipulate data.
For current customers, check out our .NET MAUI components on the License and Downloads page. If you are new to Syncfusion®, try our 30-day free trial to explore our .NET MAUI DataGrid and other .NET MAUI components.

Please let us know in the comments section if you have any queries or require clarification. You can also contact us through our support forums, Direct-Trac or feedback portal, or the feedback portal. We are always happy to assist you!