Display Entry in a different colour depending on property


Is it possible to display the events for Non-Chargable and chargable in different colours based on a property value?



1 Reply

AK Alagumeena Kalaiselvan Syncfusion Team April 9, 2020 12:50 PM UTC

Hi Alex, 

Greetings from Syncfusion support! 

Yes, It is possible to display the events in different color by defining events using EventTemplate and you can apply the preferred  color to the event container element. Refer the below code for that 

<SfSchedule TValue="WebinarData" Width="100%" Height="650px" SelectedDate="@(new DateTime(2020, 1, 16))"> 
    <ScheduleViews> 
        <ScheduleView Option="View.Week"> 
            <EventTemplate> 
                @{ 
                    var webinarData = (context as WebinarData); 
                    <div class='template-wrap' style="background-color: @webinarData.CategoryColor"> 
                        <div class="subject">@(webinarData.Subject)</div> 
                        <div class="time">Time: @(getTimeString(webinarData.StartTime)) - @(getTimeString(webinarData.EndTime))</div> 
                        <div class="description">@(webinarData.Description)</div> 
                    </div> 
                } 
            </EventTemplate> 
        </ScheduleView> 
        ... 
   </ScheduleViews> 
    <ScheduleEventSettings TValue="WebinarData" DataSource="@DataSource"> 
    </ScheduleEventSettings> 
</SfSchedule> 

The above sample can be downloaded from the below link 

Kindly get back to us where the solution is helpful to you. 

Regards 
Alagumeena.K 


Loader.
Up arrow icon