Unplanned
Last Updated: 07 Feb 2023 14:01 by Andrew
ben
Created on: 18 May 2020 07:30
Category: Grid
Type: Feature Request
33
Ability to hide the Header row?
Is there a way to hide the header?  I'm trying to use the Grid as a ListBox and it almost works using an empty span for the <HeaderTemplate>
7 comments
Andrew
Posted on: 07 Feb 2023 14:01
Worked great, thanks Nadezhda.
ADMIN
Nadezhda Tacheva
Posted on: 31 Jan 2023 09:08

Hi Andrew,

To achieve this, you may alter the CSS selector to target the headers of the parent Grid only.

Here is a runnable example demonstrating the approach: https://blazorrepl.telerik.com/mdOPdPut046FfZnN05.

I hope you will find it useful.

Regards,
Nadezhda Tacheva
Progress Telerik

Learn about the important changes coming in UI for Blazor 4.0 in January 2023!
Andrew
Posted on: 24 Jan 2023 19:00
This solution removes headers from any grids that may be in the detailFormat also. is there a way to hide headers on the top level grid, but still have them showing in the detail format grid?
ADMIN
Nadezhda Tacheva
Posted on: 01 Jul 2022 08:51

Hi Nemo,

We've marked the request as valid but it is not yet scheduled for implementation in specific release. The best way to keep track of its progress is to click the "Follow" button. Thus, you will receive an email when we update the status of the item.

Regards,
Nadezhda Tacheva
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: 24 Jun 2022 16:16

Hi Marin, though the CSS approach works, it would be nice if there was a property at the grid level to hide column headers. Is there a plan to add a property? Thanks.

Debra
Posted on: 01 Feb 2022 20:40
Thanks for the sample.  That works for me until/if the feature gets added.
ADMIN
Marin Bratanov
Posted on: 18 May 2020 07:32

Something like this can be a solution until a feature becomes available:

<style>
    .no-headers-grid .k-grid-header {
        display:none;
    }
</style>

<TelerikGrid Data="@MyData" Height="400px"
             Pageable="true" Class="no-headers-grid">
    <GridColumns>
        <GridColumn Field="@(nameof(SampleData.Id))" Width="120px" />
        <GridColumn Field="@(nameof(SampleData.Name))" Title="Employee Name" Groupable="false" />
        <GridColumn Field="@(nameof(SampleData.Team))" Title="Team" />
        <GridColumn Field="@(nameof(SampleData.HireDate))" Title="Hire Date" />
    </GridColumns>
</TelerikGrid>

@code {
    public IEnumerable<SampleData> MyData = Enumerable.Range(1, 30).Select(x => new SampleData
    {
        Id = x,
        Name = "name " + x,
        Team = "team " + x % 5,
        HireDate = DateTime.Now.AddDays(-x).Date
    });

    public class SampleData
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Team { get; set; }
        public DateTime HireDate { get; set; }
    }
}

 

Regards,
Marin Bratanov
Progress Telerik

Progress is here for your business, like always. Read more about the measures we are taking to ensure business continuity and help fight the COVID-19 pandemic.
Our thoughts here at Progress are with those affected by the outbreak.