ComboBox selectedItem affect another ComboBox - data-binding

Question

I have a question about Databinding which I'm really struggling to understand. I have two ComboBox on my extended splash screen. What I want to achieve is when you select an item from the first ComboBox, the items in the 2nd ComboBox should change. Please see the code below.
First let me try to explain how my Data looks like and what problem I'm facing.
Collection
A
AA
AB
AC
B
BA
BB
C
CA
The First ComboBox should show A,B and C as items. Now lets say you selected A, the ComboBox 2 should show AA,AB and AC as items. The problem I have is that ComboBox 2 is showing AA only not all 3 items.
My ViewModel Called MainViewModel looks like this:-
public class ItemViewModel : INotifyPropertyChanged
{
private string _befattning;
public string Befattning
{
get
{
return _befattning;
}
set
{
if (value != _befattning)
{
_befattning = value;
NotifyPropertyChanged("Befattning");
}
}
}
private string _befattning2;
public string Befattning2
{
get
{
return _befattning2;
}
set
{
if (value != _befattning2)
{
_befattning2 = value;
NotifyPropertyChanged("Befattning2");
}
}
}
private string _befattning3;
public string Befattning3
{
get
{
return _befattning3;
}
set
{
if (value != _befattning3)
{
_befattning3 = value;
NotifyPropertyChanged("Befattning3");
}
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(String propertyName)
{
//NotifyPropertyChanged Code
}
}
public class MainViewModelGroups : INotifyPropertyChanged
{
public MainViewModelGroups(String enhet)
{
this._enhetsNamn = enhet;
}
private string _enhetsNamn;
public string EnhetsNamn
{
get { return _enhetsNamn; }
}
private string _selectedItem;
public string SelectedItem
{
get { return _selectedItem; }
set
{
if (value != _selectedItem)
{
_selectedItem = value;
NotifyPropertyChanged("SelectedItem");
}
}
}
private ObservableCollection<ItemViewModel> _items = new ObservableCollection<ItemViewModel>();
public ObservableCollection<ItemViewModel> Items
{
get
{
return this._items;
}
}
public event PropertyChangedEventHandler PropertyChanged;
private void NotifyPropertyChanged(String propertyName)
{
//NotifyPropertyChangedCode
}
}
public sealed class MainViewModel
{
private static MainViewModel _mainViewModel = new MainViewModel();
private ObservableCollection<MainViewModelGroups> _collection = new ObservableCollection<MainViewModelGroups>();
public ObservableCollection<MainViewModelGroups> Collection
{
get { return this._collection; }
}
public MainViewModel()
{
var enhet1 = new MainViewModelGroups("Akutmottagning");
enhet1.Items.Add(new ItemViewModel() { Befattning = "Ledningsansvarig sjuksköterska" });
Collection.Add(enhet1);
}
And my XAML code looks like this
<ComboBox x:Name="EnhetLista"
ItemsSource="{Binding Collection}"
SelectedItem="{Binding SelectedItem, Mode=OneWay}">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding EnhetsNamn}"/>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
<ComboBox x:Name="BefattningsLista"
DataContext="{Binding ElementName=EnhetLista, Path=SelectedItem, Mode=OneWay}"
ItemsSource="{Binding Path=Items, Mode=OneWay}">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
Can someone please helps by explaining what is wrong with my code and how to achieve my goal?

Answer 1

Add a second ObservableCollection to your viewmodel, then change that based on the selected item.
public sealed class MainViewModel
{
private static MainViewModel _mainViewModel = new MainViewModel();
private ObservableCollection<MainViewModelGroups> _collection = new ObservableCollection<MainViewModelGroups>();
public ObservableCollection<MainViewModelGroups> Collection
{
get { return this._collection; }
}
public ObservableCollection<ItemViewModel> Items
{
get { return this._items; }
set { this._items = value; OnPropertyChanged("Items"); }
}
public MainViewModelGroups SelectedGroup
{
get { return this._selectedGroup; }
set { this._selectedGroup = value; Items = value.Items; }
}
public MainViewModel()
{
var enhet1 = new MainViewModelGroups("Akutmottagning");
enhet1.Items.Add(new ItemViewModel() { Befattning = "Ledningsansvarig sjuksköterska" });
Collection.Add(enhet1);
}
}
Your Xaml will change to:
<ComboBox x:Name="EnhetLista"
ItemsSource="{Binding Collection}"
SelectedItem="{Binding SelectedItem, Mode=TwoWay}">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding EnhetsNamn}"/>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
<ComboBox x:Name="BefattningsLista"
ItemsSource="{Binding Path=Items}">
<ComboBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding}" />
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
Your viewmodel may need to implement INotifyPropertyChanged. It may not though, as ObservableCollection may take care of that for you.