Silverlight DataGrid Updating SelectedItem from code

Question

When I update a datagrid SelectedItem from code (via a bound object in a ViewModel), how to I get the visual grid to highlight the newly selected item?

Thanks,
Mark

UPDATE: This is still an issue for me. My SelectedItem property already implements change notification, but the datagrid is not VISUALLY displaying which row has been selected - i.e. it is not getting highlighted.

Answer 1

You need to implement the INotifyPropertyChanged interface on your ViewModel and have its SelectedItem property invoke the PropertyChanged event when its value is changes.

Answer 2

Mark,

I guess that you really verified that the SelectedItem has changed (you could set the Binding Mode to TwoWay temporarily to see if it works the other way round, by clicking the row you should see the highlight and SelectedItem's set-method executed). If yes, verify that you really exactly match the Property Name on PropertyChanged method invoke. Since you're not typesafe here, you might have made a spelling error. If no, check if your Databinding Attribute is set correctly. Another idea is that you might have changed the DataGrid's styles or template and now you are missing some of the Visual States. The DataGridRow can be styled using a style template. You have three selected states, called UnfocusedSelected (probably the right one), NormalSelected and MouseOverSelected.

You could try to make your own Visual State by using this template:

<Style TargetType="local:DataGridRow">
<Setter Property="IsTabStop" Value="False" />
<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="local:DataGridRow">
            <localprimitives:DataGridFrozenGrid Name="Root">
                <vsm:VisualStateManager.VisualStateGroups>
                    <vsm:VisualStateGroup x:Name="CommonStates">
                        <vsm:VisualState x:Name="Normal"/>
                    <vsm:VisualState x:Name="NormalAlternatingRow">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="0"/>
                            </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="MouseOver">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To=".5"/>
                            </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="NormalSelected">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1"/>
                            </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="MouseOverSelected">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1"/>
                            </Storyboard>
                        </vsm:VisualState>
                        <vsm:VisualState x:Name="UnfocusedSelected">
                            <Storyboard>
                                <DoubleAnimation Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Opacity" Duration="0" To="1"/>
                                <ColorAnimation Duration="0" Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="(Fill).Color" To="#FFE1E7EC"/>
                            </Storyboard>
                        </vsm:VisualState>
                    </vsm:VisualStateGroup>
                    <vsm:VisualStateGroup x:Name="ValidationStates">
                        <vsm:VisualState x:Name="Valid"/>
                        <vsm:VisualState x:Name="Invalid">
                            <Storyboard>
                                <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetName="BackgroundRectangle" Storyboard.TargetProperty="Visibility">
                                    <DiscreteObjectKeyFrame KeyTime="0" Value="Collapsed"/>
                                </ObjectAnimationUsingKeyFrames>
                                <DoubleAnimation Storyboard.TargetName="InvalidVisualElement" Storyboard.TargetProperty="Opacity" Duration="0" To="1"/>
                            </Storyboard>
                        </vsm:VisualState>
                    </vsm:VisualStateGroup>
                </vsm:VisualStateManager.VisualStateGroups>
                <Grid.RowDefinitions>
                    <RowDefinition/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="Auto" />
                    <ColumnDefinition/>
                </Grid.ColumnDefinitions>

                <Grid.Resources>
                    <Storyboard x:Key="DetailsVisibleTransition">
                        <DoubleAnimation Storyboard.TargetName="DetailsPresenter" Storyboard.TargetProperty="ContentHeight" Duration="00:00:0.1" />
                    </Storyboard>
                </Grid.Resources>

                <Rectangle x:Name="BackgroundRectangle" Grid.RowSpan="2" Grid.ColumnSpan="2" Opacity="0" Fill="#FFBADDE9"/>
                <Rectangle x:Name="InvalidVisualElement" Grid.RowSpan="2" Grid.ColumnSpan="2" Opacity="0" Fill="#FFF7D8DB"/>

                <localprimitives:DataGridRowHeader Grid.RowSpan="3" Name="RowHeader" localprimitives:DataGridFrozenGrid.IsFrozen="True" />
                <localprimitives:DataGridCellsPresenter Grid.Column="1" Name="CellsPresenter" localprimitives:DataGridFrozenGrid.IsFrozen="True" />
                <localprimitives:DataGridDetailsPresenter Grid.Row="1" Grid.Column="1" Name="DetailsPresenter" />
                <Rectangle Grid.Row="2" Grid.Column="1" Name="BottomGridLine" HorizontalAlignment="Stretch" Height="1" />
            </localprimitives:DataGridFrozenGrid>
        </ControlTemplate>
    </Setter.Value>
</Setter>
</Style>

This is a copy-paste from a good MSDN Article on customizing the DataGrid Styles. You could, for example, modify the UnfocusedSelected part of the template and see if you see any change when, for example, adding a red border around it or something.

Maybe it's worth a try. I hope that you know how to apply own styles. If not, here is another MSDN Resource.

I know, these are just tips, but maybe helpful at last.

best regards,
Thomas