WPF MVVM Light dynamic views and datagrids

Question

Okay I have a mildly complex piece of functionality here. I'd like to know A) If I am doing it properly. If not, what should I change? 2) If it is proper, what is the best solution to my problem?

I have a main window with a ListView of items. If I click one of these, the right hand Grid Column in this window should populate with a DataGrid with information on the item selected. If I click another item in the ListView, it should change to another DataGrid.

I have seen some ContentPresenter examples but I cannot get this to work, so I stripped it out and will show you the code I have so far. Right now, I only have one item setup, so I will stick with this Driver example.

DriverGrid.xaml

 <UserControl DataContext="{Binding AdminDriver, Source={StaticResource Locator}}">
     <Grid>

          <DataGrid>
               //stuff here for datagrid
          </DataGrid>

          <Button Content="Edit" Command="{Binding ShowEditWindow}" />
          <Button Content="Add"  Command="{Binding ShowAddWindow}"/>
     </Grid>
 </UserControl>

AdminDriver.cs (VM)

//Contains variables, and is the datacontext for the above usercontrol

AdminMain.xaml (view for all admin stuff)

//Contains a bunch of junk for the min admin screen which has the listview with the options in it.  If you require this piece of code, I can trim it down but I don't se currently see it's relevance.  The DataGrid belongs in this window, I'm assuming in a Content Presenter.  Here is the ListView that is in column 1 of 2.

 <ListView ItemsSource="{Binding AdminMenu}"
                          Name="AdminFields"
                          SelectionMode="Single">
                    <i:Interaction.Triggers>
                        <i:EventTrigger EventName="SelectionChanged">
                            <cmd:EventToCommand CommandParameter="{Binding SelectedItem, ElementName=AdminFields}" Command="{Binding registerSelected}"/>
                        </i:EventTrigger>
                    </i:Interaction.Triggers>
                    <ListView.ItemTemplate>
                        <ItemContainerTemplate>
                            <TextBlock Text="{Binding FieldName}"/>
                        </ItemContainerTemplate>
                    </ListView.ItemTemplate>
                </ListView>

Answer 1

I would take the binding of the DataContext out of the UserControl. This will allow you to use it in other spots if you ever find the need. Instead, just bind the DataContext where you are using it.

<view:YourUserControl DataContext="{Binding AdminDriver}" />

If you are looking to present different UserControls based upon which item is selected in the ListView, then you'll use a ContentPresenter. All the items in your ItemsSource will have the same base class or implement the same interface so that you can put them in the same ObservableCollection. I'll assume AdminDriver would be of that type/interface as well then.

You would set up some DataTemplates at the top of the Window that map the possible real types of the objects in your ItemsSource (AdminMenu) to the UserControl that would represent them.

<Window.Resource>
   <DataTemplate DataType="{x:Type model:TypeA}">
      <view:UserControlA />
   </DataTemplate>

   <DataTemplate DataType="{x:Type model:TypeB}">
      <view:UserControlB />
   </DataTemplate>
   //rinse and repeat
</Window.Resource>

Then you'll add a ContentPresenter to the Grid and bind it's DataContext to the AdminDriver property. The UserControl matching the actual type of the selected item as mapped in your DataTemplates will appear.

<ContentPresenter Content="{Binding AdminDriver}" />