Silverlight : How to access control in DataGrid RowDetailTemplate

Question

I have below code and I wanted to get the "btnUpdate" button control in the RowDetailsTemplate and set the visibility in code behind. How can I do that? Any advice is appreciated and thanks in advance.

    <Grid x:Name="LayoutRoot" Background="White">
    <Grid  HorizontalAlignment="Left" Name="grid1" VerticalAlignment="Top" >
        <Grid.RowDefinitions>
            <RowDefinition Height="40" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>

        </Grid.ColumnDefinitions>
        <Grid  HorizontalAlignment="Left" Name="grid2" VerticalAlignment="Top" Grid.RowSpan="2">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="500" />
                <ColumnDefinition Width="80*" />
                <ColumnDefinition Width="111*" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Button Content="Refresh"  Click="btnRefresh_Click" Grid.Column="1" Height="23" HorizontalAlignment="Right" Name="btnRefresh" VerticalAlignment="Top" Width="80"/>
            <Button Content="Add"  Click="btnAdd_Click" Grid.Column="2" Height="23" HorizontalAlignment="Right" Name="btnInsert" VerticalAlignment="Top" Width="80" />
            <sdk:Label Height="28" HorizontalAlignment="Left" Name="Title" VerticalAlignment="Top" Content="Title" HorizontalContentAlignment="Left" FontSize="20" FontWeight="Bold" Width="Auto"/>
        </Grid>
        <data:DataGrid x:Name="OverviewDataGrid" Grid.Row="1" AutoGenerateColumns="False" RowEditEnded="OverviewDataGrid_RowEditEnded" SelectionChanged="OverviewDataGrid_SelectionChanged">
            <data:DataGrid.Columns>
                <data:DataGridTextColumn Header="Code" Binding="{Binding code, TargetNullValue=(enter code)}" IsReadOnly="True"></data:DataGridTextColumn>
                <data:DataGridTextColumn Header="Description" Binding="{Binding description}" IsReadOnly="True"></data:DataGridTextColumn>
                <data:DataGridTemplateColumn Header="Delete">
                    <data:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Button x:Name="btnDelete" Content="Delete" Click="btnDelete_Click"></Button>
                        </DataTemplate>
                    </data:DataGridTemplateColumn.CellTemplate>
                </data:DataGridTemplateColumn>

                <data:DataGridTemplateColumn >
                    <data:DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <Button x:Name="btnCollapse" Grid.Column="0" Grid.Row="0" Content="+" Click="btnCollapse_Click" HorizontalAlignment="Center" Width="20" VerticalAlignment="Center" />
                        </DataTemplate>
                    </data:DataGridTemplateColumn.CellTemplate>
                </data:DataGridTemplateColumn>
            </data:DataGrid.Columns>

            <data:DataGrid.RowDetailsTemplate>
                <DataTemplate>
                    <Border BorderThickness="0" Background="BlanchedAlmond" Padding="1">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="0.17*"/>
                                <ColumnDefinition Width="0.30*"/>
                                <ColumnDefinition Width="0.17*"/>
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Grid.RowDefinitions>
                                <RowDefinition />
                                <RowDefinition />
                                <RowDefinition />
                                <RowDefinition />
                                <RowDefinition />
                                <RowDefinition />
                                <RowDefinition />
                                <RowDefinition />
                                <RowDefinition />
                            </Grid.RowDefinitions>

                            <TextBlock FontSize="12" Text="Code : " VerticalAlignment="Center" Grid.Column="0" Grid.Row="0" Margin="1"/>
                            <TextBlock FontSize="12" FontWeight="Bold" Foreground="MidnightBlue" Text="{Binding code}" VerticalAlignment="Center" HorizontalAlignment="Left" Grid.Column="1" Grid.Row="0" Margin="1" Grid.ColumnSpan="3"/>

                            <TextBlock FontSize="12" Text="Description: " VerticalAlignment="Center" Grid.Column="0" Grid.Row="1" Margin="1"/>
                            <TextBox FontSize="12" Text="{Binding description, Mode=TwoWay}" Width="350" TextWrapping="NoWrap"  HorizontalAlignment="Left" 
                                     AcceptsReturn="True" Grid.Column="1" Grid.Row="1" Margin="1" Grid.ColumnSpan="3"/>
                            <Button x:Name="btnUpdate1" Content="Update" Click="btnUpdate_Click"  HorizontalAlignment="Left" Grid.Column="1" Grid.Row="4" Margin="1"/>
                        </Grid>
                    </Border>
                </DataTemplate>
            </data:DataGrid.RowDetailsTemplate>
        </data:DataGrid>
    </Grid>
</Grid>

You generally can't access the object model of elements inside a DataTemplate -- have to use a binding from XAML instead. — McGarnagle, Jan 07 '15 at 17:54

score 0 · Answer 1 · answered Jan 08 '15 at 06:17

Follow below steps to get the control in RowDetailsTemplate.

Add loadingRowDetails event {LoadingRowDetails="yourDataGrid_LoadingRowDetails"} into datagrid in xaml.

Add below code at xaml class

    private void yourDataGrid_LoadingRowDetails(object sender, DataGridRowDetailsEventArgs e)
{           
    Button btn = (e.DetailsElement as FrameworkElement).FindName("btnUpdate") as Button;
    if (ok.Equals(false))
        btn.Visibility = System.Windows.Visibility.Collapsed;
}

Silverlight : How to access control in DataGrid RowDetailTemplate

1 Answers1