dev30207
dev30207

Reputation: 527

ComboBox of CheckBoxes not checking item when row clicked

I've got a combo box of checkboxes that allow the user to select multiple temperature bands. When the users clicks on the checkbox, or the text directly next to the checkbox, the boxes are checked correctly, and my combobox text updates to add/remove the selected temperature. However if I check in the area of my combobox drop down to the right of the text, the checkbox isn't toggled, and instead I get namespace text in my combo box. ComboBox Text

Here's my XAML

<ComboBox x:Name="cbDegrees" ItemsSource="{Binding m_DegreeValues}" Text="Degrees" IsEditable="True" IsReadOnly="True" Grid.Row="0" Grid.Column="0" Margin="5" Background="Gray" >
                <ComboBox.ItemTemplate>
                    <DataTemplate>
                        <CheckBox Name="chkDegrees" Content="{Binding Name}" Checked="Degrees_CheckBox_Click" Unchecked="Degrees_CheckBox_Click"  IsChecked="{Binding Path=IsSelected, Mode=TwoWay}">
                        </CheckBox>
                    </DataTemplate>
                </ComboBox.ItemTemplate>
</ComboBox>

I would like to have the checkbox toggled when I click anywhere in the line item for the temperature.

Upvotes: 0

Views: 1683

Answers (2)

Rachel
Rachel

Reputation: 132548

The default ComboBoxItem that is generated is not set to stretch and fill all available space. You can see this if you wrap your ComboBox in something like a DockPanel with it's Background property set.

<ComboBox.ItemTemplate>
    <DataTemplate>
        <DockPanel Background="CornflowerBlue">
            <CheckBox Name="chkDegrees" Content="{Binding Name}" .. />
        </DockPanel>
    </DataTemplate>
</ComboBox.ItemTemplate>

To fix it, set your ComboBoxItem style so it sets the HorizontalContentAlignment to Stretch

<ComboBox.Resources>
    <Style TargetType="{x:Type ComboBoxItem}">
        <Setter Property="HorizontalContentAlignment" Value="Stretch" />
    </Style>
</ComboBox.Resources>

Upvotes: 2

mm8
mm8

Reputation: 169150

You could define an ItemContainerStyle that makes the CheckBox stretch horizontally:

<ComboBox x:Name="cbDegrees" ItemsSource="{Binding m_DegreeValues}" Text="Degrees" IsEditable="True" IsReadOnly="True" Grid.Row="0" Grid.Column="0" Margin="5" Background="Gray" >
    <ComboBox.ItemContainerStyle>
        <Style TargetType="ComboBoxItem">
            <Setter Property="HorizontalContentAlignment" Value="Stretch" />
        </Style>
    </ComboBox.ItemContainerStyle>
    <ComboBox.ItemTemplate>
        <DataTemplate>
            <CheckBox Name="chkDegrees" Content="{Binding Name}" Checked="Degrees_CheckBox_Click" Unchecked="Degrees_CheckBox_Click"  IsChecked="{Binding Path=IsSelected, Mode=TwoWay}">
            </CheckBox>
        </DataTemplate>
    </ComboBox.ItemTemplate>
</ComboBox>

Upvotes: 1

Related Questions