Databases
StackOverflow2013
Postsdbo
POWPF MVVM Linked Views
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POWPF MVVM Linked Views
    text
    copied!<p>I need some help regarding my first MVVM WPF application. I want to link two views on my main window. Here's the situation:</p> <p>I have for instance these two viewmodels:</p> <pre><code>- PersonDetailViewModel - PersonListViewModel </code></pre> <p>PersonListViewModel contains :<br> - an <code>ObservableCollection</code> of <code>PersonDetailViewModels</code> called People<br> - one <code>PersonDetailViewMode</code>l which is accessible through a public property called <code>"SelectedPerson"</code></p> <p>I also have created two views:<br> <code>PersonListView</code>, which lists all persons in a datagrid.<br> <code>PersonDetailView</code>, which is simply a bunch of labels and textboxes bound to the <code>viewmodel</code> <code>PersonDetailViewModel</code>.</p> <p>I want to use these two together on my MainWindow. But I have no idea how the make this work! Here's what I have so far:</p> <p>PersonListView.xaml</p> <pre><code>&lt;UserControl x:Class="DSS.View.PersonListView" ... xmlns:myViewModels="clr-namespace:DSS.ViewModel"&gt; &lt;UserControl.DataContext&gt; &lt;myViewModels:PersonListViewModel/&gt; &lt;/UserControl.DataContext&gt; &lt;Grid&gt; &lt;DataGrid x:Name="dgPeople" ItemsSource="{Binding People}" AutoGenerateColumns="False" IsReadOnly="True" ColumnWidth="*" SelectedItem="{Binding SelectedPerson}"&gt; &lt;DataGrid.Columns&gt; &lt;DataGridTextColumn Header="PersonId" Binding="{Binding PersonId}" Visibility="Hidden"/&gt; &lt;DataGridTextColumn Header="Firstname" Binding="{Binding Firstname}"/&gt; &lt;DataGridTextColumn Header="Lastname" Binding="{Binding Lastname}"/&gt; ... &lt;/DataGrid.Columns&gt; &lt;/DataGrid&gt; &lt;/Grid&gt; </code></pre> <p></p> <p>PersonDetailView.xaml:</p> <pre><code>&lt;UserControl x:Class="DSS_CV.View.PersonDetailView" ... xmlns:myViewModels="clr-namespace:DSS.ViewModel"&gt; &lt;UserControl.DataContext&gt; &lt;myViewModels:PersonDetailViewModel/&gt; &lt;/UserControl.DataContext&gt; &lt;Grid&gt; &lt;Grid.ColumnDefinitions&gt;... &lt;/Grid.ColumnDefinitions&gt; &lt;Grid.RowDefinitions&gt;...&lt;/Grid.RowDefinitions&gt; &lt;Label Grid.Row="0" Grid.Column="0"&gt;Firstname:&lt;/Label&gt; &lt;TextBox Grid.Row="0" Grid.Column="1" x:Name="txtFirstName" Text="{Binding Path=Firstname}"&gt;&lt;/TextBox&gt; &lt;Label Grid.Row="1" Grid.Column="0"&gt;Lastname:&lt;/Label&gt; &lt;TextBox Grid.Row="1" Grid.Column="1" x:Name="txtLastName" Text="{Binding Path=Lastname}"&gt;&lt;/TextBox&gt; &lt;Label Grid.Row="2" Grid.Column="0"&gt;Birthdate:&lt;/Label&gt; &lt;TextBox Grid.Row="2" Grid.Column="1" x:Name="txtBirtDate" Text="{Binding Path=DateOfBirth}"&gt;&lt;/TextBox&gt; ... &lt;WrapPanel Grid.Row="7" Grid.ColumnSpan="5"&gt; &lt;Button&gt;Update&lt;/Button&gt; &lt;Button&gt;Insert As New&lt;/Button&gt; &lt;/WrapPanel&gt; &lt;/Grid&gt; </code></pre> <p></p> <p>Now, I would like to combine/link these usercontrols in one window so they work together in a way that selecting a row from the datagrid allows to edit the details in the other usercontrol.</p> <p>MainWindow.xaml:</p> <pre><code>&lt;Window x:Class="DSS_CV.MainWindow" ... xmlns:myViews="clr-namespace:DSS_CV.View"&gt; &lt;Grid&gt; &lt;myViews:PersonListView x:Name="dgPersons" Grid.Row="0" Grid.Column="0"/&gt; &lt;myViews:PersonDetailView Grid.Row="1" Grid.Column="0" DataContext="{Binding dgPersons.SelectedPerson, Mode=TwoWay}"/&gt; &lt;/Grid&gt; &lt;/Window&gt; </code></pre> <p><code>INotifyPropertyChanged</code> is implemented everywhere in my classes and the selecting a different row in <code>PersonListView</code> updates its property <code>SelectedPerson</code> correctly. Now I do not see how I can bind the datacontext of <code>PersonDetailView</code> to that <code>SelectedPerson</code>. If anyone could help me.</p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload