Don't highight selected cell when user clicks in a data grid row.

Question

I have a DataGrid that is setup like this:

<DataGrid 
    AutoGenerateColumns="True"
    GridLinesVisibility="Horizontal"
    IsReadOnly="True" 
    ItemsSource="{Binding Documents}" 
    SelectionMode="Single"                  
    SelectionUnit="FullRow"
    />

Can somebody point me in the right direction for making the UI look as though the entire row is selected, by not highlighting the cell that is clicked?

Answer 1

You will want to expermient with cell styles. I think the default cell style checks for IsSelected and if it is the border will be colored with a black brush.

Because you are using AutoGenerateColumns, then you probably need to set the styles for the columns once they have been generated in the code behind.

I'm guessing that if you create a style, check for IsSelected and set the borderbrush to transparent, set the style for the datagrid's columns (ElementStyle + ElementEditingStyle) then you should be set. I'm writing this from the top of my head, but that's the general direction I think.

Answer 2

Thanks Marko for pointing me in the right direction. Here is how I changed my datagrid to make it not look like any cell was selected. Instead now it appears that the whole row is seleted. I chose to set the border's background to the current cells background so that I also didn't have to set the border thickness.

<DataGrid ...>
    <DataGrid.CellStyle>
        <Style TargetType="DataGridCell" >
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter
                        Property="BorderBrush" 
                        Value="{Binding RelativeSource={RelativeSource Self}, Path=Background}"/>
                </Trigger>
            </Style.Triggers>
        </Style>
    </DataGrid.CellStyle>
</DataGrid>