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

Scheduler complex event templates

6 Answers 311 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Roy
Top achievements
Rank 1
Roy asked on 29 Jul 2014, 07:11 AM
I am having an issue creating a template for the Scheduler. What I am trying to do is set the event style class to one of four classes depending on the value of a given eventstate value from the model.  here is what I have for my whole kendo mvc schelduer with template. Can someone help show me how to write the template so it can do this and be in a valid state.

                @(Html.Kendo().Scheduler<SBAS_Web.Models.AppointmentModel>()
                      .Name("scheduler")
                      .Date(new DateTime(startdate.Year, startdate.Month, startdate.Day))
                      .StartTime(new DateTime(startdate.Year, startdate.Month, startdate.Day, 8, 00, 00))
                      .ShowWorkHours(true)
                      .Views(views => views.DayView(day => day.Selected(true)))
                      .Editable(false)
                      .AllDaySlot(false)
                      .EventTemplate(
                      "<div class='appointment-template  # if(AppointmentState == 'Default'){# DefaultColor #}#  if(AppointmentState == 'Completed'){# CompletedColor #}#  if(AppointmentState == 'ReadyForInvoicing'){# ReadyForInvoicingColor #}#  if(AppointmentState == 'Invoiced'){# InvoicedColor #}#'>" +
                        "<p>" +
                            "#= kendo.toString(start, 'hh:mm') # - #= kendo.toString(end, 'hh:mm') #" +
                        "</p>" +
                        "<p>#= title #</p>" +
                     "</div>")
                      .Timezone("Etc/UTC")
                      .DataSource(d => d
                          .Model(m =>
                          {
                              m.Id(f => f.AppointmentId);
                              m.Field(f => f.Title).DefaultValue("No title");
                              m.RecurrenceId(f => f.RecurrenceID);
                          })
                          .Events(e => e.Error("error_handler"))
                          .Read("Appointments_Read", "Appointment")

                        //.Update("Appointments_Update", "Appointment")
                      )
                      .Group(grp => grp.Orientation(SchedulerGroupOrientation.Vertical))
                )

6 Answers, 1 is accepted

Sort by
0
Georgi Krustev
Telerik team
answered on 31 Jul 2014, 06:52 AM
Hello Roy,

I believe the used template is invalid because kendo.template couldn't compile it. Modifying it a little bit does solve the problem. Here is a Dojo demo showing the applied modifications.

Regards,
Georgi Krustev
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Roy
Top achievements
Rank 1
answered on 31 Jul 2014, 07:29 AM
Thanks, that is great, but not sure how that would look if it was used in the MVC and not javascript? Do you have an example how that would look like.
0
Georgi Krustev
Telerik team
answered on 31 Jul 2014, 10:54 AM
Hello Roy,

There should be no difference regarding this string concatenation between C# and JavaScript. Could you please copied and let me know if it still does not work?

Regards,
Georgi Krustev
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Roy
Top achievements
Rank 1
answered on 31 Jul 2014, 05:25 PM
Thank for your help, after a little reworking of your example I was able to get this to work here is what I ended up with.
    <script id="event-template" type="text/x-kendo-template">
        <div class="appointment-template # if(AppointmentState == 'default') {#DefaultColor#} else if(AppointmentState == 'Completed') {#CompletedColor#} else if(AppointmentState == 'ReadyForInvoicing') {#ReadyForInvoicingColor#} else if(AppointmentState == 'Invoiced') {#InvoicedColor#}#">
             <p> #= kendo.toString(start, 'hh:mm') # - #= kendo.toString(end, 'hh:mm') #
            </p>
            <p>#= title #</p>
        </div>
    </script>
0
Roy
Top achievements
Rank 1
answered on 31 Jul 2014, 05:26 PM
If you respond back I will mark this closed.
0
Georgi Krustev
Telerik team
answered on 01 Aug 2014, 09:01 AM
Hello Roy,

I am glad that you were able to find the correct template configuration. If you have any additional questions about the same issue, please do not hesitate to re-open the thread.

Regards,
Georgi Krustev
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
Tags
Scheduler
Asked by
Roy
Top achievements
Rank 1
Answers by
Georgi Krustev
Telerik team
Roy
Top achievements
Rank 1
Share this question
or