title: Shared viewmodel between two Views in WPF MVVM pattern
body: <p>I'm trying to find a technique to show modal views from within other views but I am having problems. Here's a simple example of what i'm trying to do:</p>
  
  <p><strong>Shared ViewModel</strong></p>
  
  <pre><code>class ClientesViewModel : Screen
  {
      private bool _deleteconfirmvisible;
      public bool DeleteConfirmVisible
      {
          get { return _deleteconfirmvisible; }
          set
          {
              _deleteconfirmvisible = value;
              NotifyOfPropertyChange("DeleteConfirmVisible");
          }
      }
  
      public void ShowDeleteConfirm()
      {
          this.DeleteConfirmVisible = true;
      }
  
      public ModalViewModel ModalDelete
      {
          get { return new ModalViewModel(); }            
      }
  
      public void ConfirmDelete()
      {
          //Actually delete the record
          //WCFService.DeleteRecord(Record)
      }
  }
  </code></pre>
  
  <p><strong>First View</strong></p>
  
  <pre><code>&lt;UserControl x:Class="Ohmio.Client.ClientesView"
               xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
               xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
               xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
               xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
               xmlns:mahapps="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
               xmlns:local="clr-namespace:Ohmio.Client"   
               mc:Ignorable="d" 
               d:DesignHeight="364" d:DesignWidth="792"&gt;
  
      &lt;UserControl.Resources&gt;
          &lt;DataTemplate DataType="{x:Type local:ModalViewModel}"&gt;
              &lt;local:ModalView/&gt;
          &lt;/DataTemplate&gt;
      &lt;/UserControl.Resources&gt;
      &lt;local:ModalContentPresenter DataContext="{Binding}" IsModal="{Binding DeleteConfirmVisible}" Grid.ColumnSpan="5" Grid.RowSpan="4" ModalContent="{Binding Path=ModalDelete}"&gt;
          &lt;Grid&gt;        
              &lt;Button x:Name="ShowDeleteConfirm" Margin="5" Grid.Column="2" Content="Delete Record"/&gt;        
          &lt;/Grid&gt;
      &lt;/local:ModalContentPresenter&gt;
  &lt;/UserControl&gt;
  </code></pre>
  
  <p><strong>Second View (Modal content)</strong></p>
  
  <pre><code>&lt;UserControl x:Class="Ohmio.Client.ModalView"
               xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
               xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
               xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
               xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
               xmlns:local="clr-namespace:Ohmio.Client"   
               mc:Ignorable="d" Height="145" Width="476"&gt;
      &lt;Grid&gt;        
          &lt;Grid.ColumnDefinitions&gt;
              &lt;ColumnDefinition Width="*"&gt;&lt;/ColumnDefinition&gt;
              &lt;ColumnDefinition Width="*"&gt;&lt;/ColumnDefinition&gt;            
          &lt;/Grid.ColumnDefinitions&gt;
          &lt;Grid.RowDefinitions&gt;
              &lt;RowDefinition Height="*"&gt;&lt;/RowDefinition&gt;
              &lt;RowDefinition Height="*"&gt;&lt;/RowDefinition&gt;
              &lt;RowDefinition Height="50"&gt;&lt;/RowDefinition&gt;
          &lt;/Grid.RowDefinitions&gt;        
          &lt;Label Content="Are you sure you want to delete this record?" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Center"&gt;&lt;/Label&gt;
          &lt;Button x:Name="ConfirmDelete" IsDefault="True" Grid.Row="2" Content="Aceptar" Margin="10"&gt;&lt;/Button&gt;
          &lt;Button x:Name="TryClose" IsCancel="True"  Grid.Row="2" Grid.Column="1" Content="Cancelar" Margin="10"&gt;&lt;/Button&gt;        
      &lt;/Grid&gt;        
  &lt;/UserControl&gt;
  </code></pre>
  
  <p><strong>ModalViewModel</strong></p>
  
  <pre><code>class ModalViewModel : Screen
  {        
      public ModalViewModel()
      {
  
      }        
  }
  </code></pre>
  
  <p>So the basic idea is to have two views that share the same viewmodel. This viewmodel has properties for showing the modal content and deleting the record.</p>
  
  <p>The problema here is that <code>ConfirmDelete</code> method is never called.I guess the problem is that the child views <code>DataContext</code> is different from parent view. So How can I Solve this?</p>
  
  <p>Thanks!</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>Forgot to mention, i'm using Caliburn.Micro</p>
  
  <p><strong>EDIT 2</strong></p>
  
  <p>I follow Rachel suggest and divide the viewmodel. Still the problem pesist. Here is how my code looks like now:</p>
  
  <p><strong>TestViewModel</strong></p>
  
  <pre><code>class TestViewModel :Screen
      {
          private bool _deleteconfirmvisible;
          TestModalViewModel _modaldelete;
  
          public TestViewModel()
          {
              _modaldelete = new TestModalViewModel();
          }
          public bool DeleteConfirmVisible
          {
              get { return _deleteconfirmvisible; }
              set
              {
                  _deleteconfirmvisible = value;
                  NotifyOfPropertyChange("DeleteConfirmVisible");
              }
          }
  
          public void ShowDeleteConfirm()
          {
              this.DeleteConfirmVisible = true;
          }
  
          public TestModalViewModel ModalDelete
          {
              get { return _modaldelete; }
          }
      }
  </code></pre>
  
  <p><strong>TestView</strong></p>
  
  <pre><code>&lt;UserControl x:Class="Ohmio.Client.TestView"
               xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
               xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
               xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
               xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
               xmlns:mahapps="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
               xmlns:local="clr-namespace:Ohmio.Client"   
               mc:Ignorable="d" 
               d:DesignHeight="364" d:DesignWidth="792"&gt;
      &lt;UserControl.Resources&gt;
          &lt;DataTemplate DataType="{x:Type local:TestModalViewModel}"&gt;
              &lt;local:TestModalView/&gt;
          &lt;/DataTemplate&gt;
      &lt;/UserControl.Resources&gt;    
          &lt;Grid&gt;
              &lt;Grid.RowDefinitions&gt;
                  &lt;RowDefinition Height="*"&gt;&lt;/RowDefinition&gt;
                  &lt;RowDefinition Height="40"&gt;&lt;/RowDefinition&gt;
              &lt;/Grid.RowDefinitions&gt;
          &lt;ContentPresenter Content="{Binding Path=ModalDelete}"&gt;&lt;/ContentPresenter&gt;
          &lt;Button x:Name="ShowDeleteConfirm" Margin="5" Grid.Row="1" Content="Delete Record"/&gt;
          &lt;/Grid&gt;    
  &lt;/UserControl&gt;
  </code></pre>
  
  <p><strong>TestModalViewModel</strong></p>
  
  <pre><code>class TestModalViewModel : Screen
      {
          private Boolean _result;
  
          public TestModalViewModel()
          {
              _result = false;
          }        
  
          public void ConfirmAction()
          {
              _result = true;
              TryClose();
          }        
  
          public bool Result
          {
              get { return _result; }            
          }
      }    
  </code></pre>
  
  <p><strong>TestModalView</strong></p>
  
  <pre><code>&lt;UserControl x:Class="Ohmio.Client.TestModalView"
               xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
               xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
               xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
               xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
               xmlns:local="clr-namespace:Ohmio.Client"   
               mc:Ignorable="d" Height="145" Width="476"&gt;
      &lt;Grid&gt;
          &lt;Grid.ColumnDefinitions&gt;
              &lt;ColumnDefinition Width="*"&gt;&lt;/ColumnDefinition&gt;
              &lt;ColumnDefinition Width="*"&gt;&lt;/ColumnDefinition&gt;
          &lt;/Grid.ColumnDefinitions&gt;
          &lt;Grid.RowDefinitions&gt;
              &lt;RowDefinition Height="50"&gt;&lt;/RowDefinition&gt;            
              &lt;RowDefinition Height="*"&gt;&lt;/RowDefinition&gt;
          &lt;/Grid.RowDefinitions&gt;
  
          &lt;Label Content="Are you sure you want to delete this record?" Grid.ColumnSpan="2" HorizontalAlignment="Center" VerticalAlignment="Center"&gt;&lt;/Label&gt;        
          &lt;Button x:Name="ConfirmAction" IsDefault="True" Grid.Row="2" Content="Aceptar" Margin="10"&gt;&lt;/Button&gt;
          &lt;Button x:Name="TryClose" IsCancel="True"  Grid.Row="2" Grid.Column="1" Content="Cancelar" Margin="10"&gt;&lt;/Button&gt;
      &lt;/Grid&gt;
  &lt;/UserControl&gt;
  </code></pre>
  
  <p>I change the ModalContentPresenter for and ContentPresenter, and the problema remains: ConfirmAction is never called, and i can't understand why. Can anyone tell me why?</p>
  
  <p><strong>EDIT 3</strong></p>
  
  <p>Snoop Result:</p>
  
  <p><img src="https://i.stack.imgur.com/gFciG.jpg" alt="Snoop Result"></p>