How to attach 2 depths to a collection?

Question

I have the following collection structure and you need to bind a combo box to it:

MainCollection.Items

Elements contain a list of elements that I would like to display as a selection in a combo box. MainCollection is of type List. Elements are of type List. The Item class has a Name property that I would like to display in the combo box.

The layout will be configured as a grid. Each row will have a combo box.

I'm not sure how to access the properties of Item elements inside the Items collection.

<ComboBox ItemsSource="{Binding MainCollection}"></ComboBox>

How to set it up?

Answer 1

, , DataGrid, Combobox, , , Name Item,

, , :

public class User
{
    public int Id { get; set; }
    public string Name { get; set; }
    public Item Item { get; set; }
}

, ( ):

public class Item
{
    public string Name { get; set; }
}

, , DataContext :

public partial class MainWindow : Window
{
    // Could also be
    // public ObservableCollection<Item> Items { get; set; }
    public List<Item> Items { get; set; }
    public List<User> Users { get; set; }

    public MainWindow()
    {
        InitializeComponent();

        // Creating our list of Items
        Items = new List<Item> { 
            new Item { Name = "firstItem" },
            new Item { Name = "secondItem" },
            new Item { Name = "thirdItem" },
        };

        // Somes users for the example
        Users = new List<User>{
            new User { Id = 1, Name = "Bill", Item = new Item { Name = "firstItem" }},
            new User { Id = 2, Name = "Steeve", Item = new Item { Name = "secondItem" }}
        };

        // Don't forget to set the datacontext
        DataContext = this;
    }
}

XAML:

<Grid>
    <DataGrid Name="testGrid" AutoGenerateColumns="False" ItemsSource="{Binding Users}">
        <DataGrid.Columns>
            <DataGridTextColumn Header="Id" Binding="{Binding Id}"/>
            <DataGridTextColumn Header="Name" Binding="{Binding Name}"/>
            <DataGridComboBoxColumn 
                DisplayMemberPath="Name"
                SelectedValuePath="Name"
                SelectedValueBinding="{Binding Item.Name}"
                Header="Item">
                <DataGridComboBoxColumn.ElementStyle>
                    <Style TargetType="{x:Type ComboBox}">
                        <Setter Property="ItemsSource" Value="{Binding Path=Items, RelativeSource={RelativeSource AncestorType={x:Type Window}}}" />
                    </Style>
                </DataGridComboBoxColumn.ElementStyle>
                <DataGridComboBoxColumn.EditingElementStyle>
                    <Style TargetType="{x:Type ComboBox}">
                        <Setter Property="ItemsSource" Value="{Binding Path=Items, RelativeSource={RelativeSource AncestorType={x:Type Window}}}" />
                    </Style>
                </DataGridComboBoxColumn.EditingElementStyle>
            </DataGridComboBoxColumn>
        </DataGrid.Columns>
    </DataGrid>
</Grid>

:

, , :)