Debhere
Debhere

Reputation: 1075

Checkbox isEnabled behaviour unable to figure out

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

Answers (3)

Georgiy Mogelashvili
Georgiy Mogelashvili

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

poke
poke

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

dzavala
dzavala

Reputation: 988

Instead of setting the private field _boolProperty, set the property BoolProperty, and in its setter raise the PropertyChanged event.

Upvotes: 0

Related Questions