Bind based on a condition

Question

Hi. I'm running into issues with having a RadExpander in a RadListBox. Basically, I have exactly something like here or here.

I have a OneWayToSource binding, but I want the binding to happen only when the RadExpander is expanded and not when it is collapsed.

Is there a way I can conditionally bind the two UI Elements?

EDIT: (Sample code which makes some of the downvoters happy)

<DataTemplate x:Key="ListBoxItemTemplate" DataType="{x:Type telerik:RadListBoxItem}">
    <!--<DataTemplate.Triggers>
        <DataTrigger Binding="{Binding ElementName=listExpander, Path=IsExpanded, Mode=TwoWay}" Value="True">
            <Setter Property="IsSelected" Value="True" />
        </DataTrigger>
    </DataTemplate.Triggers>-->
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>
        <telerik:RadExpander x:Name="listExpander"
                             IsExpanded="{Binding Mode=TwoWay, IsAsync=True, Path=IsSelected, RelativeSource={RelativeSource AncestorType=telerik:RadListBoxItem, Mode=FindAncestor}}"
                             VerticalContentAlignment="Top" ToolTip="Double click on the List name to edit it">
            <telerik:RadExpander.Header>
                <Grid>
                    <TextBlock x:Name="listNameCaption" MouseDown="listName_txtblk_MouseDown"
                               Text="{Binding ListName, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" Style="{StaticResource HighlightedDetailsStyleForTextBlock}" />
                    <TextBox LostFocus="listName_txtbox_LostFocus" Visibility="Collapsed"
                             Text="{Binding ListName, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"
                             Style="{StaticResource HighlightedDetailsStyleForTextBox}" />
                </Grid>
            </telerik:RadExpander.Header>
            <telerik:RadExpander.Content>
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Border BorderBrush="#FFDADADA" BorderThickness="0,0,1,1" MinHeight="20" MinWidth="200" CornerRadius="3" Margin="5">
                        <Border BorderBrush="#B2ADBDD1" BorderThickness="1" CornerRadius="2">
                            <StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <Label FontFamily="Segoe UI" FontSize="11" Content="List Type:" FontStyle="Italic" />
                                    <Label FontFamily="Segoe UI" FontSize="11" Content="{Binding ListType}" />
                                </StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <Label FontFamily="Segoe UI" FontSize="11" Content="Tree:" FontStyle="Italic" />
                                    <Label FontFamily="Segoe UI" FontSize="11" Content="{Binding TreeName}" />
                                </StackPanel>
                                <StackPanel Orientation="Horizontal">
                                    <Label FontFamily="Segoe UI" FontSize="11" Content="Discount Date:" FontStyle="Italic" />
                                    <Label FontFamily="Segoe UI" FontSize="11" Content="{Binding DiscountDate}" />
                                </StackPanel>
                            </StackPanel>
                        </Border>
                    </Border>
                </Grid>
            </telerik:RadExpander.Content>
            <!--<telerik:RadExpander.Style>
                <Style TargetType="{x:Type telerik:RadExpander}">
                    <Style.Triggers>
                        <Trigger Property="IsExpanded" Value="True">
                            <Setter Property="{Binding RelativeSource={RelativeSource AncestorType=ListBoxItem, Mode=FindAncestor}, Path=IsSelected}" Value="True"/>
                        </Trigger>
                    </Style.Triggers>
                </Style>
            </telerik:RadExpander.Style>-->
        </telerik:RadExpander>
    </Grid>
</DataTemplate>

<telerik:RadListBox x:Name="allListBox"
                    Style="{StaticResource ListBoxStyle}"
                    ItemsSource="{Binding Lists, Mode=TwoWay}"
                    ItemTemplate="{StaticResource ListBoxItemTemplate}"
                    SelectedItem="{Binding SelectedListItem, Mode=TwoWay}">
    <telerik:RadListBox.ItemsPanel>
        <ItemsPanelTemplate>
            <VirtualizingStackPanel Orientation="Vertical" />
        </ItemsPanelTemplate>
    </telerik:RadListBox.ItemsPanel>
</telerik:RadListBox>

EDIT 2:

Fixed it, but from code behind. Wish there was a cleaner way where we could just say: "RadExpander - you bind to RadListBoxItem's IsSelected property only if you have IsExpanded=True" from XAML.

This is the work-around code:

private void ListItemExpanded(object sender, RadRoutedEventArgs e)
{
    var listItem = sender as RadExpander;
    if(listItem == null)
        return;

    if (!listItem.IsExpanded) return;


    var parent = VisualTreeHelper.GetParent(listItem);
    while (parent != null && !(parent is RadListBoxItem))
    {
        parent = VisualTreeHelper.GetParent(parent);
    } 

    if(parent == null)
        return;

    var listBoxItem = parent as RadListBoxItem;
    if (!listBoxItem.IsSelected)
        listBoxItem.IsSelected = true;
}

and

<telerik:RadExpander x:Name="listExpander" Expanded="ListItemExpanded" VerticalContentAlignment="Top" ToolTip="Double click on the List name to edit it">

Call me lazy, but it would benefit you a lot more to put actual code samples in your own question opposed to linking to others; specifically the code you're trying to make work. On the same note, what is the condition you're trying to have a trigger for? — newfurniturey, Nov 01 '12 at 04:11
@Shankar you need to provide more information about what you want, examples or a bit of code. — J. Lennon, Nov 01 '12 at 10:27
Hail Stackoverflow! This is just getting too much. The site was created to help the community with technical difficulties. What if I start the question with some code? You would still downvote it because it is redundant. I searched the forum, came up with some answers, posted the URLs in my question and then expect a solution for some slightly different requirement. I will post the code here, but it will be exactly similar to the ones I linked. — Shankar Raju, Nov 01 '12 at 17:24

Joe · Answer 1 · 2012-11-02T11:04:43.967

1

Solution 1. React to the expand events and change the binding of your element through code.

Solution 2: Use MultiBinding and IMultiValueConverter: http://www.switchonthecode.com/tutorials/wpf-tutorial-using-multibindings

edited Nov 02 '12 at 11:04

answered Nov 01 '12 at 17:29

Joe

2,496
1
22
30

Thanks Joe, I have the workaround which you suggested. However, I just wish there was a cleaner way – Shankar Raju Nov 01 '12 at 20:13
@Shankar - A cleaner way would be to use a [Trigger](http://wpftutorial.net/Triggers.html) through XAML. By looking at IsExpanded == true/false, you can set one binding or another, just like you would set a color or transparency. – Joe Nov 02 '12 at 00:48
Hi Joe I tried that. But it does not work as IsSelected is not a Dependency Property. It is also described here: http://stackoverflow.com/a/11199811/640607 – Shankar Raju Nov 02 '12 at 04:20
In fact you're slightly wrong. The reason you can't do this (and is explained in the post you linked) is because you cannot change Bindings through Setters. I wasn't aware of this myself. – Joe Nov 02 '12 at 10:57
I have edited my post with the MultiBinding idea. While the actual code-behind logic will be similar to your event logic, it will be more obvious to anyone reading your code that something is going on with the binding of this expander. – Joe Nov 02 '12 at 11:06

Bind based on a condition

1 Answers1