Assign class to column

[Brian Vallelunga]

Is there any way to assign a class to specific columns? Ideally this would be part of the column configuration, but I'm willing to consider alternative methods.

The reasoning for this is that I want to be able to style certain columns differently. For example, on a grid showing days, I want the weekend days to have a different background color.

[Alexander Valchev]

Hi Brian,

You can modify the appearance of the grid with templates. The easiest way is using a rowTemplate, however if your grid is editable that solution is not recommended. In this jsFiddle page you can find an example showing the approach in action.

Regards,
Alexander Valchev
the Telerik team

[Brian Vallelunga]

Thanks, but templates at the row-level don't work well in my scenario. The reason is that the grid I'm working with has a dynamic set of columns associated with it. I'm actually sending the columns back as JSON using a datasource and then extracting them before building the grid.

I really don't want to have to specify a row template just to add a class tag to some td elements. I want the grid to handle the building of the rows.

A workaround I came up with was supplying an individual column template for those columns, and then using jQuery to modify the td element. Here's the code.

<span class='weekend'>#= kendo.toString(datecolumn, 'n1') #</span>

$("#grid td span.weekend").parent().toggleClass('weekend');

While this works, it would be nice if we could specify a td class in the column configuration element for situations like this.

[Alexander Valchev]

Hi Brian,

I am afraid, that at this stage, the only way to configure grid's appearance out of the box is through the templates. The workaround that you found is probably the best solution at the moment, in case templates does not fit in your project.
We will have your feedback in mind and will discuss the implementation of more styling options in the future.

Kind regards,
Alexander Valchev
the Telerik team