Question

I’m having an issue where on my listview, when I select an item, the row highlight and the value for the property does get set. But when I click on the button to show the second page, the listview isnt highlighted/selected from the previous. The property is null. The two listview on each page reference the same properties for itemsource and selecteditem. Can anyone help me on why second page doesnt trigger property?

MainWindow.xaml

    <UserControl.DataContext>
        <vm:MainViewModel />
    </UserControl.DataContext>

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="auto"></ColumnDefinition>
            <ColumnDefinition Width="5"></ColumnDefinition>
            <ColumnDefinition Width="auto"></ColumnDefinition>
            <ColumnDefinition Width="5"></ColumnDefinition>
            <ColumnDefinition Width="auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Button Name="btnPrevious" Content="&lt;" Grid.Column="0" Height="300" Click="btnPrevious_Click"></Button>
        <Grid Width="310" Height="300" Grid.Column="2">
            <Frame x:Name="UserControlContainer" NavigationUIVisibility="Hidden" Width="310" />
        </Grid>
        <Button Name="btnNext" Content="&gt;" Grid.Column="4" Height="300" Click="btnNext_Click"></Button>
    </Grid>

MainWindow.xaml.cs

public partial class MainWindow : UserControl
    {
        private FirstPage fPage;
        private SecondPage sPage;

        private static int oldIndex = 1;

        public FirstPage FPage
        {
            get
            {
                if (fPage == null)
                    fPage = new FirstPage();

                return fPage;
            }
            set
            {
                fPage = value;
            }
        }

        public SecondPage SPage
        {
            get
            {
                if (sPage == null)
                    sPage = new SecondPage();

                return sPage;
            }
            set
            {
                sPage = value;
            }
        }

        public MainWindow()
        {
            InitializeComponent();

            UserControlContainer.Source = new Uri("Views\\FirstPage.xaml", UriKind.Relative);
        }

        private void btnPrevious_Click(object sender, RoutedEventArgs e)
        {
            var content = UserControlContainer.Content as UserControl;

            var targetUserControl = this.FPage as UserControl;
            targetUserControl.DataContext = this.DataContext;

            this.UserControlContainer.NavigateToControl(targetUserControl, oldIndex, 2);

            oldIndex = 2;
        }

        private void btnNext_Click(object sender, RoutedEventArgs e)
        {
            var content = UserControlContainer.Content as UserControl;

            var targetUserControl = this.SPage as UserControl;
            targetUserControl.DataContext = this.DataContext;

            this.UserControlContainer.NavigateToControl(targetUserControl, oldIndex, 1);

            oldIndex = 1;
        }
    }

MainViewModel.cs

public class MainViewModel : INotifyPropertyChanged
{
    Dictionary<int, string> itemList;
    KeyValuePair<int, string>? selectedItemList = null;

    public event PropertyChangedEventHandler PropertyChanged;

    private void NotifyPropertyChanged(String PropertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, new PropertyChangedEventArgs(PropertyName));
        }
    }

    public Dictionary<int, string> ItemList
    {
        get
        {
            itemList = GetItemsList();
            return itemList;
        }
    }

    private Dictionary<int, string> GetItemsList()
    {
        var resultList = new Dictionary<int, string>();

        resultList.Add(1, "Item I");
        resultList.Add(2, "Item II");
        resultList.Add(3, "Item III");

        return resultList;
    }

    public KeyValuePair<int, string>? SelectedItemList
    {
        get 
        { 
            return selectedItemList; 
        }
        set
        {
            selectedItemList = value;
            NotifyPropertyChanged("SelectedNewPtLevel");
        }
    }
}

FirstPage.xaml

<UserControl.DataContext>
        <vm:MainViewModel />
    </UserControl.DataContext>

    <Grid>
        <ListView Name="lstFirst" HorizontalAlignment="Left"  
                    Height="auto" ItemsSource="{Binding Path=ItemList}" SelectedItem="{Binding Path=SelectedItemList}" 
                    FontSize="11" SelectionMode="Single" Width="310">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Style.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter Property="Background" Value="Yellow"></Setter>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.View>
                <GridView>
                    <GridView.ColumnHeaderContainerStyle>
                        <Style>
                            <Setter Property="FrameworkElement.Visibility" Value="Collapsed"/>
                        </Style>
                    </GridView.ColumnHeaderContainerStyle>
                    <GridViewColumn Width="69" DisplayMemberBinding="{Binding Key}"></GridViewColumn>
                    <GridViewColumn Width="109" DisplayMemberBinding="{Binding Value}"></GridViewColumn>
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>

SecondPage.xaml

<UserControl.DataContext>
        <vm:MainViewModel />
    </UserControl.DataContext>

    <Grid>
        <ListView Name="lstSecond" HorizontalAlignment="Left"
                    Height="auto" ItemsSource="{Binding Path=ItemList}" SelectedItem="{Binding Path=SelectedItemList}" 
                    FontSize="11" SelectionMode="Single" Width="310">
            <ListView.ItemContainerStyle>
                <Style TargetType="ListViewItem">
                    <Style.Triggers>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter Property="Background" Value="Pink"></Setter>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </ListView.ItemContainerStyle>
            <ListView.View>
                <GridView>
                    <GridView.ColumnHeaderContainerStyle>
                        <Style>
                            <Setter Property="FrameworkElement.Visibility" Value="Collapsed"/>
                        </Style>
                    </GridView.ColumnHeaderContainerStyle>
                    <GridViewColumn Width="69" DisplayMemberBinding="{Binding Key}"></GridViewColumn>
                    <GridViewColumn Width="109" DisplayMemberBinding="{Binding Value}"></GridViewColumn>
                </GridView>
            </ListView.View>
        </ListView>
    </Grid>

Answer 1

The problem is that, when you click to the second page, a new instance of the View Model class is getting instantiated. To get around this I would suggest binding the data context to a “Locator” class.

<UserControl DataContext="{Binding Source={StaticResource Locator},Path=Main}"
    ... />

(Here the Locator instance sits in the main Resources section of your application, as <vm:Locator x:Key=Locator />.)

The Locator class keeps track of a single instance of your model.

public class Locator
{
    private MainViewModel _model;

    public MainViewModel Main
    {
        get
        {
            if (_model == null) _model = new MainViewModel();
            return _model;
        }
    }
}