FooterCellStyle - Applying a FooterCellStyle to a GridViewDataColumn causes values to dissappear...

[Rob]

Hello,

I am having a problem with the RadGridView - specifically applying a FooterCellStyle to one of my data columns...

Before applying this style, everything is working as expected.  After I apply this style, the column footers dissappear.... but only initially.  If I remove and readd the column (my app allows user to configure their own columns) then the footers re-appear.  I was hoping that this might be related to another issue I've posted (here) but I haven't been able to replicate it in a demo app yet.  The code that I am using to initially build the grid and insert the newly selected columns is the same.

The only thing that is "special" about this style is that it will NOT show the caption for the column footers. 

<Style x:Key="GridViewFooterCellStyle" TargetType="telerik:GridViewFooterCell">
        <Setter Property="Padding" Value="5,0,3,0"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="HorizontalContentAlignment" Value="Right"/>
        <Setter Property="FontWeight" Value="Bold"/>
        <Setter Property="Foreground" Value="Red" />
        <Setter Property="ContentTemplate">
            <Setter.Value>
                <DataTemplate>
                    <TextBlock Text="{Binding FormattedValue}" TextAlignment="Right" />
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="telerik:GridViewFooterCell">
                    <Border x:Name="PART_FooterCellBorder" BorderBrush="Blue" BorderThickness="0,1,1,0" Background="#FFFFFFFF">
                        <ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                        </ContentPresenter>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

[Vanya Pavlova]

Hi Rob,

 
You can show the Caption in this custom GridViewFooterCell style through adding another TextBlock element in the defined DataTemplate and bind it to the Caption property, please use the following:

<Style x:Key="GridViewFooterCellStyle" TargetType="telerik:GridViewFooterCell">
        <Setter Property="Padding" Value="5,0,3,0"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="HorizontalContentAlignment" Value="Right"/>
        <Setter Property="FontWeight" Value="Bold"/>
        <Setter Property="Foreground" Value="Red" />
        <Setter Property="ContentTemplate">
            <Setter.Value>
                <DataTemplate>
                    <StackPanel Orientation="Horizontal">
                        <TextBlock Text="{Binding Caption}" TextAlignment="Right"/>
                    <TextBlock Text="{Binding FormattedValue}" TextAlignment="Right" />
                    </StackPanel>
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="telerik:GridViewFooterCell">
                    <Border x:Name="PART_FooterCellBorder" BorderBrush="Blue" BorderThickness="0,1,1,0" Background="#FFFFFFFF">
                        <ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                        </ContentPresenter>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

 

Kind regards,
Vanya Pavlova
the Telerik team

[Rob]

Hi Vanya,

The problem wasnt that I wanted to show the caption - quite the opposite...  The problem is that if I apply this style, the footer dissappears completely until I remove/readd the columns.

Thanks,
 Rob

[Vanya Pavlova]

Hello Rob,

Please let us know if you manage to reproduce the problem in a simple project. You can attach it in a new support thread and we will debug it locally to find the issue.

Kind regards,
Vanya Pavlova
the Telerik team

[Rob]

Hi Vanya,

I still haven't managed to reproduce this outside of our app.  I have managed to figure out that it's not the application of the style that causes the problem, it's the application of the ContentTemplate inside the style that makes the items dissappear...  (not sure if that might help or not)

<Style x:Key="GridViewFooterCellStyle" TargetType="telerik:GridViewFooterCell">
      <Setter Property="VerticalContentAlignment" Value="Center"/>
      <Setter Property="HorizontalContentAlignment" Value="Right"/>
      <Setter Property="FontWeight" Value="Bold"/>
      <Setter Property="Foreground" Value="Red" />
      <!--
      <Setter Property="ContentTemplate">
         <Setter.Value>
            <DataTemplate>
               <TextBlock Text="{Binding FormattedValue}" TextAlignment="Right" />
            </DataTemplate>
         </Setter.Value>
      </Setter>
      -->
      <Setter Property="Template">
         <Setter.Value>
            <ControlTemplate TargetType="telerik:GridViewFooterCell">
               <Border x:Name="PART_FooterCellBorder" BorderBrush="Green" BorderThickness="0,1,1,0" Background="#FFFFFFFF">
                  <ContentPresenter Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                   </ContentPresenter>
                </Border>
             </ControlTemplate>
          </Setter.Value>
       </Setter>
    </Style>

