Reputation: 1075
I have three CheckBox in my WPF application and what I want is to disable/ Enable the CheckBoxes according to a Property in ViewModel.
<Grid>
<CheckBox x:Name="cbTest1" Margin="12,341,476,5" IsEnabled="{Binding Path=BoolProperty, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<CheckBox x:Name="cbTest3" Margin="74,341,414,5" IsEnabled="{Binding Path=BoolProperty, Mode=TwoWay }" />
<CheckBox x:Name="cbTest2" Margin="131,341,359,5" IsEnabled="{Binding Path=BoolProperty, Mode=TwoWay }" />
<Button x:Name="btnClick" Click="btnClick_Click" Margin="231,333,29,5" />
</Grid>
In my testing application I have written a code behind for button click
private void btnClick_Click(object sender, RoutedEventArgs e)
{
if (_boolProperty == true)
{
_boolProperty = false;
cbTest1.IsEnabled = false;
}
else
{
_boolProperty = true;
cbTest1.IsEnabled = true;
}
}
The weird behavior is that if I comment the cbTest1.IsEnabled = false;
or cbTest1.IsEnabled = true;
then the CheckBox es remain as disabled,
but changes in only one CheckBox say, "cbTest1"'s value to true
also make changes in the other checkBoxes as well. Like if cbTest1.IsEnabled = true;
then all three CheckBox are enabled. if cbTest1.IsEnabled = false;
then all three CheckBox are disabled.
Anybody can enlighten me please. Why is this happening? How does binding happening here? One more question, how do I go for binding of the checkBoxes isEnabled Property with a property in viewModel?
Upvotes: 1
Views: 1968
Reputation: 86
This is happening because of TwoWay binding in each checkBox you have. When you enable one of them, it sets corresponding view model property to True and TwoWay binding swithes other check boxes to True too. That's the main reason you have this issue.
Then let's determine what do you want from these checkboxes. If you want to change each checkbox separately, than you have to have three different view model's properties for each of checkboxes. Otherwise your behavior is normal because you bind only to one VM field.
<Grid>
<CheckBox x:Name="cbTest1" Margin="12,341,476,5" IsEnabled="{Binding Path=BoolProperty1, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}" />
<CheckBox x:Name="cbTest3" Margin="74,341,414,5" IsEnabled="{Binding Path=BoolProperty2, Mode=TwoWay }" />
<CheckBox x:Name="cbTest2" Margin="131,341,359,5" IsEnabled="{Binding Path=BoolProperty3, Mode=TwoWay }" />
<Button x:Name="btnClick" Click="btnClick_Click" Margin="231,333,29,5" />
</Grid>
And as @dzavala mentioned above, you should modify value of view model property, not checkbox itself. You should use commands for button click events. Read here Commands, RelayCommands and EventToCommand and ICommand interface
Upvotes: 1
Reputation: 387707
<CheckBox x:Name="cbTest1" IsEnabled="{Binding Path=BoolProperty, Mode=TwoWay}" />
<CheckBox x:Name="cbTest3" IsEnabled="{Binding Path=BoolProperty, Mode=TwoWay}" />
<CheckBox x:Name="cbTest2" IsEnabled="{Binding Path=BoolProperty, Mode=TwoWay}" />
All three check boxes bind to the same source, so no matter what you do, they will always share the same state. Furthermore, your binding is a two-way binding, so setting IsEnabled
manually for one checkbox will make the underlying property you bound to change too which will then again trigger the other two checkboxes to update.
If you want to have separate states, you will have to use three different properties to bind to.
how do I go for binding of the checkBoxes isEnabled Property with a property in viewModel?
What you did is already correct (minus the shared property). So if you bind to BoolProperty1
, BoolProperty2
and BoolProperty3
and each of those properties exists in your view model, then everything is good to go. All you need to make sure then is that the checkboxes have the view model as their data context. This is usually achieved by giving a parent component (often the Window
itself) the data context:
Window window = new MyWindow();
window.DataContext = new MyViewModel();
window.Show();
Upvotes: 1
Reputation: 988
Instead of setting the private field _boolProperty
, set the property BoolProperty
, and in its setter raise the PropertyChanged event.
Upvotes: 0