CODEWITHSUNDEEP
c#xamlwindows-phone-8data-bindingwindows-phone
godidier
godidier

Reputation: 1001

How todo nested Databinding with Windows Phone (Pivot and ListBox)

I am pretty new in the usage of the DataBinding concept in Windows Phone. I am trying to bind a Pivot page with a list of items, as well as a ListBox in each PivotItem with another list (of criterias). I have a Page with the following XAML:

<phone:Pivot Name="ItemsPivot" Title="MY APPLICATION">
  <phone:Pivot.ItemTemplate>
    <DataTemplate>
        <StackPanel  Margin="12,17,0,28">
            <ListBox Name="CriteriasListBox" >
                <ListBox.ItemTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Vertical" >
                            <TextBlock Text="{Binding Name}"/>
                            <tk:Rating />
                        </StackPanel>
                    </DataTemplate>
                </ListBox.ItemTemplate>
            </ListBox>
        </StackPanel>
    </DataTemplate>
  </phone:Pivot.ItemTemplate>
</phone:Pivot>

I then try to specify the ItemSource of each binded control in the C# code like this:

...
ItemsPivot.ItemsSource = ItemList;
CriteriasListBox.ItemsSource = CriteriaList; // <-- CriteriasListBox not accessible !!
...

But there is an error stating that "the name 'CriteriasListBox' does not exist in the current context"... As I mention, I am pretty new with this technology. Can I have some advice, solution or resources on how do make this nested binding work?

Thank you !

Upvotes: 0

Views: 702

Answers (3)

godidier
godidier

Reputation: 1001

Here is another good way I found...

http://www.codeproject.com/Articles/47229/A-LINQ-Tutorial-WPF-Data-Binding-with-LINQ-to-SQL

Here is a code snippet:

<DataTemplate DataType="{x:Type LINQDemo:Category}">
  <Border Name="border" BorderBrush="ForestGreen" 
     BorderThickness="1" Padding="5" Margin="5">
    <StackPanel>
      <TextBlock Text="{Binding Path=Name}" 
           FontWeight="Bold" FontSize="14"/>
      <ListView ItemsSource="{Binding Path=Books}" 
           HorizontalContentAlignment="Stretch" BorderThickness="0" >
        <ListView.ItemTemplate> 
          <DataTemplate>
            <TextBlock>
              <Hyperlink Click="LoadIndividualBook" 
                  CommandParameter="{Binding}" 
                  ToolTip="Display book details">
                <TextBlock Text="{Binding Path=Title}"/></Hyperlink>
   ...

Upvotes: 0

Agaspher
Agaspher

Reputation: 484

One of the ways if you have different criteria list for different items is to add criteria list property to your PivotItemViewModel. Your c# code will look like this

ItemsPivot.ItemsSource = ItemList;

where every item in ItemList contains CriteriaList. Your xaml code will look like

<phone:Pivot Name="ItemsPivot" Title="MY APPLICATION">
    <phone:Pivot.ItemTemplate>
        <DataTemplate>
            <StackPanel  Margin="12,17,0,28">
                <TextBlock Name="PivotTextBlock" Text="{Binding Name}"/>
                <ListBox ItemsSource="{Binding Criterions}">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Vertical" >
                                <TextBlock Name="ListTextBlock" Text="{Binding Name}"/>
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </StackPanel>
        </DataTemplate>
    </phone:Pivot.ItemTemplate>
</phone:Pivot>

Binding for PivotTextBlock retrieves Name property from the PivotItemViewModel. Binding for ListTextBlock retrieves Name property from Criteria.

If criteria list the only in your application here is a good start

Upvotes: 1

Sajeetharan
Sajeetharan

Reputation: 222722

Do like this,

<UserControl.Resources>
<DataTemplate x:Key="MyPivotItemTemplate">
   <controls:PivotItem Header="first" >
                <ListBox x:Name="CriteriasListBox" Margin="0,0,12,0" ItemsSource="{Binding CriteriaList}">
                    <ListBox.ItemTemplate>
                        <DataTemplate>
                            <StackPanel Orientation="Horizontal" Height="132">
                                <TextBlock Text="{Binding Name}" />
                            </StackPanel>
                        </DataTemplate>
                    </ListBox.ItemTemplate>
                </ListBox>
            </controls:PivotItem>
</DataTemplate>
</UserControl.Resources>

Then in your pivot

<Pivot ItemsTemplate="{StaticResource MyPivotItemTemplate}" Items="{Binding ItemList}"

Upvotes: 1

Related Questions