If I uncomment the "ContentTemplate", then my problem occurs.  I started trying to work around this problem and made some progress until I was stumped.  I changed the ContentPresenter to bind like this:

Content="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource MyConverter}}"

and then inside MyConverter, I get an AggregateResultsList object...  is there a way to change that object somehow to format the values?

 

 

 

 

[Vanya Pavlova]

Hi Rob,

 
You have defined a ContentTemplate in your custom GridViewFooterCellStyle, however in the ContentPresenter there is no ContentTemplate defined, so you will not get anything different than empty space in this footer, as shown below:

<ContentPresenter Content="{TemplateBinding Content}" ContentTemplate="{TemplateBinding ContentTemplate}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                   </ContentPresenter>

If you need to format this value just set the ResultFormatString in your AggregateFunction.
Please check the attached project and let me know how I can assist your further.

Best wishes,
Vanya Pavlova
the Telerik team

[Rob]

Hi again,

Yes, that project indeed solves part of my problem.  When I define both a Caption and ResultFormatString, then they are displayed in both the GroupHeader and the ColumnFooter.  I would like to only see the caption in the Groupheader (see attached picture).  By defining the GridViewDataColumn.FooterCellStyle.ContentTemplate, it seems to work.

My initial problem however, is that when I apply this to my project, there is funny behavior.  It appears to be some sort of timing condition since it works only after the initial load occurs.  When the grid is initially loaded, the values are blank for some reason in the ColumnFooter, then after some manipulation (like a DataContext change) of the grid, they show up.

<Grid x:Name="LayoutRoot" Background="White" DataContext="{Binding Source={StaticResource SampleDataSource}}">
        <Grid.RowDefinitions>
            <RowDefinition Height="1*" />
            <RowDefinition Height="10" />
            <RowDefinition Height="1*" />
        </Grid.RowDefinitions>
        <telerik:RadGridView Grid.Row="0" AutoGenerateColumns="False" ShowColumnFooters="True" ItemsSource="{Binding Collection}">
            <telerik:RadGridView.Columns>
                <telerik:GridViewDataColumn Header="Price" DataFormatString="{}{0:c}"  DataMemberBinding="{Binding Property1}">
                    <telerik:GridViewDataColumn.AggregateFunctions>
                        <telerik:SumFunction Caption="Total Price:" ResultFormatString="{}{0:c}" />
                    </telerik:GridViewDataColumn.AggregateFunctions>
                    <!--<telerik:GridViewDataColumn.FooterCellStyle>
                        <Style TargetType="telerik:GridViewFooterCell">
                            <Setter Property="ContentTemplate">
                                <Setter.Value>
    <DataTemplate>
    <TextBlock Text="{Binding FormattedValue}" TextAlignment="Right" />
    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </telerik:GridViewDataColumn.FooterCellStyle>-->
                </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn Header="Married?" DataMemberBinding="{Binding Property2}"/>
                <telerik:GridViewDataColumn Header="Name" DataMemberBinding="{Binding Property3}"/>
                <telerik:GridViewDataColumn Header="CompanyName" DataMemberBinding="{Binding Property4}"/>
            </telerik:RadGridView.Columns>
        </telerik:RadGridView>
        <telerik:RadGridView Grid.Row="2" AutoGenerateColumns="False" ShowColumnFooters="True" ItemsSource="{Binding Collection}">
            <telerik:RadGridView.Columns>
                <telerik:GridViewDataColumn Header="Price" DataFormatString="{}{0:c}"  DataMemberBinding="{Binding Property1}">
                    <telerik:GridViewDataColumn.AggregateFunctions>
                        <telerik:SumFunction Caption="Total Price:" ResultFormatString="{}{0:c}" />
                    </telerik:GridViewDataColumn.AggregateFunctions>
                    <telerik:GridViewDataColumn.FooterCellStyle>
                        <Style TargetType="telerik:GridViewFooterCell">
                            <Setter Property="ContentTemplate">
                                <Setter.Value>
                                    <DataTemplate>
    <TextBlock Text="{Binding FormattedValue}" TextAlignment="Right" />
    </DataTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                    </telerik:GridViewDataColumn.FooterCellStyle>
                </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn Header="Married?" DataMemberBinding="{Binding Property2}"/>
                <telerik:GridViewDataColumn Header="Name" DataMemberBinding="{Binding Property3}"/>
                <telerik:GridViewDataColumn Header="CompanyName" DataMemberBinding="{Binding Property4}"/>

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

    </Grid>

