New to Telerik UI for ASP.NET Core? Download free 30-day trial

Timeline Overnight view

Loading Demo...

EXAMPLE
VIEW SOURCE
Edit in Theme Builder
Change Theme
Default
SASS

LESS
- Default
- Bootstrap
- Material
- Launch Theme Builder
- Black
- Blue Opal
- Bootstrap v3
- Default
- Fiori
- Flat
- High Contrast
- Material
- Material Black
- Metro
- Metro Black
- Moonlight
- Nova
- Office 365
- Silver
- Uniform

            
                        timeline_night.cshtml
                    
                        Timeline_NightController.cs
                    
                        SchedulerMeetingService.cs
                    
                        MeetingViewModel.cs

Also available for:

API REFERENCE

kendo.syncReady(function(){jQuery("#scheduler").kendoScheduler({"date":new Date(2013,5,12,0,0,0,0),"dateHeaderTemplate":"\u003cstrong\u003e#=kendo.toString(date, \u0027D\u0027)# - #=kendo.toString(kendo.date.nextDay(date), \u0027D\u0027)#\u003c/strong\u003e","endTime":new Date(2013,5,12,20,0,0,0),"majorTick":360,"startTime":new Date(2013,5,12,20,0,0,0),"timezone":"Etc/UTC","editable":{"editRecurringMode":"dialog"},"views":[{"type":"timeline","eventHeight":50},{"type":"timelineWeek","eventHeight":50}],"resources":[{"dataSource":[{"Text":"Meeting Room 101","Value":1,"Color":"#6eb3fa"},{"Text":"Meeting Room 201","Value":2,"Color":"#f58a8a"}],"title":"Room","field":"RoomID","dataTextField":"Text","dataValueField":"Value","dataColorField":"Color","name":"Rooms"}],"group":{"resources":["Rooms"],"orientation":"vertical"},"mobile":"","dataSource":{"type":(function(){if(kendo.data.transports['aspnetmvc-ajax']){return 'aspnetmvc-ajax';} else{throw new Error('The kendo.aspnetmvc.min.js script is not included.');}})(),"transport":{"read":{"url":"/aspnet-core/scheduler/timeline_night_read"},"prefix":"","update":{"url":"/aspnet-core/scheduler/timeline_night_update"},"create":{"url":"/aspnet-core/scheduler/timeline_night_create"},"destroy":{"url":"/aspnet-core/scheduler/timeline_night_destroy"},"stringifyDates":true},"schema":{"data":"Data","total":"Total","errors":"Errors","model":{"id":"MeetingID","fields":{"MeetingID":{"type":"number"},"title":{"from":"Title","type":"string","defaultValue":"No title"},"description":{"from":"Description","type":"string"},"start":{"from":"Start","type":"date"},"startTimezone":{"from":"StartTimezone","type":"string"},"end":{"from":"End","type":"date"},"endTimezone":{"from":"EndTimezone","type":"string"},"recurrenceRule":{"from":"RecurrenceRule","type":"string"},"recurrenceId":{"from":"RecurrenceID","type":"number","defaultValue":null},"recurrenceException":{"from":"RecurrenceException","type":"string"},"isAllDay":{"from":"IsAllDay","type":"boolean"},"Timezone":{"type":"string"},"RoomID":{"type":"number","defaultValue":null},"Attendees":{"type":"object"}}}}}});});

Description

The Scheduler Timeline view allows you to display overnight major slots by configuring the startTime and the endTime of the view.

Timeline Overnight view

Description

Support & Learning Resources

Was this demo helpful?

Tell us how we can improve this demo