Ready to get started?

Learn more about the CData ADO.NET Provider for Magento or download a free trial:

Download Now

DataBind Magento Data to the DevExpress Data Grid

Use the CData ADO.NET Provider for Magento with the DevExpress Windows Forms and Web controls to provide Magento data to a chart.

The CData ADO.NET Provider for Magento implements standard ADO.NET data access components that can be used with third-party controls. The standard ADO.NET process for databinding can be followed to enable bidirectional access to live data from UI controls. In this article we show how to use the CData components to databind to the DevExpress Windows Forms and Web controls; you will databind to a chart that displays current data.

Magento uses the OAuth 1 authentication standard. To connect to the Magento REST API, you will need to obtain values for the OAuthClientId, OAuthClientSecret, and CallbackURL connection properties by registering an app with your Magento system. See the "Getting Started" section in the help documentation for a guide to obtaining the OAuth values and connecting.

You will also need to provide the URL to your Magento system. The URL depends on whether you are using the Magento REST API as a customer or administrator.

  • Customer: To use Magento as a customer, make sure you have created a customer account in the Magento homepage. To do so, click Account -> Register. You can then set the URL connection property to the endpoint of your Magento system.

  • Administrator: To access Magento as an administrator, set CustomAdminPath instead. This value can be obtained in the Advanced settings in the Admin menu, which can be accessed by selecting System -> Configuration -> Advanced -> Admin -> Admin Base URL.

    If the Use Custom Admin Path setting on this page is set to YES, the value is inside the Custom Admin Path text box; otherwise, set the CustomAdminPath connection property to the default value, which is "admin".

Windows Forms Controls

The code below shows how to populate a DevExpress chart with Magento data. The MagentoDataAdapter 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 (MagentoConnection connection = new MagentoConnection( "OAuthClientId=MyConsumerKey;OAuthClientSecret=MyConsumerSecret;CallbackURL=http://127.0.0.1:33333;Url=https://mymagentohost.com;")) { MagentoDataAdapter dataAdapter = new MagentoDataAdapter( "SELECT Name, Price FROM Products", 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[] { "Price" }); series.ArgumentScaleType = DevExpress.XtraCharts.ScaleType.Qualitative; series.ArgumentDataMember = "Name"; 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 Magento data. The MagentoDataAdapter 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 (MagentoConnection connection = new MagentoConnection( "OAuthClientId=MyConsumerKey;OAuthClientSecret=MyConsumerSecret;CallbackURL=http://127.0.0.1:33333;Url=https://mymagentohost.com;")) { MagentoDataAdapter MagentoDataAdapter1 = new MagentoDataAdapter("SELECT Name, Price FROM Products", connection); DataTable table = new DataTable(); MagentoDataAdapter1.Fill(table); DevExpress.XtraCharts.Series series = new Series("Series1", ViewType.Bar); WebChartControl1.Series.Add(series); series.DataSource = table; series.ValueDataMembers.AddRange(new string[] { "Price" }); series.ArgumentScaleType = ScaleType.Qualitative; series.ArgumentDataMember = "Name"; series.ValueScaleType = ScaleType.Numerical; ((DevExpress.XtraCharts.SideBySideBarSeriesView)series.View).ColorEach = true; }
 
 
ダウンロード