Bind the WPF Data Grid to any Data Source with Virtual Sources

• Mar 07, 2023
• 4 minutes to read

Virtual Sources allow you to bind the GridControl to any data source, even if the total record count is unknown. The GridControl only requests top records or a certain page, and you can specify required data operations supported by a data source.

The image below shows the GridControl bound to a virtual source that fetches data from StackExchange:

Bind to any Data Source

You can connect the GridControl to any data source: REST Services, NoSQL Databases, Custom WCF Services, EntityFramework or any other ORM.

A 1-Click Solution for CRUD Web API Services with Role-based Access Control via EF Core & XPO

If you target .NET for your backend API, be sure to check out our free Web API Service and register your FREE copy today. The Solution Wizard scaffolds an OData v4 Web API Service (.NET 6+) with integrated authorization & CRUD operations powered by EF Core and our XPO ORM library. You can use OAuth2, JWT or custom authentication strategies alongside tools like Postman or Swagger (OpenAPI) for API testing. Among its numerous capabilities, our built-in Web API Service filters out secured server data based on permissions granted to users. Advanced/enterprise functions include audit trail, endpoints to download reports, file attachments, check validation, obtain localized captions, etc. To use the free Solution Wizard (which creates the Web API Service) run the Universal Component Installer from the DevExpress Download Manager.

Virtual Source Types

Infinite Source

The GridControl bound to InfiniteAsyncSource displays data with infinite scrolling:

View Example Run Demo

Paged Source

The GridControl bound to PagedAsyncSource displays data in pages:

View Example Run Demo

Minimum Requirement

A data source needs to expose an API to fetch portions of data consecutively (for example, Skip and Take or fetch a certain data page by page index). Total item count is not required; sorting, filtering, and summary calculation operations are optional.

Enable Features

The GridControl bound to a virtual source only requests the top records or a certain page. You can specify which data operations are allowed, for example, an end user can sort by columns A, C, and D, and the Search Panel can filter data by the StartsWith criteria.

You can control requests that the GridControl sends to a service or database. This prevents overloading the database with non-optimal queries. The GridControl automatically hides all UI elements for non-supported operations.

Refer to the Virtual Sources Limitations topic to learn more.

Workflow

Async virtual sources raise events in the UI Thread and use tasks to process data in parallel Working Threads. You should provide tasks to these events to obtain summaries, rows, etc. Then the UI Thread gets data you fetched.

1. (Optional step) The virtual source raises the InfiniteAsyncSource.GetTotalSummaries (or PagedAsyncSource.GetTotalSummaries) event. Handle this event and process summaries if you want to show them in the GridControl.
2. The virtual source raises the InfiniteAsyncSource.FetchRows (or PagedAsyncSource.FetchPage) event to get the first portion of data.
3. When end users navigate to the next page, the virtual source raises the InfiniteAsyncSource.FetchRows (or PagedAsyncSource.FetchPage) event to get the next portion of data.
4. (Optional step) When users apply a filter, the virtual source raises the InfiniteAsyncSource.GetUniqueValues (or PagedAsyncSource.GetUniqueValues) event to get unique values and show them in a drop-down filter.

MVVM Support

You can implement data operations for virtual sources at the ViewModel level without UI dependencies.

View Example: MVVM in InfiniteAsyncSource View Example: MVVM in PagedAsyncSource

View Example: Bind the WPF Data Grid to Data View Example: Implement CRUD Operations

Follow the steps below to configure a virtual source and support the MVVM pattern:

1. Assign an instance of the InfiniteAsyncSource or the PagedAsyncSource to the GridControl‘s ItemsSource property.

2. Bind the instance’s properties to commands specified in the ViewModel.

Property	Description
FetchRowsCommand	Gets or sets a command that allows you to fetch rows.
GetUniqueValuesCommand	Gets or sets a command that allows you to get unique values.
GetTotalSummariesCommand	Gets or sets a command that allows you to get total summaries.

XAML

<dxg:GridControl>
    <dxg:GridControl.ItemsSource>
        <dx:InfiniteAsyncSource ElementType="{x:Type local:IssueData}" 
                                FetchRowsCommand="{Binding FetchIssuesCommand}"
                                GetUniqueValuesCommand="{Binding GetUniqueValuesCommand}"
                                GetTotalSummariesCommand="{Binding GetTotalSummariesCommand}"/>
    </dxg:GridControl.ItemsSource>
    <!-- ... -->
</dxg:GridControl>

Read Tutorial: How to use virtual sources in an MVVM application