WPF Binding Two Checkboxes with IsChecked Property

Question

I have a WPF UI, with the following elements:

WPF UI

The checked checkbox is in a DataGridRow.
The rest is in the DataGridRowDetails. (It contains a smaller DataGrid)

What I want to get done is to bind the two (shown by red arrows) checkboxes together, so that when one is checked, the other also gets checked, and vice-versa.

I have already taken a look at these questions:

1) WPF Binding with 2 Checkboxes

But when I try this, the click handlers stop working. (The checkboxes stop working altogether)

2) wpf bindings between two checkboxes

When I use triggers, one checkbox triggers the other, and it inturn triggers the other, and goes on.. UI gets stuck.

Sample of my code:

<DataGrid x:Name="DataGrid1">
    <DataGrid.Columns>
        <DataGridTemplateColumn>
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>


                    <CheckBox x:Name="SelectionCheckBox1" PreviewMouseLeftButtonDown="SelectionCheckBox1_PreviewMouseLeftButtonDown"
                              Loaded="SelectionCheckBox1_Loaded"
                              IsChecked="{Binding ElementName=HeaderCheckBox1, Path=IsChecked, Mode=TwoWay}">
                    </CheckBox>


                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>
    </DataGrid.Columns>
    <DataGrid.RowDetailsTemplate>
        <DataTemplate>
            <DockPanel LastChildFill="True">
            <DataGrid>
                <DataGrid.Columns>
                    <DataGridTemplateColumn>
                        <DataGridTemplateColumn.HeaderTemplate>
                             <DataTemplate>


                                 <CheckBox x:Name="HeaderCheckBox1" PreviewMouseLeftButtonDown="HeaderCheckBox_PreviewMouseLeftButtonDown"
                                           IsChecked="{Binding ElementName=SelectionCheckBox1, Path=IsChecked, Mode=TwoWay}">
                                 </CheckBox>


                             </DataTemplate>
                    </DataGridTemplateColumn.HeaderTemplate>
               </DataGrid.Columns>
             </DataGridTemplateColumn>
           </DataGrid>
           </DockPanel>
       </DataTemplate>
    </DataGrid.RowDetailsTemplate>
</DataGrid>

Concern : Because the second Checkbox appears only after the row is selected ( which means the other checkbox is selected), I am unable to find the second checkbox through VisualTreeHelpers also.

Some idea even leading to a possible solution will be much appreciated.

using mvvm pattern and binding those to a boolean property which implements iNotifyPropertyChanged will help you greatly. — mcy, Jan 29 '15 at 09:50
@mcy, I'm getting an error saying that, "Binding property was not found in type 'CheckBox'" Infact, I have a MVVM setup, and an 'IsSelected' property in the Model. But with the checkbox, I'm unable to find how to do it. — Aar Vee, Jan 29 '15 at 09:59
I see. As in Muds' answer, (if your boolean property of VM is isSelected), you should use IsChecked="{Binding IsSelected, Mode=TwoWay}" as well as setting this.DataContext = yourVMInstance in code-behind (or bind in XAML) — mcy, Jan 30 '15 at 09:56

score 0 · Answer 1 · answered Jan 29 '15 at 09:47

0

i would suggest 2 way binding them to a property they both can access (somewhere inside the window for example) since with solution 1 you are creating an infinite loop

Checkbox 1: clicked => notify changed
Checkbox 2: changed => update => notify changed
Checkbox 1: changed => update => notify changed
...

answered Jan 29 '15 at 09:47

HellGate

708
1
5
20

How can I create such a property in the window? Is it to be done in the xaml file? – Aar Vee Jan 29 '15 at 09:53
you have to make the property inside the actual class. take a look at this answer [Two-way binding in WPF](http://stackoverflow.com/a/320035/3115070) – HellGate Jan 29 '15 at 12:10

score 0 · Answer 2 · answered Jan 29 '15 at 12:13

You will need to create a property in ViewModel say that property is called IsSelected, then you have to bind both these checkboxes to that Property. And it should have its dataContext as your view model and not an Element.

IsChecked="{Binding IsSelected, Mode=TwoWay}"

If your VM is not data context then you will have to traverse to find VM and then bind to it

WPF Binding Two Checkboxes with IsChecked Property

2 Answers2