Search code examples
wpfdata-bindingcomboboxitemsource

WPF how to combine two comboboxes with different itemsource into one

Lets say that I currently have two Comboboxes, one that displays the contents of the Productions list and one that displays the contents of the Seasons list from the viewmodel.

<ComboBox Grid.Column="1" Grid.Row="0" Margin="3" ItemsSource="{Binding Productions}" SelectedItem="{Binding SelectedProduction}" DisplayMemberPath="DisplayName" />
<ComboBox Grid.Column="1" Grid.Row="0" Margin="3" ItemsSource="{Binding Seasons}" SelectedItem="{Binding SelectedProduction}" DisplayMemberPath="DisplayName" />

What I need to do is combine these two Comboboxes into one. When clicking on the Combobox it should show a header saying Productions and below each production should appear and bellow all that it should do the same with the Seasons. So graphically it should look something like this:

Combobox Desired Outcome


Productions
production1
production2
production3
Seasons
season1
season2
season3

  1. I suppose that in order to use both lists as an ItemSource I could make a list which contains both Production and Season lists, but is there another way to bind them both in the same combobox?
  2. And then is it even possible to make it look like in the picture?
Solution

  • I would use CompositeCollection which was designed specifically for such usage.

    For the grouping, the link @Floc mentioned in a comment shows how to use to use Grouping.

    With these two, I think you can achieve success. As long as both classes derive from something common to expose similar properties, this should be pretty straightforward.