Step 1: Fetch Data and Enable Scrolling

• Oct 12, 2020
• 3 minutes to read

In this step, you create a virtual source, fetch rows from the service, and enable scrolling in the GridControl.

Note

The Issues Service is used as an example of a data source in this tutorial.

Tip

Demos:

• Infinite Scrolling Source - Step 1
• Paged Source - Step 1

Fetch Data and Enable Scrolling

1. Add a GridControl with columns that correspond to the Issues Service‘s IssueData to your project’s window:

   XAML

   <dxg:GridControl x:Name="grid">
       <dxg:GridControl.Columns>
           <dxg:GridColumn FieldName="Subject" />
           <dxg:GridColumn FieldName="User" />
           <dxg:GridColumn FieldName="Created" />
           <dxg:GridColumn FieldName="Votes"  />
           <dxg:GridColumn FieldName="Priority" />
       </dxg:GridControl.Columns>            
   </dxg:GridControl>
   

2. Initialize a virtual source:

   • Create a virtual source (InfiniteAsyncSource in this tutorial).
   • Set the VirtualSourceBase.ElementType property to the type of rows retrieved from the source (IssueData for the Issues Service).
   C#

   public MainWindow() {
       InitializeComponent();
       var source = new InfiniteAsyncSource() {
           ElementType = typeof(IssueData)
       };
   }
   

Note

If your service returns untyped objects (for example, a service returns Json which is converted to a dynamic object), specify the VirtualSourceBase.CustomProperties property.

3. Dispose of the virtual source:

   • Handle the window’s Unloaded event.
   • Call the VirtualSourceBase.Dispose method.
   C#

   public MainWindow() {
       // ... 
       Unloaded += (o, e) => {
           source.Dispose();
       };    
   }
   

Note

If you do not dispose of a source, the thread in which the source responds to requests can slow down. You may not dispose of a source if the source’s lifetime coincides with the application’s lifetime.

4. Fetch rows from the data source:

   • Handle the InfiniteAsyncSource.FetchRows event.
   • Obtain data using the Issues Service‘s GetIssuesAsync method.
   • Create the FetchRowsResult class object and specify the FetchRowsAsyncEventArgs.Result property.
   C#

   public MainWindow() {
       // ...
       source.FetchRows += (o, e) => {
           e.Result = FetchRowsAsync(e);
       };
   }
   static async Task<FetchRowsResult> FetchRowsAsync(FetchRowsAsyncEventArgs e) {
       IssueSortOrder sortOrder = GetIssueSortOrder(e);
       IssueFilter filter = MakeIssueFilter(e.Filter);
       var take = e.Take ?? 30;
       var issues = await IssuesService.GetIssuesAsync(
           skip: e.Skip,
           take: take,
           sortOrder: sortOrder,
           filter: filter);
       return new FetchRowsResult(issues, hasMoreRows: issues.Length == take);
   }
   static IssueSortOrder GetIssueSortOrder(FetchRowsAsyncEventArgs e) {
       return IssueSortOrder.Default;
   }
   static IssueFilter MakeIssueFilter(CriteriaOperator filter) {
       return null;
   }
   

Tip

Refer to the Step 2: Enable Sorting topic to learn how to implement the GetIssueSortOrder method.

Refer to the Step 3: Enable Filtering topic to learn how to implement the MakeIssueFilter method.

Note

The FetchRowsEventArgsBase.Take property returns the number of rows that should be reloaded. Use this property to allow the InfiniteAsyncSource to retain a selected row and scroll position after refresh. The PagedAsyncSource automatically retains a selected row and scroll position.

If data in your source are changed frequently, you can retain the same selected row after refresh. Specify the VirtualSourceBase.KeyProperty property to make a virtual source find the selected row by a specific field.

5. Bind the GridControl to the virtual source by assigning the resulting virtual source’s instance to the DataControlBase.ItemsSource property:

   C#

   public MainWindow() {
       // ...
       grid.ItemsSource = source;
   }
   

Continue or Review

• To go to the next tutorial step, see Step 2: Enable Sorting.
• To return to the overview topic, see How to Use Virtual Sources.