Headers for Column Groups

6 posts, 0 answers
  1. Kevin Blanton
    Kevin Blanton avatar
    9 posts
    Member since:
    Sep 2012

    Posted 28 Apr 2010 Link to this post

    We are in the process of rewriting and old VB 6 app in silverlight.  We are using the Telerik GridView control for the data grids.

    In the old application we were able to have several groups of columns that head a common group header.

    I have attached a screenshot with an example of what we are trying to accomplish.

    Is it possible to do this with the Telerik GridView?

    Thanks for your assistance,

    Kevin
  2. Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 28 Apr 2010 Link to this post

    Hello Kevin Blanton,

    This feature is not yet integrated in RadGridVIew. However with the help of some external code it is achievable.
    Please review the approach demonstrated in my blogpost . I believe it will help you decide whether this is applicable for your project.

    Regards,
    Pavel Pavlov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  3. DevCraft banner
  4. Henri
    Henri avatar
    74 posts
    Member since:
    Aug 2008

    Posted 26 Apr 2011 Link to this post

    Hi,

    I implemented the code mentioned in the blog post.
    I'm using the latest version of the Controls (2011 Q1 SP1).

    My problem is the following.
    The content of my headers is dynamic, and therefor I did the binding in the HeaderCellStyle. How can I achieve the same thing in the secondary header? My present code looks like this...

                                <telerik:GridViewDataColumn Width="65" IsFilterable="False" CellStyle="{StaticResource GridCellStyle}">
                                        <telerik:GridViewDataColumn.HeaderCellStyle>
                                        <Style TargetType="telerik:GridViewHeaderCell">
                                            <Setter Property="Background" Value="LightYellow"/>
                                            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
                                            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
                                            <Setter Property="Margin" Value="0"/>
                                            <Setter Property="Padding" Value="0,0,0,0"/>
                                            <Setter Property="Foreground" Value="Black"/>
                                            <Setter Property="BorderThickness" Value="0"/>
                                            <Setter Property="ContentTemplate">
                                                <Setter.Value>
                                                    <DataTemplate>
                                                        <Grid>
                                                            <Grid.RowDefinitions>
                                                                <RowDefinition></RowDefinition>
                                                                <RowDefinition></RowDefinition>
                                                            </Grid.RowDefinitions>
                                                            <Grid.ColumnDefinitions>
                                                                <ColumnDefinition></ColumnDefinition>
                                                            </Grid.ColumnDefinitions>
                                                            <Border BorderBrush="Gray" BorderThickness="0,0,0,1">
                                                                <TextBlock TextAlignment="Right" Padding="0,0,5,0" Text="{Binding Text, ElementName=month1}" FontWeight="Bold"/>
                                                            </Border>
                                                            <Border BorderBrush="Gray" BorderThickness="0,0,1,0" Grid.Row="1">
                                                                <TextBlock TextAlignment="Center" Text="Plan" FontWeight="Bold"/>
                                                            </Border>
                                                        </Grid>
                                                    </DataTemplate>
                                                </Setter.Value>
                                            </Setter>
                                        </Style>
                                        </telerik:GridViewDataColumn.HeaderCellStyle>
                                    <telerik:GridViewDataColumn.CellTemplate>
                                                    <DataTemplate>
                                                        <Border BorderBrush="Black" BorderThickness="1,0,0,0" Padding="2,0,2,0" Background="{Binding Back1}">
                                                            <TextBlock Text="{Binding Plan1,StringFormat=N}" TextAlignment="Right"/>
                                                        </Border>
                                                    </DataTemplate>
                                    </telerik:GridViewDataColumn.CellTemplate>
                                    <telerik:GridViewDataColumn.CellEditTemplate>
                                        <DataTemplate>
                                            <Border BorderBrush="Black" BorderThickness="1,0,0,0" Padding="2,0,2,0" Background="{Binding Back1}">
                                                <TextBox Text="{Binding Plan1,StringFormat=N,Mode=TwoWay}" TextAlignment="Right" IsReadOnly="{Binding CanEdit1}"/>
                                            </Border>
                                        </DataTemplate>
                                    </telerik:GridViewDataColumn.CellEditTemplate>
                                </telerik:GridViewDataColumn>

  5. Pavel Pavlov
    Admin
    Pavel Pavlov avatar
    2039 posts

    Posted 29 Apr 2011 Link to this post

    Hello Henri,

    Since the attached behavoir is not a real visual element , it does not participate in the Namescope of the visual tree, so indeed something like Caption={Binding Text, ElementName ... } is not expected to work .

    The only alternative I can think off is to set the binding by code
    e.g.  Modify the following method  in SecondaryHeaderXaml.cs, adding the yellow line.
    private void PlaceCommonHeaders()
            {
                if (this.CommonHeaders.Count > 0 && this.CommonHeaders[0].Parent != null)
                    return;
      
                foreach (var commonHeader in this.CommonHeaders)
                {
                    commonHeader.SetValue(Grid.ColumnSpanProperty, commonHeader.ColumnSpan);
                    commonHeader.SetValue(Grid.ColumnProperty, commonHeader.StartColumnIndex);
                      
                    commonHeader.SetBinding(CommonHeader.CaptionProperty, new Binding("Text"){ Source = XXXXXX);
                    this.SecondaryHeadersGrid.Children.Add(commonHeader);
                }
                  
                CommonHeader lastEmptyHeader = new CommonHeader();
                lastEmptyHeader.SetValue(Grid.ColumnProperty, this.SecondaryHeadersGrid.ColumnDefinitions.Count);
                this.SecondaryHeadersGrid.Children.Add(lastEmptyHeader);
      
            }
    * Replace XXXXX, with a refference to the source for the binding.

    Best wishes,
    Pavel Pavlov
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  6. Ernie S
    Ernie S avatar
    33 posts
    Member since:
    Apr 2014

    Posted 02 Dec 2014 Link to this post

    Hi.

    Was this every implemented in a later version of the control?  Looking to do the same thing. 

    The link above is broken, here is the new one:

    http://blogs.telerik.com/xamlteam/posts/09-12-04/adding-additional-power-to-radgridview-for-silverlight-with-attached-behaviors.aspx

    Thanks
    Ernie
  7. Dimitrina
    Admin
    Dimitrina avatar
    3769 posts

    Posted 03 Dec 2014 Link to this post

    Hi,

    The closest solution to your requirement I can suggest is our Merged Column Headers. You can follow the documentation in this help article, where you can find details on how to define column header groups. 

    I hope this helps.


    Regards,
    Dimitrina
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
DevCraft banner