Bind checkbox visibility to converted bool and another checkboxes visibility

Question

Below binds the visibility of my checkbox to the converted bool. That works fine. How would i add a second condition? I only want to make the checkbox visible if the converted bool is true and another checkbox called Allowed is checked.

            <CheckBox Grid.Row="3" Foreground="Black" Grid.ColumnSpan="2" x:Name="IsItComplete" IsThreeState="False"
                  BorderBrush="Black" VerticalContentAlignment="Center" 
                  Checked="IsItComplete_Checked" 
                  Style="{StaticResource CheckBoxStyle1}" 
                  Visibility="{Binding Job.CanItBeComplete, Converter={StaticResource booleanToVisibilityConvertor}, 
                  Mode=OneWay, 
                  Source={StaticResource Locator}}">
            <CheckBox.Content>
                <TextBlock Text="Is It Complete" Margin="0"/>
            </CheckBox.Content>
        </CheckBox>

suggestion: remove the `` tags and the `TextBlock` alltogether and set `` directly. It is shorter and produces the same result — Federico Berasategui, Jan 07 '14 at 15:53

score 4 · Answer 1 · edited May 23 '17 at 12:24

If you are working under MVVM, one approach is to create a property in the ViewModel which will handle the logic and return a boolean indicating if the checkbox should be visible or not.

The second check box will have to be bound to a property as well, and be sure to do a TwoWay binding so that the property is updated when the checkbox is checked or not.

This should help: Bind two elements' Visibility to one property

score 3 · Accepted Answer · answered Jan 07 '14 at 17:08

This can be solved via two approaches i can think of over my head (ofcourse having single property in View model already suggested so i am not going to talk about it again)

Approach 1

Bind Visibility of checkBox with MultiValueConverter in place. Pass two bindings to it:

Actual bool property of class.
IsChecked DP of Allowed checkbox.

Converter will do AND operation on two values and will return accordingly.

        <CheckBox>
            <CheckBox.Visibility>
                <MultiBinding Converter="{StaticResource MyConverter}">
                    <Binding Path="IsEnable"/>
                    <Binding ElementName="Allowed" Path="IsChecked"/>
                </MultiBinding>
            </CheckBox.Visibility>
        </CheckBox>

MutliValueConverter code:

public class MyConverter: IMultiValueConverter
{
    public object Convert(object[] values, Type targetType,
                          object parameter, CultureInfo culture)
    {
        return ((bool)values[0] && (bool)values[1])
                 ? Visibility.Visible : Visibility.Collapsed;
    }

    public object[] ConvertBack(object value, Type[] targetTypes,
                                object parameter, CultureInfo culture)
    {
        return Binding.DoNothing;
    }
}

Approach 2

Use MultiDataTrigger in checkBox style like this:

<CheckBox>
   <CheckBox.Style>
      <Style TargetType="CheckBox">
         <Setter Property="Visibility" Value="Collapsed"/>
         <Style.Triggers>
            <MultiDataTrigger>
               <MultiDataTrigger.Conditions>
                  <Condition Binding="{Binding IsEnable}" Value="True"/>
                  <Condition Binding="{Binding ElementName=Allowed,
                                           Path=IsChecked}" Value="True"/>
               </MultiDataTrigger.Conditions>
               <Setter Property="Visibility" Value="Visible"/>
            </MultiDataTrigger>
         </Style.Triggers>
      </Style>
    </CheckBox.Style>
 </CheckBox>

Bind checkbox visibility to converted bool and another checkboxes visibility

2 Answers2

Approach 1

Approach 2