Unplanned
Last Updated: 19 Apr 2023 08:57 by ADMIN
Rytis
Created on: 26 Jan 2022 09:53
Category: Grid
Type: Feature Request
12
GroupHeaderColumnTemplate to allow the content of the Group Header be aligned with the columns
Currently, the GroupHeaderTemplate takes up the whole row. Once it exposes aggregates for all the fields, I will need an option to align them with the corresponding columns.
8 comments
ADMIN
Dimo
Posted on: 19 Apr 2023 08:57

Hello Joseph,

This request is awaiting votes and customer demand for us to prioritize and schedule it for implementation. Please follow it to receive updates (if you haven't already).

Regards,
Dimo
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Joseph
Posted on: 19 Apr 2023 02:08
Any update on this request?  We're having to do some pretty hacky stuff so make grids look like Telerik Reporting.
ADMIN
Dimo
Posted on: 31 Mar 2023 09:04

Hello Chris,

I assume that you wanted to link this jQuery Grid setting instead?

A possible workaround is to construct a GroupHeaderTemplate that mimics a table row. You will need to take care of the proper "column" alignment with the main Grid table, depending on the column widths.

@using Telerik.DataSource

<TelerikGrid Data="@GridData"
             Pageable="true"
             Sortable="true"
             Groupable="true"
             FilterMode="GridFilterMode.FilterRow"
             OnStateInit="@( (GridStateEventArgs<Employee> args) => OnGridStateInit(args) )">
    <GridColumns>
        <GridColumn Field="@nameof(Employee.Name)" />
        <GridColumn Field="@nameof(Employee.Team)">
            <GroupHeaderTemplate>
                <table class="group-header-table">
                    <tr>
                        <td>Name content</td>
                        <td>Team content</td>
                        <td>Salary content</td>
                        <td>OnVacation content</td>
                    </tr>
                </table>
            </GroupHeaderTemplate>
        </GridColumn>
        <GridColumn Field="@nameof(Employee.Salary)" />
        <GridColumn Field="@nameof(Employee.OnVacation)" />
    </GridColumns>
</TelerikGrid>

<style>
    .k-grouping-row > .k-table-td:has(.group-header-table) {
        padding-top: 0;
        padding-bottom: 0;
        padding-right: 0;
    }

    .group-header-table {
        width: 100%;
        table-layout: fixed;
        border-spacing: 0;
    }
</style>

@code {
    private List<Employee> GridData { get; set; }

    private void OnGridStateInit(GridStateEventArgs<Employee> args)
    {
        var gridState = new GridState<Employee>();

        gridState.GroupDescriptors = new List<GroupDescriptor>();

        gridState.GroupDescriptors.Add(new GroupDescriptor()
        {
            Member = nameof(Employee.Team),
            MemberType = typeof(string)
        });

        args.GridState = gridState;
    }

    protected override void OnInitialized()
    {
        GridData = new List<Employee>();
        var rnd = new Random();

        for (int i = 1; i <= 20; i++)
        {
            GridData.Add(new Employee()
            {
                Id = i,
                Name = "Name " + i,
                Team = "Team " + (i % 4 + 1),
                Salary = (decimal)rnd.Next(1000, 3000),
                OnVacation = i % 3 == 0
            });
        }
    }

    public class Employee
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Team { get; set; }
        public decimal Salary { get; set; }
        public bool OnVacation { get; set; }
    }
}

Regards,
Dimo
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Chris
Posted on: 30 Mar 2023 14:38

We are working to replace your JQuery grid with a Blazor one and the unavailable Column Group Header template is blocking the initiative.  Are there any documented/recommended workarounds? If there are no documented workarounds can you provide a strategy to implement this?

 

Kendo Jquery Group Header Column Template documentation

ADMIN
Dimo
Posted on: 17 Oct 2022 10:49

Hello Srihari,

When the item status is "Unplanned", this means that the task is not scheduled for implementation for any specific release.

We prioritize requests based on their popularity, so it may take some time for this one to gain enough interest. Whenever this happens and we add the task to our short-term backlog, we will update the status.

Regards,
Dimo
Progress Telerik

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Nemo
Posted on: 10 Oct 2022 17:30
Yes, I am following already. Any more info regarding this feature request? It's been a while so thought of checking.
ADMIN
Marin Bratanov
Posted on: 08 Oct 2022 08:45

Hello,

The best way to get updates is to click the Follow button on the portal page.

This will send you emails for status changes (e.g., when a release is known).

 

Regards,
Marin Bratanov
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Nemo
Posted on: 07 Oct 2022 17:21
Hi, any update on this feature request? Thanks.