Expander Content is not Visible while expanding.

[Iden]

I have done grouping in the Telerik Gridview,My task is to Alter the header of the Group item at the run time , So i have implemented the below Code while clicking on the Expander i could able to get the content Nothing is displayed. 
Please help me on this 


 <telerik:RadGridView x:Name="telerikGrid" ItemsSource="{Binding Path=Collection}"  GridLinesVisibility="Horizontal" KeyboardNavigation.TabNavigation="Cycle" ShowGroupPanel="False"
 AutoGenerateColumns="False"  CanUserInsertRows="False" AutoExpandGroups="True" CanUserFreezeColumns="False" RowIndicatorVisibility="Collapsed" CanUserResizeColumns="False" CanUserSortColumns="True" CanUserReorderColumns="False" 
 MinHeight="360" MaxHeight="360" MaxWidth="880" MinWidth="880"  ScrollViewer.VerticalScrollBarVisibility="Auto" ScrollViewer.HorizontalScrollBarVisibility="Visible">
      <telerik:RadGridView.GroupRowStyle>

<Style TargetType="telerik:GridViewGroupRow">
                    <Setter Property="Background" Value="Red"/>
                    <Setter Property="BorderBrush" Value="Yellow"/>
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="{x:Type telerik:GridViewGroupRow}">
                                <telerik:RadExpander IsExpanded="True" Background="#2A5581" BorderThickness="1,1,1,1">
                                    <telerik:RadExpander.Header>
                                        <DockPanel>
                                            <Grid>
                                                <Rectangle Fill="White" Width="Auto" Margin="0,1,0,1" Stroke="Black"/>
                                                <TextBlock Text="{Binding Path=TextName}" Margin="4,0,4,0" Grid.Column="0" Grid.Row="0" Foreground="Black"/>
                                            </Grid>
                                            <Grid>
                                                <Rectangle Fill="Black" Width="Auto" Margin="0,1,0,1"/>
                                                <TextBlock Text="{Binding Path=TextName}" Margin="4,0,4,0" Foreground="White" />
                                            </Grid>
                                        </DockPanel>
                                  
                                    </telerik:RadExpander.Header>
                                    <telerik:RadExpander.Content>
                                        <ItemsPresenter/>
                                    </telerik:RadExpander.Content>
                                </telerik:RadExpander>
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>

                </Style>
            </telerik:RadGridView.GroupRowStyle>
<telerik:RadGridView.Columns>
 <telerik:GridViewColumn  MaxWidth="40" MinWidth="40">

          </telerik:GridViewcolumn>
</telerik:RadGridView.Columns>
         <telerik:RadGridView.Columns>
 <telerik:GridViewColumn  MaxWidth="40" MinWidth="40">

          </telerik:GridViewcolumn>
</telerik:RadGridView.Columns>
         <telerik:RadGridView.Columns>
 <telerik:GridViewColumn  MaxWidth="40" MinWidth="40">

          </telerik:GridViewcolumn>
</telerik:RadGridView.Columns>
</telerik:RadGridView>

[Vanya Pavlova]

Hello Arivarasu,



Thank you for sharing this snippet with us! Actually this behavior is the expected one. If you take a look at the default template of GridViewGroupRow you may see different elements laid out in a specific manner, following some rules. They are bound to the corresponding ViewModel and it is not  straight forward to make it work using a single RadExpander. Since it is not a trivial task, I would like to suggest you to modify the default template of GridViewGroupRow and alter the ToggleButton elements to match the desired design presented in RadExpander, while preserving the UI logic of GridViewGroupRow.



Greetings,
Vanya Pavlova
the Telerik team