I want to create a subordinate list for each school in my list, that shows the school subjects.
- I define the data structure of the school and the subjects with these models:
public class SchoolModel
{
public int SchoolId { get; set; }
public string Name { get; set; }
public string Address { get; set; }
public List<SubjectModel> Subjects { get; set; }
}
public class SubjectModel
{
public int SubjectId { get; set; }
public int SchoolId { get; set; }
public string Name { get; set; }
}
-
Then I loaded the values for the models from my database and put it in my Schools ObervableCollection in ViewModel.
-
Then I created a list of the schools in my View Class, which worked well so far. Then I tried to create a subordinate list to load my subjects there
4.The problem is that the subjects are only loaded when I remove the StaticResource from my SchoolListView and then the schools are removed
<Border BorderBrush="black" BorderThickness="0, 0, 1, 1" Grid.Column="0" Grid.RowSpan="2">
<StackPanel Orientation="Vertical">
<Border BorderThickness="0, 0, 0, 1" BorderBrush="#202225" Margin="0, 0, 0, 10">
<TextBlock Text="Schools" HorizontalAlignment="Center" Padding="10" FontSize="25" Foreground="#ffffff"/>
</Border>
<ListView Name="SchoolListView" ItemsSource="{Binding Schools}" Background="Transparent"
BorderThickness="0" ItemContainerStyle="{StaticResource SchoolsCard}"
SelectionChanged="SchoolListView_SelectionChanged">
<ListView.ItemTemplate>
<DataTemplate>
<ListView ItemsSource="{Binding Subjects}" Background="Transparent"
BorderThickness="0" ItemContainerStyle="{StaticResource SubjectsCard}">
</ListView>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackPanel>
</Border>
SchoolsCard:
<Style TargetType="ListBoxItem" x:Key="SchoolsCard">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="#202225"/>
</Trigger>
</Style.Triggers>
<Setter Property="Background" Value="#36393f"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<Border Background="{TemplateBinding Background}" Height="50" CornerRadius="3" Margin="8, 2, 8, 2" BorderBrush="#202225" BorderThickness="1">
<StackPanel Orientation="Horizontal" Margin="10, 0, 0, 0">
<StackPanel>
<Label Content="{Binding Name}" Foreground="#ffffff"/>
<Label Content="{Binding Address}" Foreground="#b9bbbe" FontSize="10" Margin="0, -5, 0, 0"/>
</StackPanel>
</StackPanel>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
SubjectsCard:
<Style TargetType="ListBoxItem" x:Key="SubjectsCard">
<Style.Triggers>
<Trigger Property="IsSelected" Value="True">
<Setter Property="Background" Value="#202225"/>
</Trigger>
</Style.Triggers>
<Setter Property="Background" Value="#36393f"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListViewItem">
<Border Background="{TemplateBinding Background}" Height="30" CornerRadius="3" Margin="8, 2, 8, 2" BorderBrush="#202225" BorderThickness="1">
<StackPanel>
<Label Content="{Binding Name}" Foreground="#ffffff" FontSize="10" Padding="5" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</StackPanel>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
New contributor
susmi is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
3
The problem is that the ControlTemplate in the SchoolsCard Style does not contain a ContentPresenter which would show the nested ListView that is declared in the inner ItemTemplate.
As a starting point, you could use only ItemTemplates. The basic structure would be similar to this:
<ListBox ItemsSource="{Binding Schools}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding Name}"/>
<TextBlock Text="{Binding Address}"/>
<ListBox ItemsSource="{Binding Subjects}" >
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
4