Using an image instead of text in title?

[dccxz]

Hello,
How do I go about inserting an image into a column header instead of text in the Grid?

Also, if row templates are used - is it possible to maintain alternate row highlight? As soon as I start using templates - there is no alternate row highlighting any longer
Thanks, I appreciate any help!

[dccxz]

Hello,
Do I really need to create a ticket to get this answered? :)

[Alexander Valchev]

Hello Ivan,

The forums are a community resource - we monitor them, but we do not guarantee a timely reply here. If you need a quick answer, it is best to use the support ticketing system - it assigns a response time to all your tickets (based on the license) and automatically forwards the ticket to the team that works on the corresponding product.

As for your questions, inserting images in column header is not supported out of the box. A possible workaround would be to modify the HTML mark up of the corresponding elements via jQuery. For example:

var header = $("#grid .k-grid-header thead");
header
    //finds the corresponding field based on grid field titles
    .find("[data-field='FirstName'] a.k-link")
        //modifies inner HTML
        .html("<img src='person.png' alt='img'/>");

Concerning your second question - I suggest to define an altRowTemplate, which will allow you to modify the appearance of the alternate rows. Here is the syntax:

//defines rowTemplate
rowTemplate: kendo.template($("#template").html()),
//defines altRowTemplate
altRowTemplate: kendo.template($("#altTemplate").html())

I hope this information helps. For convenience I am attaching a sample page that uses the described approaches in action.

Kind regards,
Alexander Valchev
the Telerik team

[dccxz]

Thank you very much Alexander.

I hope the images in the header can be added in future releases.

[Alexander Valchev]

Hi Ivan,

The implementation of a column header template option is not planned for the next official release. My suggestion is to add this as feature request in the user voice forum. If it turns out to be popular, we will include this improvement in our schedule.

Regards,
Alexander Valchev
the Telerik team

[Avi]

Any news about this one after two years?

[Alexander Valchev]

Hi Avi,

The Grid has a column headerTemplate now. Please see the corresponding documentation:

• http://docs.telerik.com/kendo-ui/api/web/grid#configuration-columns.headerTemplate

Regards,
Alexander Valchev
Telerik