This is a migrated thread and some comments may be shown as answers.

Kendo Grid

3 Answers 47 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

3 Answers, 1 is accepted

answered on 25 Apr 2018, 12:43 PM

Hello Ivan,

A possible approach is to pass the index of the dynamically generated columns to a method that will determine whether a custom class should be applied to the respective column's cells, depending on the currently selected month and the index of the column, e.g.:

https://plnkr.co/edit/TTZefrP7Vkzyb9HpqY82?p=preview

You will need to know in advance which column cells should be styled based on their values in advance (i.e. if January is chosen, the second column contains the respective data, if June is chosen, the fourth column contains the cells that should be styled, etc.)

I hope this helps.

Regards,
Dimiter Topalov
Progress Telerik

Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.

answered on 25 Apr 2018, 03:46 PM

Hello Dimiter,

Thanks for the quick answer. Problem is, that I don't know in advance which columns and how many columns will I get in response, so I'm creating my grid dynamically. Number of columns depends to the selected month and is always 2 + number of days in month. Column header titles are combination of short day name and date. Can your solution be used with this kind of data?

One more question, can I destroy the grid that has dynamic columns and repopulate it with completely other data set? Now, if I change the month, and get new data, headers from the initially selected month are preserved and no data is bound to the grid probably due to the column field nam mismatch.

answered on 27 Apr 2018, 09:36 AM

Hi Ivan,

We can programmatically update the array of items used to create the columns dynamically and we could specify which column to be highlighted manually as well. Check the following updated sample plunker demonstrating this approach:

https://plnkr.co/edit/RHS3uXUQzfMSwGErSEys?p=preview

Yes, we can pass new data to the grid and it will re - render. When data is updating, we could also use some custom logic to calculate the required column index used for the custom styling.

I hope this provides some more information that will point you in the right direction of achieving the desired custom scenario.

Regards,
Svetlin
Progress Telerik

Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.