In this short blog post we will present how to implement WPF application with Master-detail relation in Entity Framework by using MVVM pattern. We will start with creating the new Visual Studio 2010 WPF Application project, and add reference to MVVM Light Toolkit library, which you can find on http://mvvmlight.codeplex.com/.  The picture below shows the starting WPF project:

Now that we have starting project, we can add the new ADO.NET Entity Framework model with NorthWind SQL database. Map the only two tables Order and OrderDetails, after that we have the following situation. If you not familiar with this procedure, more details you can find on my previous post.

The next step in implementation will be creating the ModelView of the MainWindow. The ModelView will contain implementation of all logic of the Master-detail relation. To do that point with right-click on the project, select Add-Class of the context menu item and enter the name MainWindowViewModel. If you have full instatlation of the MVVM Light Toolkit you can use MVVM template specialized for creating ModelView class.

After we create file of the MainWindowViewModel, we have to implement class and add two properties MasterCollection, and DetailsCollection.

The Next source code listing shows implementation of the MainWindowViewModel. This is minimal code for work with master – details in Entity Framework.

using GalaSoft.MvvmLight;
using System.Windows.Data;

namespace WPF_EF_MasterDetailsDemo
{
   public class MainWindowViewModel:ViewModelBase
   {
      NorthwindEntities ctx = new NorthwindEntities();
      public MainWindowViewModel()
     {

     }
     private CollectionViewSource _entityMasterView;
     public CollectionViewSource EntityMasterView
     {
       get
       {
        if (_entityMasterView == null)
          GetMasterEntityCollection();
        return _entityMasterView;
       }
    }
    public CollectionViewSource _entityDetailsView;
    public CollectionViewSource EntityDetailsView
    {
     get
     {
      if (_entityDetailsView == null)
           GetMasterEntityCollection();
       return _entityDetailsView;
     }
   }
   private void GetMasterEntityCollection()
   {
       _entityDetailsView = new CollectionViewSource();
       _entityMasterView = new CollectionViewSource();
       _entityMasterView.Source = ctx.Orders;
       _entityMasterView.View.CurrentChanged += (x, y) =>
         {
           _entityDetailsView.Source =((Orders)_entityMasterView.View.CurrentItem).Order_Details;
         };
       _entityMasterView.View.Refresh();
   }
   }
}

After we implemented ViewModel, we have to put some GUI stuff on the MainWindow.xaml, so open the MainWindow.xaml, put two labels and two DataGrid controls in to Main Window. This looks line on the following picture:

The sample is so short that it can fit in to single image ;).

In the code-behind constructor create MainWindowViewModel and assign to Windows DataContext, and that’s it.

This post demonstrate one posible  implementation of the Master-detail relation in EF by using the MVVM pattern. The source code of this project you can find on SkyDrive.