How to: Use DXGrid with RIA Services

• May 22, 2020
• 2 minutes to read

The DXGrid Control for Silverlight can be bound to data using a number of ways. One of the methods is to use the RIA Services of the Windows Communication Foundation to create a model and load data from a SQL Server database. In this example, an ADO.NET Entity Data Model is created and the DXGrid Control is bound to a local SQL Server Express Database.

NOTE

The Domain Service template that is used in this tutorial has been removed in Visual Studio 2013. It is recommended to use Visual Studio 2010 or Visual Stidio 2012 for this tutorial. After creating the DomainService class you can migrate your application to Visual Studio 2013.

Creating a Project

• Create a new Silverlight web application project.

• Enable .NET RIA Services and proceed.

  

• A new solution consists of two projects:

  • UseDXGridWithRIAServices - contains the Silverlight code;
  • UseDXGridWithRIAServices.Web - contains the ASP.NET web application code.

Accessing Data from a Database

• Select the UseDXGridWithRIAServices.Web project and add a new item:

  

• Select ADO.NET Entity Data Model:

  

• Choose model contents:

  

• Choose your data connection, select a table(s) and finish:

  

• The image below shows the result:

  

Creating a DomainService

A DomainService is a class that exposes entities and operations for a specific data domain.

• Rebuild the project. Select the UseDXGridWithRIAServices.Web project and add a new domain service:

  

• Select the Northwind model and expose the Product entity.

  

• Finally, rebuild the solution.

Connecting the Grid to Data

The following code shows how to display Products in a grid:

XAML

<UserControl x:Class="UseDXGridWithRIAServices.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xaml/grid"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">

    <Grid x:Name="LayoutRoot" Background="White">
        <dxg:GridControl Name="grid" AutoPopulateColumns="True"/>
    </Grid>
</UserControl>

C#

using System.Windows.Controls;
using System.ServiceModel.DomainServices.Client;
using UseDXGridWithRIAServices.Web;

namespace UseDXGridWithRIAServices {
    public partial class MainPage : UserControl {
        private ProductContext _productContext = new ProductContext();
        public MainPage() {
            InitializeComponent();
            LoadOperation<Products> loadOperation = _productContext.Load(_productContext.GetProductsQuery());
            grid.DataSource = loadOperation.Entities;
        }
    }
}

The image below shows the result.