jump to navigation

Create a master details application with WPF and the Entity framework November 26, 2010

Posted by fofo in general .net, Visual Studio 2010, WPF.
Tags: ,

I have been studying WPF for some time now and I am impressed with its extensive API and the incredible-stunning applications that one can build.

In this post I would like to show you how to create a WPF application that will fetch data from a database. Then I will enhance the simple application by creating a master details form. I will demonstrate all these with a hands on, step by step example. I will do all that without writing a single line of code.

My favourite data access technology is Entity framework and I am going to use EF to fetch data from the database.

I am going to use the Pubs database. You can download the installation scripts of the Pubs database from here.

I am going to use Visual Studio 2010 and C# as the development language. So here it is.

  1. Fire up Visual Studio 2010. Create a new project and choose “Wpf Application” from the available templates. Save your project with a name that you want in the desired location.
  2. Add new item in your WPF project. From the available items choose “Ado.Net Entity Data Model” name your model pubs.edmx and click Add. In the Entity Data Model wizard click generate from database and click Next. Create a new connection and choose the SQL Server instance that the Pubs database is attached to. Then click OK to close the  Connections window and return to the Entity Data model wizard window. Click Next and choose from the “Choose your Database Objects” window all the tables. Then click Finish.
  3. Go to Data->Show Data Sources option and click Show Data Sources option. You will see immediately all the classes availablee to use in my application. That is awesome. Drag and drop the Publishers class on the MainWindow.xaml file.

Now let’s go and have a look at the XAML code generated. We notice that we have a DataGrid control.Some of the xaml code generated is show in the snippet below.

<Window.Resources>         <CollectionViewSource x:Key=”publishersViewSource” d:DesignSource=”{d:DesignInstance my:publisher, CreateList=True}” />     </Window.Resources>     <Grid DataContext=”{StaticResource publishersViewSource}”>         <DataGrid AutoGenerateColumns=”False” EnableRowVirtualization=”True” Height=”125″ HorizontalAlignment=”Left” ItemsSource=”{Binding}” Margin=”12,12,0,0″ Name=”publishersDataGrid” RowDetailsVisibilityMode=”VisibleWhenSelected” VerticalAlignment=”Top” Width=”479″>             <DataGrid.Columns>                 <DataGridTextColumn x:Name=”pub_idColumn” Binding=”{Binding Path=pub_id}” Header=”pub id” Width=”SizeToHeader” />                 <DataGridTextColumn x:Name=”pub_nameColumn” Binding=”{Binding Path=pub_name}” Header=”pub name” Width=”SizeToHeader” />                 <DataGridTextColumn x:Name=”cityColumn” Binding=”{Binding Path=city}” Header=”city” Width=”SizeToHeader” />                 <DataGridTextColumn x:Name=”stateColumn” Binding=”{Binding Path=state}” Header=”state” Width=”SizeToHeader” />                 <DataGridTextColumn x:Name=”countryColumn” Binding=”{Binding Path=country}” Header=”country” Width=”SizeToHeader” />             </DataGrid.Columns>         </DataGrid>     </Grid>

We notice the CollectionViewSource which is our binding source to the underlying data.Let’s see some of the code that it is generated from Visual Studio for us in the code behind file.

 private void Window_Loaded(object sender, RoutedEventArgs e)

WpfMasterDetailEF.pubsEntities pubsEntities = new WpfMasterDetailEF.pubsEntities();
 // Load data into publishers. You can modify this code as needed.
System.Windows.Data.CollectionViewSource publishersViewSource = ((System.Windows.Data.CollectionViewSource)(this.FindResource("publishersViewSource")));
System.Data.Objects.ObjectQuery<WpfMasterDetailEF.publisher> publishersQuery = this.GetpublishersQuery(pubsEntities);
publishersViewSource.Source = publishersQuery.Execute(System.Data.Objects.MergeOption.AppendOnly);

4) Run your application and you will see the data in your application.That is pretty cool and I did not have to write a single line of code.

5) Now we will enhance this application by creating a master details application. From the Data->Show Data Sources drag and drop the employees entity to the MainWindow.xaml.

Have a look at the picture below.

6) Have a look at the generated code.

Note the second CollectionViewSource which is our binding source to the undelying data.

 <CollectionViewSource x:Key="publishersemployeesViewSource" Source="{Binding Path=employees, Source={StaticResource publishersViewSource}}" />

7) Run your application and see that we have a master/detail functionality out of the box. That is pretty cool.

Hope it helps.



1. Abhinav Bindra - March 2, 2012

This is one of the best answer so far, I have read online. Just useful information. Very well presented. I’ve found some other nice post over internet during searching time, which also explained very well about Ado.Net Entity Data Model. These posts helped me lot. Here I’m sharing that post links….



Thanks Everyone for your valuable and precious post.

2. Create a master-detail Windows Forms application with EF « DOT NET RULES - March 15, 2012

[…] Forms (Master – Details) application with C# and Entity Framework. Have a look in this post if you would like to see how to implement similar functionality with […]

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: