Complex usage of Scheduler - Possible?

4 posts, 0 answers
  1. Rishi
    Rishi avatar
    6 posts
    Member since:
    Apr 2014

    Posted 20 Jun 2018 Link to this post

    Hello,

    My company wants to start using the Kendo UI Scheduler component. They have given me a set of functional requirements about how they want to use the component. My question is, are all these requirements possible in this component, while staying as close as possible to the original component.

    - Plan items in the week view, while having very specific day time slots. When a new item is created, it should fit inside one class of 50 minutes. However a item can be made short/longer manually.
    See screenshot Timetable Group - adjusted. If swapping the axis around would make things easier, that would be possible!

    - Items are moveable (Drag and Drop) and resizeable. Like here: https://demos.telerik.com/kendo-ui/scheduler/move-resize

    - Work with different Groups, like group the data on 'classroom', 'teacher' or 'student group'. All in combination with the first requirement, of course. Like here: https://demos.telerik.com/kendo-ui/scheduler/resources-grouping-horizontal

    - PDF Export

    Please advise.

    Kind regards,

    Maries Koole

  2. Dimitar
    Admin
    Dimitar avatar
    796 posts

    Posted 22 Jun 2018 Link to this post

    Hello Rishi,

    Please refer  to the Scheduler Date Grouping Demo, where a similar scenario to the one described is demonstrated. Navigate to the Week View and change the orientation to vertical from the DropDownList above the widget. 

    Concerning the rest of the requirements:

    • The start and end time of the view can be configured through the startTime and endTime options.

    • The Scheduler supports drag and resize of events. Dragging the resize handles of an event changes its start or end time. This functionality can be controlled through the editable.resize option.

    • PDF Export is also supported for the Scheduler - Export to PDF Demo.

    In addition to the above, you could find the following resources useful:

    • Dojo Sandbox - can be used to quickly spike a Scheduler implementation and verify if the desired result can be achieved through the built-in options of the widget.

    • Scheduler API Reference.

    Regards,
    Dimitar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
  3. Rishi
    Rishi avatar
    6 posts
    Member since:
    Apr 2014

    Posted 22 Jun 2018 in reply to Dimitar Link to this post

    Hello Dimitar,

    Thank you very much for your reply. 

    You have missed one important detail, I would like to display scheduled items by a very specific day time grouping.

    • 07:30 - 08:20
    • 08:25 - 09:15
    • 20 Mins break (grey, possibly)
    • 09:35 - 10:25
    • 10:30 - 11:15
    • Lunch break 1 hour (grey)
    • 12:15 - 13:00
    • 13:15 - 14:05
    • 14:10 - 15:00

    Could you please advise if such a display of items in the schedular is possible. 

    Kind regards,

    Rishi

  4. Dimitar
    Admin
    Dimitar avatar
    796 posts

    Posted 25 Jun 2018 Link to this post

    Hello Rishi,

    To achieve the desired result (disabling multiple ranges) for a single day, the Scheduler's edit event could be used to prevent creating events in the required ranges (e.g 9.15 - 9.35 and 11.15 - 12.15): 
    save: function (e) {
      if (e.event.start < startLimit || e.event.end > endLimit) {   
        e.preventDefault();
      }
    }

    Then the specified ranges could be grayed out by iterating over the Scheduler slots as demonstrated in the following Knowledge Base Article:


    Regards,
    Dimitar
    Progress Telerik
    Try our brand new, jQuery-free Angular components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Back to Top