2
votes

I am trying to add a checkbox column to my datagrid so that users can easily see what is selected and easily select multiple columns without needing to know how to with the CTRL button. Would someone mind assisting?

The check box will un-check if already selected but I can not get it to become checked when I click it.

<Window.Resources>
        <DataTemplate x:Key="isSelectedCheckBoxColumn">
                <CheckBox IsChecked="{Binding Path=IsSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged,
      RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGridRow}}}">
                    <CheckBox.LayoutTransform>
                        <ScaleTransform ScaleX="1.5" ScaleY="1.5" />
                    </CheckBox.LayoutTransform>
                </CheckBox>
        </DataTemplate>
        <Style x:Key="RowStyleWithAlternation" TargetType="DataGridRow">
            <Setter Property="SnapsToDevicePixels" Value="True" />
            <Setter Property="Background" Value="GhostWhite"/>
            <Setter Property="FontWeight" Value="Normal"/>
            <Setter Property="ContextMenu" Value="{x:Null}"/>
            <Style.Triggers>
                <Trigger Property="AlternationIndex" Value="1">
                    <Setter Property="Background" Value="#C1FFC1"/>
                </Trigger>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="#F9F99F"/>
                </Trigger>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Background" Value="LightBlue" />
                </Trigger>
                <Trigger Property="Validation.HasError" Value="True" >
                    <Setter Property="Effect">
                        <Setter.Value>
                            <DropShadowEffect Color="Red" ShadowDepth="0" BlurRadius="20" />
                        </Setter.Value>
                    </Setter>
                    <Setter Property="BorderThickness" Value="2" />
                    <Setter Property="BorderBrush" Value="Red" />
                    <Setter Property="Foreground" Value="Blue" />
                    <Setter Property="FontSize" Value="12" />
                </Trigger>
            </Style.Triggers>
        </Style>

        <Style x:Key="CenterCellStyle" TargetType="{x:Type DataGridCell}">
               <Setter Property="Template">
            <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridCell}">
                        <Grid>
                        <ContentPresenter HorizontalAlignment="center"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="RightCellStyle" TargetType="{x:Type DataGridCell}">
               <Setter Property="Template">
            <Setter.Value>
                    <ControlTemplate TargetType="{x:Type DataGridCell}">
                        <Grid>
                        <ContentPresenter HorizontalAlignment="Right"/>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
            </Setter>
        </Style>
    </Window.Resources>


                <DataGrid Grid.Row="1" AutoGenerateColumns="False" Name="grid_achCredit" RowStyle="{StaticResource RowStyleWithAlternation}" AlternationCount="2" FontSize="15" CanUserAddRows="False" CanUserDeleteRows="False" IsReadOnly="False" SelectionMode="Extended">
                    <DataGrid.Columns>
                        <DataGridTemplateColumn Header="" CellTemplate="{StaticResource isSelectedCheckBoxColumn}" IsReadOnly="False"/>
                        <DataGridTextColumn Header="ID" Width="Auto"  IsReadOnly="False" Binding="{Binding ID}" />
                        <DataGridTextColumn Header="TransDate" Width="Auto"  IsReadOnly="False" Binding="{Binding transactionDate, StringFormat=\{0:MM-dd-yyyy\}}" />
                        <DataGridTextColumn Header="Payor" Width="Auto"  IsReadOnly="False" Binding="{Binding payer}" />
                        <DataGridTextColumn Header="Description" Width="*"  IsReadOnly="False" Binding="{Binding description}" />
                        <DataGridTextColumn Header="Amount" Width="Auto"  IsReadOnly="False" Binding="{Binding amount, StringFormat=C}" />
                        <DataGridTextColumn Header="Balance" Width="Auto"  IsReadOnly="False" Binding="{Binding amount, StringFormat=C}" />
                        <DataGridTextColumn Header="Selected By" Width="*" IsReadOnly="False" Binding="{Binding lockedUser}"/>
                    </DataGrid.Columns>
                </DataGrid>
2

2 Answers

1
votes

The problem is when you click the CheckBox it's IsChecked property and IsSelected property of current DataGridRow set to true at the same time. Therefore IsChecked binding doesn't work the way expected.

One way around this (probably not the best) is to prevent the CheckBox to be checked by clicking (only uncheck is allowed). This can be achieved by making the CheckBox enabled only when it's checked:

        <CheckBox IsEnabled="{Binding RelativeSource={RelativeSource Self}, Path=IsChecked}"
                    IsChecked="{Binding Path=IsSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged,
                    RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type DataGridRow}}}">

So this means your CheckBox gets checked only when corresponding row gets selected, but can get unchecked manually.

1
votes

I ended up deciding to use the rowheaders to have a checkbox. Here is teh code I added to my datagrid

                    <DataGrid.RowHeaderTemplate>
                        <DataTemplate>
                            <Grid>
                                <CheckBox IsChecked="{Binding Path=IsSelected, Mode=TwoWay,
                                      RelativeSource={RelativeSource FindAncestor,
                                      AncestorType={x:Type DataGridRow}}}" Margin="0,-3,0,0">
                                    <CheckBox.LayoutTransform>
                                        <ScaleTransform ScaleX="2" ScaleY="2" />
                                    </CheckBox.LayoutTransform>
                                </CheckBox>
                            </Grid>
                        </DataTemplate>
                    </DataGrid.RowHeaderTemplate>