DataBind Outlook Data to the DevExpress Data Grid

Jerod Johnson
Jerod Johnson
Director, Technology Evangelism
Use the CData API Driver for ADO.NET with the DevExpress Windows Forms and Web controls to provide Outlook data to a chart.

The CData API Driver for ADO.NET incorporates conventional ADO.NET data access components compatible with third-party controls. You can adhere to the standard ADO.NET data binding procedures to establish two-way access to real-time data through UI controls. This article will demonstrate the utilization of CData components for data binding with DevExpress UI Controls (Windows Forms and Web controls), specifically binding to a chart that visualizes live data.

Using OAuth Authentication

Microsoft Graph API uses OAuth 2.0 for authentication. You must register an application in the Microsoft Azure Portal to obtain OAuth credentials (Client ID and Client Secret).

Obtaining OAuth Credentials

  1. Log in to the Azure Portal.
  2. Navigate to Azure Active Directory > App registrations.
  3. Click New registration to create a new application.
  4. Enter an application name and select the appropriate account types.
  5. Set the Redirect URI to your application's callback URL (e.g., http://localhost:33333 for desktop apps).
  6. Click Register to create the application.
  7. On the application overview page, copy the Application (client) ID - this is your OAuthClientId.
  8. Navigate to Certificates & secrets and create a new client secret.
  9. Copy the client secret value - this is your OAuthClientSecret.
  10. Navigate to API permissions and add the required Microsoft Graph API permissions:
    • Mail.Read - For accessing email messages
    • Contacts.Read - For accessing contacts
    • Calendars.Read - For accessing calendar events
    • Tasks.Read - For accessing To Do tasks
    • offline_access - For obtaining refresh tokens
  11. Click Grant admin consent to grant these permissions.

Connecting with OAuth

After setting the following connection properties, you are ready to connect:

  • AuthScheme: Set this to OAuth.
  • InitiateOAuth: Set this to GETANDREFRESH. The CData API Profile for Outlook will automatically walk through the OAuth process in order to obtain the access token.
  • OAuthClientId: Set this to the Application (client) ID from Azure Portal.
  • OAuthClientSecret: Set this to the client secret value from Azure Portal.
  • TenantId: Set this to your Azure AD tenant identifier (GUID or domain name like 'contoso.onmicrosoft.com').
  • CallbackURL: Set this to the Redirect URI you specified in your app registration (e.g., http://localhost:33333 for desktop apps).

Example connection string

Profile=C:\profiles\Outlook.apip;AuthScheme=OAuth;InitiateOAuth=GETANDREFRESH;OAuthClientId=your_client_id;OAuthClientSecret=your_client_secret;TenantId=your_tenant_id;CallbackUrl=http://localhost:33333;

Windows Forms Controls

The code below shows how to populate a DevExpress chart with Outlook data. The APIDataAdapter binds to the Series property of the chart control. The Diagram property of the control defines the x- and y-axes as the column names.

using (APIConnection connection = new APIConnection(
"Profile=C:\profiles\Outlook.apip;AuthScheme=OAuth;InitiateOAuth=GETANDREFRESH;OAuthClientId=your_client_id;OAuthClientSecret=your_client_secret;TenantId=your_tenant_id;CallbackUrl=http://localhost:33333;")) {
  APIDataAdapter dataAdapter = new APIDataAdapter(
  "SELECT ,  FROM CalendarGroupCalendars WHERE CalendarGroupId = 'group_id'", connection);
  
  DataTable table = new DataTable();
  dataAdapter.Fill(table);
  DevExpress.XtraCharts.Series series = new DevExpress.XtraCharts.Series();
  chartControl1.Series.Add(series);
  series.DataSource = table;
  series.ValueDataMembers.AddRange(new string[] { "" });
  series.ArgumentScaleType = DevExpress.XtraCharts.ScaleType.Qualitative;
  series.ArgumentDataMember = "";
  series.ValueScaleType = DevExpress.XtraCharts.ScaleType.Numerical;
  chartControl1.Legend.Visibility = DevExpress.Utils.DefaultBoolean.False;
  ((DevExpress.XtraCharts.SideBySideBarSeriesView)series.View).ColorEach = true;                              
}

Web Controls

The code below shows how to populate a DevExpress Web control with Outlook data. The APIDataAdapter binds to the Series property of the chart; the Diagram property defines the x- and y-axes as the column names.

using DevExpress.XtraCharts;

using (APIConnection connection = new APIConnection(
"Profile=C:\profiles\Outlook.apip;AuthScheme=OAuth;InitiateOAuth=GETANDREFRESH;OAuthClientId=your_client_id;OAuthClientSecret=your_client_secret;TenantId=your_tenant_id;CallbackUrl=http://localhost:33333;"))
{
  APIDataAdapter APIDataAdapter1 = new APIDataAdapter("SELECT ,  FROM CalendarGroupCalendars WHERE CalendarGroupId = 'group_id'", connection);
  DataTable table = new DataTable();
  APIDataAdapter1.Fill(table);
  DevExpress.XtraCharts.Series series = new Series("Series1", ViewType.Bar);
  WebChartControl1.Series.Add(series);
  series.DataSource = table;
  series.ValueDataMembers.AddRange(new string[] { "" });
  series.ArgumentScaleType = ScaleType.Qualitative;
  series.ArgumentDataMember = "";
  series.ValueScaleType = ScaleType.Numerical;
  ((DevExpress.XtraCharts.SideBySideBarSeriesView)series.View).ColorEach = true;
}

Ready to get started?

Connect to live data from Outlook with the API Driver

Connect to Outlook