[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Collapse]Windows 10 App Controls
  Prerequisites
 [Expand]Getting Started
 [Collapse]Controls
  [Expand]Navigation and Layout
  [Expand]Data Editors
  [Collapse]Data Grid
   [Collapse]Getting Started
     Lesson 1 - Binding to Data
     Lesson 2 - Displaying Summary Information
     Lesson 3 - Displaying Detail Page
   [Expand]Binding to Data
   [Expand]Data Management
   [Expand]Data Editing
   [Expand]Validation
   [Expand]Asynchronous Virtual Source
   [Expand]Data Scrolling
   [Expand]Visual Elements
   [Expand]Examples
  [Expand]Charts
  [Expand]Map Control
  [Expand]Gauges
  [Expand]PDF Viewer
  [Expand]Scheduler
   SVG Icon
   Context Menu
 [Expand]Themes and Color Schemes
  Localization
  Get More Help
 [Expand]API Reference
[Expand]Office File API
[Expand]Reporting
[Expand]Report and Dashboard Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Lesson 1 - Binding to Data

This document demonstrates how to create a GridControl and bind it to data.

Do the following:

  1. Run MS Visual Studio 2017.
  2. Create a new Windows Universal project. To do this, choose New Project on the File menu or press Ctrl+Shift+N, choose the Windows Universal template category, and then choose Blank App (XAML).

  3. Define data context:

  4. Switch to the MainPage.xaml file. Open the Visual Studio toolbox, locate the "DX.19.2: Data" tab, choose the GridControl toolbox item and drop it onto the window.

    Note

    Dropping the GridControl toolbox item onto the window will automatically add all the required references (DevExpress.Core and DevExpress.Data). To add the GridControl in code, reference these extensions manually.

  5. Right-click the GridControl and select Reset Layout - All.

  6. To bind the GridControl to data, use its DataControlBase.ItemsSource property. By default, the grid automatically creates columns for all fields in a data source.

  7. Run the application to see the result.

  8. To manually create columns, set the DataControlBase.AutoGenerateColumns property to false and add GridColumnBase objects to the GridControl.Columns collection.

  9. Run the application to see the result.

Expanded See Also

Is this topic helpful?​​​​​​​