Question

I have the following classes:

public class Order
{
    public string OrderName { get; set; }
    public List<Parts> PartsList { get; set; }
}

public class Parts
{
    public string PartName { get; set; }
    public double PartQuantity { get; set; }
}

In my code I create a list of Order objects

List<Order> myOrders;

I would like to display all of this to the user somehow, like using a stack panel of elements where the first is a TextBox to display OrderName and the second is a Datagrid to display the list of Parts?

Honestly I am trying many different things (I have no requirements on what type of controls to use) but I can never get the PartsList to show correctly (either I get nothing OR I get “Collection” show to the user.

The goal would be to see something like this:

Order1    Part1    7
          Part2    12
Order2    Part1    100
          Part2    1
          Part3    58

This is the XAML I have today and I really thought it would work:

<ItemsControl x:Name="visual"
              ItemsSource="{Binding myOrders}"
              HorizontalAlignment="Stretch"
              HorizontalContentAlignment="Stretch" 
              Margin="0,397,37,31" Grid.Row="1" Height="172">
  <ItemsControl.ItemTemplate>
    <DataTemplate>
      <ItemsControl ItemsSource="{Binding }"
                    HorizontalAlignment="Stretch"
                    HorizontalContentAlignment="Stretch">
        <ItemsControl.ItemTemplate>
          <DataTemplate>
            <StackPanel>
              <TextBlock Text="{Binding OrderName}"
                         Margin="10" />
              <ItemsControl ItemsSource="{Binding PartsList}"
                            HorizontalAlignment="Stretch"
                            HorizontalContentAlignment="Stretch">
                <ItemsControl.ItemTemplate>
                  <DataTemplate>
                    <Grid HorizontalAlignment="Stretch">
                      <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                      </Grid.ColumnDefinitions>
                      <TextBlock Grid.Column="0"
                                 Text="{Binding PartName}"
                                 TextAlignment="Center" />
                      <TextBlock Grid.Column="1"
                                 Text="{Binding PartQuantity}"
                                 TextAlignment="Center" />
                    </Grid>
                  </DataTemplate>
                </ItemsControl.ItemTemplate>
              </ItemsControl>
            </StackPanel>
          </DataTemplate>
        </ItemsControl.ItemTemplate>
      </ItemsControl>
    </DataTemplate>
  </ItemsControl.ItemTemplate>
</ItemsControl>

Does anyone see what is wrong with this code?

Answer 1

You have an extra unnecessary ItemsControl. The one with ItemsSource="{Binding}".

So assuming that myOrders is a property which holds a collection of Orders this should work:

<ItemsControl x:Name="visual"
              ItemsSource="{Binding myOrders}"
              HorizontalAlignment="Stretch"
              HorizontalContentAlignment="Stretch" Margin="0,397,37,31" 
              Grid.Row="1" Height="172">
  <ItemsControl.ItemTemplate>  
    <!-- This defines the DataTemplate to display one Order object-->   
    <DataTemplate>     
            <StackPanel>
              <TextBlock Text="{Binding OrderName}"
                         Margin="10" />
              <ItemsControl ItemsSource="{Binding PartsList}"
                            HorizontalAlignment="Stretch"
                            HorizontalContentAlignment="Stretch">
                <ItemsControl.ItemTemplate>
             <!-- This defines the DataTemplate to display one Parts object--> 
                  <DataTemplate>
                    <Grid HorizontalAlignment="Stretch">
                      <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                      </Grid.ColumnDefinitions>
                      <TextBlock Grid.Column="0"
                                 Text="{Binding PartName}"
                                 TextAlignment="Center" />
                      <TextBlock Grid.Column="1"
                                 Text="{Binding PartQuantity}"
                                 TextAlignment="Center" />
                    </Grid>
                  </DataTemplate>
                </ItemsControl.ItemTemplate>
              </ItemsControl>
            </StackPanel>        
    </DataTemplate>
  </ItemsControl.ItemTemplate>
</ItemsControl>