Scheduler Template Not Working As Expected

[Scott]

Hello,

I have a scheduler with a day, week,  month, and agenda view. I have set up a template for the agenda view and it is displaying properly. I also have a generic one set up that should be applied to day, week, and month but only the month view is showing, the other two get the generic view. Any ideas on this?

Thanks,

Scott

[Tsvetomir]

Hi Scott. Could you share the respective code snippets for the Scheduler so that I could investigate them and possibly spot where the problem might be? 

[Scott]

Thanks for looking into it.

 

@(Html.Kendo().Scheduler<NEP.Portal.ViewModels.Scheduling.CalendarEventViewModel>()
.Name("scheduler")
.Date(new DateTime(2021, 02, 1))
.StartTime(new DateTime(DateTime.Today.Year, DateTime.Today.Month, DateTime.Today.Day, 8, 00, 00))
.Height(900)
.Toolbar(t => t.Pdf())
.EventTemplateId("event-template")
.Views(views =>
{
views.DayView();
views.WeekView();
views.MonthView(month =>
{
month.Selected(true);
month.EventsPerDay(6);
month.EventSpacing(5);
month.EventHeight("auto");
});
views.AgendaView(agenda =>
{
agenda.EventTemplateId("agenda-template");
});
})
.Events(e => e.DataBound("onDataBound"))

.Resources(resource =>
{
resource.Add(m => m.ResourceId)
.Title("Assigned To")
.DataTextField("Text")
.DataValueField("Value")
.DataColorField("Color")
.BindTo(new[]
{
new { Text = "Mickie", Value = 1, Color = "#f8a398" },
new { Text = "Minnie", Value = 2, Color = "#51a0ed" },
new { Text = "Donald", Value = 3, Color = "#3ba96a" },
new { Text = "Goofy", Value = 4, Color = "#fee87e" }
});
resource.Add(m => m.PriorityId)
.Title("Priority")
.DataTextField("Text")
.DataValueField("Value")
.BindTo(new[]
{
new { Text = "General", Value = 1},
new { Text = "Minor", Value = 2 },
new { Text = "Critical", Value = 3 }
});
resource.Add(m => m.Complete)
.Title("Complete")
.DataTextField("Text")
.DataValueField("Value")
.BindTo(new[]
{
new { Text = "No", Value = 1 },
new { Text = "Yes", Value = 2 }
});
})
.DataSource(d => d
.Model(m =>
{
m.Id(f => f.Id);
m.Field(f => f.Title).DefaultValue("NOT SCHEDULED");
m.Field(f => f.ResourceId);
m.RecurrenceId(f => f.RecurrenceId);
})
.Read("Read", "SchedulingApi")
.Create("Create", "SchedulingApi")
.Destroy("Delete", "SchedulingApi")
.Update("Update", "SchedulingApi")
.Filter(filters =>
{
filters.Add(model => model.ResourceId).IsEqualTo(1).Or().IsEqualTo(2).Or().IsEqualTo(3).Or().IsEqualTo(4);
})
)
)

 

[Tsvetomir]

The implementation of the Scheduler looks correct. Could you share the implementation of the event template as well as any CSS that you might have applied? I have tested the case in our demos and it appears that a single event template is applied to all views:

https://demos.telerik.com/aspnet-core/scheduler

It would be very helpful if you could share a sample project where the defect can be observed. This would help me debug the case locally and share the respective feedback.

[Scott]

Thanks again for the help. My code is mostly from the sample.

 

<script id="event-template" type="text/x-kendo-template">
<div class='event-template'>
#if(Complete == 2)
{#
<img src="@Url.Content("~/shared/web/scheduler/status_complete.png")" />
#}else{
if(PriorityId == 1){#
<img src="@Url.Content("~/shared/web/scheduler/status_general.png")" />
#}else if(PriorityId == 2){#
<img src="@Url.Content("~/shared/web/scheduler/status_minor.png")" />
#}else if(PriorityId == 3){#
<img src="@Url.Content("~/shared/web/scheduler/status_critical.png")" />
#}}#
<span>#: title #</span>
</div>
</script>

<script id="agenda-template" type="text/x-kendo-template">
<div class='event-template'>
<span>#: title #</span>
</div>
</script>

 

<style>
.event-template img {
float: left;
margin: 0 8px;
}

body, h1, h2, h3 {
margin: 0px;
}

#team-schedule {
background: url('@Url.Content("~/shared/web/scheduler/")team-schedule.png') transparent no-repeat;
height: 115px;
position: relative;
}

#people {
background: url('@Url.Content("~/shared/web/scheduler/")scheduler-people.png') no-repeat;
width: 460px;
height: 115px;
position: absolute;
right: 0;
}
#frank {
position: absolute;
left: 8px;
top: 84px;
}
#carlos {
position: absolute;
left: 124px;
top: 84px;
}
#duke {
position: absolute;
left: 238px;
top: 84px;
}#jorge {
position: absolute;
left: 355px;
top: 84px;
}
</style>

I can attempt to make a standalone sample if this cannot be used to figure out the issue. Seems like it should just work, I am not doing anything fancy.

 

-Scott

 

 

[Tsvetomir]

Hi Scott, to speed up the process for replicating the error, I have prepared a base project with all Telerik UI resources loaded and a Scheduler with an event template. Could you examine it and modify it in order to replicate the issue and send it back to me? 

[Scott]

Hello. Thanks again for the help. So, I've narrowed the issue down to being that my events are all of the type all-day, and that is not showing the image my template has in it at the top section of the week/day view. I see there is an AllDay version of the template and I switched to that and things are working well.

Thank you!

-Scott

[Tsvetomir]

When the events are of type "all day", the event that should be used is actually called AllDayEventTemplate:

https://docs.telerik.com/aspnet-core/api/Kendo.Mvc.UI.Fluent/SchedulerBuilder#alldayeventtemplatesystemstring