Display corresponding content in textbox when title in the list box is selected.(MVVM WPF)

Question

I have created a database where I stored a "title" and "content" of the book. In the program, the title is stored in the listbox and when I populate the list I should be able to display the corresponding "content" in the textbox when the "title" in the list is clicked. I was able to do this in Windows Forms Application without any issues, but I am trying to implement this on WPF using the MVVM pattern. I am learning and hope to get some advice from you guys. Below is what I have so far.

XAML portion:

<Grid>
<ListBox x:Name="UserList" ItemsSource="{Binding UserEntry}" SelectedIndex="{Binding SelectedIndex}" HorizontalAlignment="Left" Height="323" Margin="18,16,0,0" VerticalAlignment="Top"
         Width="225" />
<TextBox x:Name="BookTextBox" Text="{Binding BookList, UpdateSourceTrigger=PropertyChanged}" HorizontalAlignment="Left" Height="374" Margin="258,16,0,0" TextWrapping="Wrap"
         VerticalAlignment="Top" Width="292" VerticalScrollBarVisibility="Auto"  />
<Button x:Name="NewButton" Content="New" Command="{Binding NewCommand}" HorizontalAlignment="Left"
        Margin="18,344,0,0" VerticalAlignment="Top" Width="75" Height="30" />
<Button x:Name="List" Content="List" Command="{Binding ListCommand}" IsEnabled="{Binding CanClose}" HorizontalAlignment="Left"
        Margin="93,344,0,0" VerticalAlignment="Top" Width="75" Height="30" />
<Button x:Name="Delete" Content="Delete" HorizontalAlignment="Left" Margin="168,344,0,0"
        VerticalAlignment="Top" Width="75" Height="30" />

View model

private BookContext Context;
        private readonly ObservableCollection<string> _userEntry = new ObservableCollection<string>();
        private string _selectedIndex;
        private string _content;
        private bool mystate = true;
        public ICommand NewCommand
        {
            get { return new DelegateCommand(OpenNewWindow); }
        }

        public ICommand ListCommand
        {
            get
            {
                return new DelegateCommand(ListEntry);

            }
            set { ListCommand.CanExecute(mystate); }

        }

        public IEnumerable<string> UserEntry
        {
            get { return _userEntry; }
        }
        public void OpenNewWindow()
        {
            MainWindow mainwin = new MainWindow();
            mainwin.Hide();
            Create create = new Create();
            mainwin.Content = create;
            mainwin.Show();
        }

        public void ListEntry()
        {

            Context = new BookContext();
            var query = from b in Context.BookModels
                orderby b.BookId
                select b;
            foreach (var q in query)
            {
                _userEntry.Add(q.Title);
            }



        }

        public string BookList
        {
            get { return _content; }
            set { _content = value; }
        }

        public string SelectedIndex
        {
            get { return _selectedIndex; }
            set
            {
                if (_selectedIndex == value)
                {
                    var query = from b in Context.BookModels
                        where b.Title == _selectedIndex
                        select b;
                    foreach (var q in query)
                    {
                        _content = q.Content;
                    }
                }
            }
        }


    }

I tried to use the SelectIndex way but did not work. I am able to populate the contents in the listbox but when I select any item on the list box, the corresponding content does not appear in the textbox. Please, advice me for any correction or if you need further information.

Answer 1

Try below code.

 <StackPanel>
        <ListBox ItemsSource="{Binding Books}" x:Name="ListBoxBooks" DisplayMemberPath="Title"></ListBox>
        <TextBox Text="{Binding ElementName=ListBoxBooks,Path=SelectedItem.Content}"></TextBox>
    </StackPanel>

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        this.DataContext = new BookViewModel();
    }
}

public class BookViewModel
{
    public List<BookModel> Books { get; set; }

    public BookViewModel()
    {
        Books = new List<BookModel>()
        {
            new BookModel() {Title = "Title 1", Content = "Content 1"},
            new BookModel() {Title = "Title 2", Content = "Content 2"},
            new BookModel() {Title = "Title 3", Content = "Content 3"},
            new BookModel() {Title = "Title 4", Content = "Content 4"},
            new BookModel() {Title = "Title 5", Content = "Content 5"},
            new BookModel() {Title = "Title 6", Content = "Content 6"},
            new BookModel() {Title = "Title 7", Content = "Content 6"},
        };
    }
}

public class BookModel
{
    public string Title { get; set; }
    public string Content { get; set; }
}