How to set Telerik.Web.Mvc.UI.GridColumnSettings.HeaderTemplate

[Sakshi]

Hello,

I have created wrapper for tekerik grid in c# MVC code.

Now I want to add checkbox/image in header instead of plain text.

I have found one property named "Telerik.Web.Mvc.UI.GridColumnSettings.HeaderTemplate" but it is of type delegate Action.

I do not have idea how to set the header template and finally checkbox/image.

 

Kindly suggest.

 

Thanks & Regards

Nitin kumar

[Anton Mironov]

Hello Sakshi,

Thank you for the details provided.

In order to achieve the desired behavior, I would recommend using HTML elements as a string for a parameter in the Header Template of the Kendo UI Grid.

Here is an example for a checkbox in the header of the column:

columns.Bound(p => p.ShipName).HeaderTemplate("<input type='checkbox' id='check - all' /><label for='check - all'>Check All</label>");

Example of implementing an image in the header template:

columns.Bound(p => p.ShipCity).HeaderTemplate("<img src='HERE INSERT LINK TO AN IMAGE' alt='Girl in a jacket' width='100' height='100'>");

Attached is a sample project that I prepared for the case. It includes the implementations above. Make the needed tests locally with the project attached and let me know if further assistance is needed.

 

Kind Regards,
Anton Mironov
Progress Telerik