EventTemplate

[Otmar Ganahl]

Is there way to customize the look of an event in the scheduler?

Any Text or html-Text in EventTemplate does not work.

[Steven Littleford]

Yep - mee too!

I'd like to be able to change the color of an appointment based on the underlying data within the appointment.

[Hareesh Balasubramanian]

Hi Otmar, 

Greetings from Syncfusion Support. 

We have prepared the sample to customize the event using Template option which can be downloaded from the following link, 

https://www.syncfusion.com/downloads/support/forum/146005/ze/sample-269881390 

    <ScheduleEventSettings DataSource="@DataSource"> 

        <Template> 

            <div>Subject: @((context as dynamic).Subject)</div> 

            <div>StartTime: @((context as dynamic).StartTime)</div> 

            <div>EndTime:  @((context as dynamic).EndTime)</div> 

        </Template> 

    </ScheduleEventSettings> 

Please try the above sample, if you have any concerns please revert us back for further assistance. 

Note: We have removed the packages for the above sample. 

Regards, 

Hareesh B 

[Hareesh Balasubramanian]

Hi Steven, 

Greetings from Syncfusion Support. 

We have prepared the sample for your requirement using eventRendered event which can be downloaded from the following link, 

https://www.syncfusion.com/downloads/support/forum/146005/ze/sample-92143367 

  

public void onEventRendered(EventRenderedArgs args) 

{ 

    BlogSite bsObj = JsonConvert.DeserializeObject<BlogSite>(JsonConvert.SerializeObject(args.Data)); 

    DateTime localDate = bsObj.StartTime.ToLocalTime(); 

    var hours = localDate.TimeOfDay.Hours; 

    if (hours < 12) 

    { 

        (args.Element).AddClass(this.cus1_class); 

    } 

    else if (hours >= 12 && hours < 18) 

    { 

        (args.Element).AddClass(this.cus2_class); 

    } 

    else if (hours >= 18) 

    { 

        (args.Element).AddClass(this.cus3_class); 

    } 

} 

Please try the above sample, if you have any concerns please revert us back for further assistance. 

Note: We have removed the packages for the above sample. 

Regards, 

Hareesh B 

[Matthew]

Hi Hareesh,

I first had a problem with having to add Microsoft.CSharp to the project and making sure to add @using Microsoft.CSharp.RuntimeBinding

I have tried adapting this and I get a javascript error in the console - this.adaptor.processQuery is not a function

I am using version 17.2.0.35, however I am using a custom model for TemplateArgs and not using th standard fields the following code should make it clear:

   

       

   

   

       

   

@code{

    public class TemplateArgs

    {

        public string Workcode { get; set; }

        public string WorkcodeName { get; set; }

        public string CandidateName { get; set; }

        public string CandidateColor { get; set; }

        public string TimesheetColor { get; set; }

        public bool AllDay { get; set; }

    }

    List _summary = new List();

    public TemplateArgs model = new TemplateArgs();

    protected override async Task OnInitAsync()

    {

        _summary = await assignmentDataService.GetAssignmentItemSummary(7000, null, null, null, null);

        StateHasChanged();

    }

}

Can you see anything wrong with what I have done?

Please ignore, I was not setting start time and end time in my data source