asdasd

[Vanya Pavlova]

Hi Rob,

 
The result from the attached picture can be easily achieved through adding a single TextBlock and bind its Text property to the Caption of this aggregate function, please refer to the following style:

<Grid x:Name="LayoutRoot" Background="White" DataContext="{Binding Source={StaticResource SampleDataSource}}">
        <telerik:RadGridView  AutoGenerateColumns="False" ShowColumnFooters="True" ItemsSource="{Binding Collection}">
            <telerik:RadGridView.Columns>
                <telerik:GridViewDataColumn  Header="Price" DataFormatString="{}{0:c}"  DataMemberBinding="{Binding Property1}">
                    <telerik:GridViewDataColumn.AggregateFunctions>
                        <telerik:SumFunction Caption="Total Price: " ResultFormatString="{}{0:c}"/>
                        </telerik:GridViewDataColumn.AggregateFunctions>
                    <telerik:GridViewDataColumn.FooterCellStyle>
                        <Style TargetType="telerik:GridViewFooterCell">
                            <Setter Property="ContentTemplate">
                                <Setter.Value>
                                       <DataTemplate>
                                        <StackPanel Orientation="Horizontal">
                                            <TextBlock Text="{Binding Caption}"/>
                                       <TextBlock Text="{Binding FormattedValue}" TextAlignment="Right" />
                                       </StackPanel>
                                       </DataTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>
                        </telerik:GridViewDataColumn.FooterCellStyle>
                    </telerik:GridViewDataColumn>
                <telerik:GridViewDataColumn  Header="Name" DataMemberBinding="{Binding Property3}"/>
                <telerik:GridViewDataColumn  Header="CompanyName" DataMemberBinding="{Binding Property4}"/>

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

    </Grid>

Also you may see the result at the attached picture.
I will be waiting for your response.

Regards,
Vanya Pavlova
the Telerik team

[Rob]

"I will be waiting for your response." :)

Actually what I want is NOT to display the caption in the column totals and only show the caption in the group header totals...  That's why I'm trying to adjust the ContentTemplate of the GridViewFooterCell to only show the FormattedValue.

I think the root of my problem is somehow related to how we build the columns (in code behind) and apply the styles.  For some reason, it takes us to rebuild the grid a second time for everything to update properly (even though internally it just runs through the same code twice for rebuilding the columns).

While playing with this, I noticed another problem which is probably related.  I removed the "Key" from my GridViewFooterCell style in hopes that maybe it would apply it generically and fix the problems (I think you gave me that solution for another problem I had and it worked well.)  Strangely, it didn't apply the style again until I reloaded the grid a second time... 

[Vanya Pavlova]

Hi Rob,

 
Thank you for the detailed information. I believe that the issue is specific, it might be related to dynamically created columns and in the mechanism by which the RadGridView is reloaded. It could be great if you can send us a small application via support ticket which we can investigate by our side, because currently I could only guess what is going on in your project. 

Best wishes,
Vanya Pavlova
the Telerik team

[Rob]

Hi Vanya,

I managed to replicate this ticket and you are correct it was to do with building columns via code and doesn't really have any relation to my styles...

The ticket # is 384863.