Change Binding of ContentControl Based on Selection in one of two ListBoxes

Question

I have two ListBox controls in a window. Each is a list of patient allergies bound to different StaticResources. At the bottom of the window I have a ContentControl which displays additional information about the selected allergy in the list above.

screenshot of XAML window with two ListBox controls and a ContentControl for showing details

Currently, I have two ContentControls, one for each of the listboxes, both with Visiblity="Collapsed". When the user makes a selection, I make the associated content control visible and collapse the other one. I'd like to only have one content control and change its binding.

So far, I've tried each of the following with no luck:

this.ExpandedAllergyDetails.Content = "InsideAllergiesSource";
this.ExpandedAllergyDetails.SetBinding(ContentControl.ContentProperty, "InsideAllergiesSource");
this.ExpandedAllergyDetails.SetBinding(ContentControl.ContentProperty, new Binding());
this.ExpandedAllergyDetails.SetResourceReference(ContentControl.ContentProperty, this.Resources["InsideAllergiesSource"]);
this.ExpandedAllergyDetails.SetResourceReference(ContentControl.ContentProperty, this.FindResource("InsideAllergiesSource"));

In each case, I was trying to use only one ContentControl, named ExpandedAllergyDetails, and change its binding to "InsideAllergiesSource" which is a CollectionViewSource defined in the XAML.

score 0 · Accepted Answer · answered Mar 22 '11 at 22:17

0

The SetResourceReference takes a key, not the actual object. So you'd use

this.ExpandedAllergyDetails.SetResourceReference(ContentControl.ContentProperty, "InsideAllergiesSource");

If "InsideAllergiesSource" is the x:Key of the resource. I'm not sure this will bind to the "current" item though.

answered Mar 22 '11 at 22:17

CodeNaked

40,753
6
122
148

Works like a charm. That must be the only combination I didn't try! Thanks! – David Walker Mar 23 '11 at 13:31

score 0 · Answer 2 · edited May 23 '17 at 12:30

You can wrap those two lists in a ListBox as items, so that when one allergy is selected the corresponding main list is selected as well, that way you can bind to a path of selections, i.e. SelectedMainList -> SelectedAllergy. Not sure how this translates into your specific application code but here is a working example of the scenario, note the Style that is necessary to auto-select the parent list. The example consists of two lists and a TextBlock which displays the chosen item.

<TextBlock Text="{Binding ElementName=TestLB,
                          Path=SelectedItem.Content.SelectedItem.Content}"/>

<ListBox Name="TestLB">
    <ListBox.Resources>
        <Style TargetType="ListBoxItem">
            <Style.Triggers>
                <Trigger Property="IsKeyboardFocusWithin" Value="True">
                    <Setter Property="IsSelected" Value="True"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </ListBox.Resources>
    <ListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </ListBox.ItemsPanel>
    <ListBoxItem>
        <ListBox>
            <ListBoxItem>List1-Item1</ListBoxItem>
            <ListBoxItem>List1-Item2</ListBoxItem>
            <ListBoxItem>List1-Item3</ListBoxItem>
        </ListBox>
    </ListBoxItem>
    <ListBoxItem>
        <ListBox>
            <ListBoxItem>List2-Item1</ListBoxItem>
            <ListBoxItem>List2-Item2</ListBoxItem>
            <ListBoxItem>List2-Item3</ListBoxItem>
        </ListBox>
    </ListBoxItem>
</ListBox>

You might want to mask the selection of the two main lists, this answer should help with that.

Edit: Since the trigger in the above style will also unselect the main list when the keyboard focus is moved away from inside the list you might want to change it to only act when the trigger is fired, this can be done with a single frame animation in the EnterActions of the trigger.

<Style TargetType="ListBoxItem">
    <Style.Triggers>
        <Trigger Property="IsKeyboardFocusWithin" Value="True">
            <Trigger.EnterActions>
                <BeginStoryboard>
                    <Storyboard>
                        <BooleanAnimationUsingKeyFrames Storyboard.TargetProperty="IsSelected">
                            <DiscreteBooleanKeyFrame KeyTime="0:0:0.0" Value="True"/>
                        </BooleanAnimationUsingKeyFrames>
                    </Storyboard>
                </BeginStoryboard>
            </Trigger.EnterActions>
        </Trigger>
    </Style.Triggers>
</Style>

Change Binding of ContentControl Based on Selection in one of two ListBoxes

2 Answers2