Search code examples
wpfdatagrid

Set the area of influence of checkbox click


I am using the following code to create single click checkbox in a wpf DataGrid.

<DataGridTemplateColumn Header="Select">
   <DataGridTemplateColumn.CellTemplate>
      <DataTemplate>
         <CheckBox Margin="16,3,0,0" IsChecked="{Binding IsSelected, UpdateSourceTrigger=PropertyChanged}" />
      </DataTemplate>
   </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

This is the example output:

The checkbox is selected only if user clicks to the right of the checkbox. If the user clicks to the left of the checkbox, it is not selected. How to fix this? I want the checkbox to be selected if the user clicks anywhere on the cell where the checkbox is located.


Solution

  • Create a custom template for the CheckBox or you could put it into a ToggleButton:

    <DataGridTemplateColumn Header="Select">
        <DataGridTemplateColumn.CellTemplate>
            <DataTemplate>
                <ToggleButton Margin="0" IsChecked="{Binding IsSelected, UpdateSourceTrigger=PropertyChanged}">
                    <ToggleButton.Template>
                        <ControlTemplate TargetType="ToggleButton">
                            <Grid Background="Transparent">
                                <ContentPresenter />
                            </Grid>
                        </ControlTemplate>
                    </ToggleButton.Template>
                    <CheckBox Margin="16,3,0,0" IsChecked="{Binding IsChecked, 
                        RelativeSource={RelativeSource AncestorType=ToggleButton}}" />
                </ToggleButton>
            </DataTemplate>
        </DataGridTemplateColumn.CellTemplate>
    </DataGridTemplateColumn>