Binding listbox in listbox on Windows Phone 8 - windows-phone-8

Question

I want to bind AnswerList in QuestionList. When I run code, only have question list on the screen.
<ListBox x:Name="listques" ItemsSource="{Binding QuestionList }">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock x:Name="quesdetail" Text="{Binding QuestionContent.que_detail}" HorizontalAlignment="Left" Margin="27.669,34.338,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Height="252.564" Width="419.534" RenderTransformOrigin="0.5,0.5" UseLayoutRounding="False" d:LayoutRounding="Auto">
</TextBlock>
<ListBox>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock x:Name="ansdetail" Foreground="Blue" Text="{Binding Answer.ans_detail}">
</TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

Answer 1

You should have a property AnswerList inside your Question object. Assign that as the itemsSource of the inner ListBox. So for each question you will have a list of answers.
<ListBox x:Name="InnerListBox" ItemsSource = "{Binding QuestionContent.AnswerList}">

Answer 2

#Bells is right. To elaborate his answer a little more, let me explain by an external example.
Example:-
// MainPage.xaml page
// eg. we have a nested ListBox for questions and answers
<ListBox x:Name="lbxRoot">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding que}" FontSize="30" />
<ListBox ItemsSource="{Binding lstAns}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding}" Margin="20 0 0 0" FontSize="30"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
To assign ItemsSource to the RootListBox let's define one model class which contains one question and a list of answers of that question.
// MainPage.xaml.cs file add one class named Model as below
public class Model
{
public string que { get; set; }
public List<string> lstAns { get; set; }
}
Now, we are going to assign ItemsSource to root ListBox in Loaded event of the page so declare the event handler in the MainPage's Constructor.
this.Loaded += MainPage_Loaded;
and then define the Loaded event handler as below.
// MainPage.xaml.cs file
// Loaded event handler
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
Model m1 = new Model()
{
que = "Question 1",
lstAns = new List<string>()
{
"que 1 - ans 1", "que 1 - ans 2", "que 1 - ans 3"
}
};
Model m2 = new Model()
{
que = "Question 2",
lstAns = new List<string>()
{
"que 2 - ans 1", "que 2 - ans 2", "que 3 - ans 3"
}
};
List<Model> lstModels = new List<Model>();
lstModels.Add(m1);
lstModels.Add(m2);
lbxRoot.ItemsSource = lstModels;
}
It will give output like below image:
And there you go..!!
Try to relate your scenario with this example, and you're done..!
Hope that helps..

Answer 3

A ListBoxItem will try to find the binding inside the properties of its current item in the ItemSource. So the first ListBox will try to find the properties on its ItemSource and the inner ListBox will try to find its bindings on its ItemSource.
If you want to bind the inner ListBox's ListBoxItem you have to specify the relativeSource (To make it clear prop1 means a property, no matter which one):
<ListBox ItemSource="{Binding list1}"
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding propList1}"/>
<ListBox ItemsSource="{Binding list2}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel>
<TextBlock Text="{Binding DataContext.propList1,
RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ListBox}}"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
With this line
<TextBlock Text="{Binding DataContext.propList1,
RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=ListBox}}"/>
wpf will look for a parent of type ListBox in its visualtree, and use its DataContext, and its DataContext is the ListBoxItem of the outter ListBox.