Load-More-.net-maui-datagrid

In this article, we will show you how to implement and customize the Load More experience in the Syncfusion .NET MAUI DataGrid (SfDataGrid). The sample wires a command that fetches additional records when the user scrolls to the bottom of the grid.

To better understand Load More, we recommend reviewing the official user guide: Load More in .NET MAUI DataGrid for deeper explanations and API details.

xaml

Below is a simplified version of XAML that demonstrates how the grid is declared and bound to data. The key parts for Load More are the grid name (so you can access it in code-behind), ItemsSource binding, and any columns you want to show.

<ContentPage.BindingContext>
    <local:OrderInfoRepository x:Name="viewModel" />
</ContentPage.BindingContext>

<syncfusion:SfDataGrid  x:Name="dataGrid" ColumnWidthMode="Fill"
                    ItemsSource="{Binding OrderInfoCollection}">
    <syncfusion:SfDataGrid.Columns>
        <syncfusion:DataGridNumericColumn HeaderText="Order ID" Format="0"
                                        MappingName="OrderID" />
        
        <syncfusion:DataGridTextColumn  HeaderText="Customer ID"
                                        MappingName="CustomerID" />
        
        <syncfusion:DataGridTextColumn  HeaderText="Customer"
                                        MappingName="Customer"/>

        <syncfusion:DataGridTextColumn  HeaderText="Ship City"
                                        MappingName="ShipCity" />

    </syncfusion:SfDataGrid.Columns>
</syncfusion:SfDataGrid>

C#

In the code-behind, you can enable Load More and assign a command that runs when the user reaches the bottom of the grid. A busy indicator is shown while records are being appended.

public partial class MainPage : ContentPage
{
    public MainPage()
    {
        InitializeComponent();
        dataGrid.AllowLoadMore = true;
        dataGrid.LoadMoreCommand = new Command(ExecuteLoadMoreCommand);
    }

    private async void ExecuteLoadMoreCommand()
    {
        this.dataGrid.IsBusy = true;
        await Task.Delay(new TimeSpan(0, 0, 2));
        viewModel.LoadMoreItems();
        this.dataGrid.IsBusy = false;
    }
}

How Load More works

• AllowLoadMore: When set to true, the grid monitors scroll position and triggers LoadMoreCommand when the end is reached.
• LoadMoreCommand: Execute code to fetch and add more items to the bound collection. In your sample, viewModel.LoadMoreItems() appends records to OrderInfoCollection.
• IsBusy: Toggling this property shows a loading indicator, giving users feedback while data is fetched.
• ItemsSource: Bind to a collection that supports adding new entries (for example, ObservableCollection) to reflect appended items in the UI without a full refresh.

Conclusion

I hope you enjoyed learning about how to use Load More in .NET MAUI DataGrid (SfDataGrid).

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

If you have any queries or require clarifications, please let us know in the comments below. 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!