Binding a listView to display data associated with it in another listView

Question

dear StackOverflow users. There's a task I'm given: I have a list of students that I get from JSON.

[
    {
        "Name":         "Grant",
        "Groupname":    "Group1"
    },
    {
        "Name":         "Tim",
        "Groupname":    "Group2"
    },
    {
        "Name":         "Spencer",
        "Groupname":    "Group3"
    }
    .....
]

Then I have two listBoxes: first for Groups, second for Students belonging to that group. The problem I cannot get to solve: displaying students of the currently selected group in listBox using Binding and DataContext. So I need help. Declarations of Student and Group:

public class Student
{
    public int Id { get; set; }
    public string Name { get; set; }
    public string Groupname { get; set; }
}

public class Group
{
    public string Name { get; set; }
    public int Count { get; set; } // how many students are in this group

    public List<Student> Students = new List<Student>();

    public Group()
    {
    }

    public Group(string name, int count)
    {
        this.Name = name;
        this.Count = count;
    }
}

The code below uses List of groups and each group has a list of students. And at this moment I'm stuck.

public MainWindow()
{
    List<Group> groups = new List<Group>();
    
    // I excluded json deserialization and Lists initialization code...

    InitializeComponent();

    foreach (var x in groups)
    {
        GroupsView.Items.Add(x.Name);

        foreach (var y in x.Students)
        {
            StudentsView.Items.Add(y);
        }
    }
}

The listBoxes in XAML

<ListBox Name="GroupsView" HorizontalAlignment="Left" Height="172" Margin="48,0,0,0" VerticalAlignment="Center" Width="206"/>

<ListBox Name="StudentsView"  HorizontalAlignment="Left" Height="172" Margin="306,0,0,0" VerticalAlignment="Center" Width="364">
    <ListBox.ItemTemplate>
        <DataTemplate>
            <TextBlock>
                <Run Text="{Binding Path=Id}"></Run>
                <Run Text="{Binding Path=Name}"></Run>
            </TextBlock>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

I know it has something to do with XAML but I suddenly got this problem and need to finish it quickly. And last time I used C# in 2017 so please excuse my silly question. If anyone could help, I'd be so grateful

Answer 1

1. First, you need to implement INotifyPropertyChanged for MainWindow, so you will have OnPropertyChanged();

public class MainWindow : INotifyPropertyChanged

See here, https://learn.microsoft.com/en-us/dotnet/desktop/wpf/data/how-to-implement-property-change-notification?view=netframeworkdesktop-4.8

And in the constructor, add: this.DataContext = this;

2. Then add following properties:

private List<Group> _groups;

public List<Group> Groups
{
    get { return _groups; }
    set { _groups = value; OnPropertyChanged(); }
}

private Group _selectedGroup;


public Group SelectedGroup
{
    get { return _selectedGroup; }
    set 
    { 
        _selectedGroup = value; 
        OnPropertyChanged();
        if (_selectedGroup != null)
        {
            Students = _selectedGroup.Students;
        }
    }
}

private List<Student> _students;

public List<Student> Students
{
    get { return _students; }
    set { _students = value; OnPropertyChanged(); }
}

3. Data binding:

<ListBox ItemsSource=”{Binding Groups}” SelectedItem=”{Binding SelectedGroup}” … />
<ListBox ItemsSource=”{Binding Students}” … />