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

How to choose which category of all day event to be rendered first and how to change the category background and font colour?

5 Answers 36 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
yolo
Top achievements
Rank 1
Veteran
yolo asked on 20 Jan 2021, 04:29 AM

Hi,

i'm having this issue, shown in the image category_render_error.png.

the all day event is being rendered according to category(as shown in different colours). I was expecting the green events to be rendered first followed by the turquoise event. But it doesn't work like this in this case. 

How to choose which category of all day event to be rendered first? i want to show all the green ones followed by turquoise.

Also, referring to category_render_error2.png , "C on leave" and "D on leave" event should use up the whole row, but the "Seminar" and "Z last day" is overlapping the green colour events.

 

can i know how to change the font colour and background colour of each of the category event?

thank you.

 

 

5 Answers, 1 is accepted

Sort by
0
yolo
Top achievements
Rank 1
Veteran
answered on 20 Jan 2021, 08:58 AM

referring to the image attached below, the part that is circled in yellow, how to expand the width of the event to fill the width of the column? For example, the "one to one with C" event should take up the whole width of the column instead of leaving some space at the right. can i know which part of the code should i edit to achieve this?

and for the circled in black part, may i know how to show the overflow title of the event and let the whole row to adapt to the event of the particular row. For instance, if the "briefing on new plan on ...." event's overflow:visible and height:max-content, the height will increase, the row of "3pm" should increase and adapt to the height of the event, to be sth like this to_sth_like_this.png

0
yolo
Top achievements
Rank 1
Veteran
answered on 21 Jan 2021, 03:42 AM
I'm aware that the space at the side of each event is intended, i need to expand all the events to show its title to be printed out on pdf.
0
Martin
Telerik team
answered on 21 Jan 2021, 04:37 PM

Hello, Cheong,

The Scheduler currently does not offer means to arrange the order of the All day events. In this forum thread you may find some useful information on the topic.

The background-color of the events can be set through the Resources dataColorField. For the text color, there is no option that would allow you to change it, so you will need a custom logic to select the correct k-event-template element and change its color.

If you wish to make the event as wide as the column cell, you can get the with of the td element in which the event is placed, and set it as a width for the corresponding .k-event element. I am not sure I understand the second part of your second post regarding the so_sth_like_this image, so I would appreciate some additional explanation on the matter.

Looking forward to your reply.

Regards,
Martin
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

0
yolo
Top achievements
Rank 1
Veteran
answered on 25 Jan 2021, 02:00 AM
[quote]Martin said:

Hello, Cheong,

The Scheduler currently does not offer means to arrange the order of the All day events. In this forum thread you may find some useful information on the topic.

The background-color of the events can be set through the Resources dataColorField. For the text color, there is no option that would allow you to change it, so you will need a custom logic to select the correct k-event-template element and change its color.

If you wish to make the event as wide as the column cell, you can get the with of the td element in which the event is placed, and set it as a width for the corresponding .k-event element. I am not sure I understand the second part of your second post regarding the so_sth_like_this image, so I would appreciate some additional explanation on the matter.

Looking forward to your reply.

Regards,
Martin
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

[/quote]

 

however, what if at a particular hour there are a few events, i tried using the width of td and divide by the number of events at that row to adjust the width of event, ended up the left of the event has to be adjusted again. ==, there's a lot of work to do in order to show the event on pdf. the export pdf button doesn't event help to show the whole event title.

0
Martin
Telerik team
answered on 26 Jan 2021, 03:28 PM

Hello, Cheong,

Regarding the width of the events, what I meant as a possible approach was to get the width of the cell and set it as width of the event wrapper element, so that the event would be as wide as the cell. I am not sure I understand the need to divide the width of the td element by the number of events. As for the height of the event, I already addressed that matter in the other forum thread on the matter.

Let me know if you have any further questions.

Regards,
Martin
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Scheduler
Asked by
yolo
Top achievements
Rank 1
Veteran
Answers by
yolo
Top achievements
Rank 1
Veteran
Martin
Telerik team
Share this question
or