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.
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/.
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?
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.
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/.