Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

If you have played with the ADO.NET Data Service, you can experience how quickly you can build RESTful Services using the Entity Model and then consume them as you would do it with WCF Services.  The ADO.NET Data Services offer more flexibility in terms of granular data URIs compared to REST enabling your WCF Service. 

To begin with, if you are REST enabling your WCF Service using the WCF REST Starter Kit, you can enable your service to basic level of REST features.  However, if you want to make this service as a drill down data URI mechanism to ensure each and every data item has a URI, you need to do a lot of plumbing work.  With ADO.NET Data Services, there is very little work that you would need to do, to create a truly RESTful Service.

To begin with, lets start creating an ADO.NET Data Service.   For this you would need Visual Studio 2008 SP1 (Download link) or the free Visual Web Developer Express Edition SP1 (you can download the same from http://www.microsoft.com/express/ ).  Also, for the purpose of this demo, I am using the Northwind sample database that can be downloaded from here

Building the Service Layer

1. Once you have the above, select “File – New Project” and chose “Web” in the “Project Types”   Chose “ASP.NET Web Application” and click Ok.  You can delete the “Default.aspx” that is created since this application would just be having a Service and no UI Forms. 

2. Select “Add – New Item” and under “Visual Studio Installed Templates” choose “ADO.NET Entity Data Model”.  Give the name say “NorthwindDataModel” and click “Add”

3. The Wizard opens up and in that select “Generate from database” .  Select “Next” and choose Northwind Database connection string if you have already used it or configure the connection string using “New Connection”.  Select “Yes, include the sensitive data in the connection string” and select “Next”

4. The Wizard lists Tables, Views & Stored Procedures.  Expand the “Tables” and select “Customers”, “Orders” and “Order Details” and click “Finish”

The Data Model preview shows the 3 tables in the designer view.  It is important to have a Data Model to expose the data as a RESTful Service and we just created an ADO.NET Entity Data Model using the Northwind Database. 

5. Build the solution to check if there are any errors.  If all is fine, you should get a “Build Succeeded”

6. Now select “Add – New Item” and choose “ADO.NET Data Service” and give that a name “NorthwindService.svc” and click “add”.

7. The CS file opens up and under the “InitializeService” method, you can find a few commented lines.  Uncomment the config.SetEntityAccessrule line and set its properties to look as follow:-

config.SetEntitySetAccessRule("*", EntitySetRights.All);

8. In the top next to public class NorthwindService : DataService, provide the name “NorthwindEntities” in the area “</ TO DO: put your data source class name here />”

9. Once you build the solution, you are ready with the Data Service.

10. You can run the solution to check the NorthWindService and it would open up the Atom Feed of your Data Model. 

11. The URL looks something similar to http://localhost:[portnumber]/SolutionName/NorthwindService.svc

12. You can append “Customers” or “Orders’ to view the respective records.  You can also filter it to something like “Customers('ALFKI')/CompanyName” to view specific DataItem.

As you can see the ADO.NET Data Service provides a truly RESTful Data Identification pattern with an unique URI for every data item, out of the box without writing code.  To achieve something of this sort, in an REST enabled WCF Service, you would have to write the method for filtering the customer name based on the customer id

 

Building the WPF Client

Now that we are done with building the Service.  The next step is to consume this service and create a master detail view of the records.  For this we would create a WPF Application. 

1. In the Visual Studio project, select “File – Add – New Project” and choose a “WPF Application” and click “Ok”

2. Select the WPF Application Project and Right Click and chose “Add Service Reference”.  The Service Reference dialog opens up.

3. Click on the “Discover” in the dialog and it would identify the “NorthwindService” we created above.  Click on the Service to expand and download the service information.

4. Click “Ok” to create the ServiceReference

5. Now, we are building a TreeView to show a Master – Detail View of the “Customers – Orders – Order Detials” so we will be using a WPF TreeView and Hierarchical Data Template for binding.  Paste the following XAML Code in the Window1.xaml file

<Window x:Class="WpfApplication1.Window1"
    xmlns="
http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="
http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Window1" Height="300" Width="300" Loaded="Window_Loaded">
    <Grid>
        <Grid.Resources>
            <DataTemplate x:Key="orderDetailsTemplate">
                <TextBlock Text="{Binding Path=UnitPrice}"/>
            </DataTemplate>

            <HierarchicalDataTemplate x:Key="orderTemplate" ItemsSource="{Binding Path=Order_Details}" ItemTemplate="{StaticResource orderDetailsTemplate}">
                <TextBlock Text="{Binding Path=OrderDate}" />
            </HierarchicalDataTemplate>

            <HierarchicalDataTemplate x:Key="customerTemplate" ItemsSource="{Binding Path=Orders}" ItemTemplate="{StaticResource orderTemplate}">
                <TextBlock Text="{Binding Path=CompanyName}" />
            </HierarchicalDataTemplate>
        </Grid.Resources>

        <TreeView  Name="CustomerTreeView" ItemTemplate="{StaticResource customerTemplate}" Background="#FF00BCFF" >
        </TreeView>

    </Grid>
</Window>

6. In the Window1.xaml.cs, add the following to the using statements

using WpfApplication1.ServiceReference1;
using System.Data.Services;
using System.ServiceModel;
using System.Data.Services.Client;

7. Add the following code within the Class definition

   DataServiceContext context = null;

        public Window1()
        {
            InitializeComponent();
            this.WindowState = WindowState.Maximized;  

        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
            context = new DataServiceContext(new Uri("
ADD THE SERVICE URL HERE"));
            CustomerTreeView.ItemsSource = context.Execute<Customers>(new Uri("Customers?$expand=Orders/Order_Details", UriKind.Relative));

        }

8. You are good to go and press f5 to run the service as well as the WPF Application.  If the WPF App doesn’t show up, make sure that it is set as the StartUp Project type.

9. Note that you can handle the TreeView_SelectedItemChanged event and add more functionality based on the Tree selection etc.,

What we saw here is a quick example of taking a relational database, exposing an entity model and building a IQueryable RESTful Service and then binding it to a WPF Client Application as a Master-Detail Tree View.  In the above sample, we used the System.Data.Services.Client namespace and created the DataContext object to execute the Data Service query.  Also, as you can see, the Data Service query uses the Expand operation to navigate to other related tables for getting the values, making it a truly IQueryable Data Service.

You can download the sample from the link here below.  NOTE THAT YOU NEED TO REGENERATE THE ENTITY MODEL. YOU CAN DELETE THE EXISTING ENTITY MODEL (.edmx file) AND GENERATE AGAIN SO THAT THE CONNECTION STRING IS MODIFIED ACCORDINGLY.

Cheers !!!

Print | posted on Monday, July 20, 2009 3:42 AM

Comments on this post

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
hi sir
i can accept jobs.
Left by sunil yadav on Jul 20, 2009 4:38 AM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
Thanks for posting the 2008 asp.net article. I follow your step an learn lot.
Left by shailesh on Jul 20, 2009 7:28 AM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
GOOOD JOB
Left by YERRA on Jul 21, 2009 4:00 AM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
Still learning of what u post, but it is a good post!
Left by Nyubi on Jul 25, 2009 10:46 PM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
ado.net can be so useful once you reign it in
Left by pocket projectors on Aug 04, 2009 5:49 AM

# # re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
With ADO.NET Data Services, there is very little work that you would need to do, to create a truly RESTful Service.
Left by Kuukausilinssit edullisesti on May 02, 2010 4:21 AM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
Thank you for posting this. Good Job.
Left by Cicada on May 17, 2010 9:28 AM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
You always have good article, thank's for sharing
Left by Nunung on Jul 13, 2010 8:21 PM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
This is such a helpful reading material for me, I’ve learned a lot of new things. Thanks for the great post!
Left by hire joomla designer on Jun 01, 2011 10:34 AM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
This is the type of blog I've been hoping to find: I wanted to thank you for this great read! HD Wallpaper background
Left by meddyjackson on Feb 29, 2012 7:00 PM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
Human civilization has led to environmental destruction and pollution significantly contributing to the ongoing mass extinction of other forms of life. Time to start pondering over dissertation writing http://www.essaylib.com criterias cohenside with.
Left by Fabricio on Jun 26, 2012 5:05 AM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
nice post you've describe here thanks
Left by how to get rid of a pimple on Sep 11, 2012 10:27 PM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
Thanks a lot for posting this,I was looking for that..
Left by joomla website design on Apr 19, 2013 2:15 PM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
Great post here. Thanks for sharing this information.

Divorce Lawyer in Singapore
Left by Archana on Dec 03, 2013 12:32 AM

# re: Binding ADO.NET Data Service to WPF Client – Building a Master Detail Tree View

Requesting Gravatar...
It is very interesting fact that MySQL is a database system used on the web and free to download and use. MySQL is developed, distributed, and supported by Oracle Corporation. PHP combined with MySQL are cross-platform (you can develop in Windows and serve on a Unix platform). dissertation writing services
Left by Josef Great on Mar 23, 2015 6:00 PM

Your comment:

 (will show your gravatar)