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

Kendo Scheduler Navigation Links(Prev/Next)

4 Answers 113 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Jeff
Top achievements
Rank 1
Jeff asked on 05 Jun 2018, 06:14 PM

I have disabled few Dates in kendo Calendar . How to do Next/Prev button link to jump to the only Enabled dates? Right now it jumps to disabled dates even though those are not available to click on. 

 

Thanks in advance

Amita

4 Answers, 1 is accepted

Sort by
0
Veselin Tsvetanov
Telerik team
answered on 07 Jun 2018, 07:55 AM
Hi Jeff,

May I ask you to share with us a small sample of how exactly you have disabled those dates? Are they dates in the Calendar widget, as you mention in your post, or in the Scheduler, as you have marked the topic of the current thread?

Regards,
Veselin Tsvetanov
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.
0
Jeff
Top achievements
Rank 1
answered on 07 Jun 2018, 03:25 PM

Thanks Veselin for reply.

We are using KendoScheduler control and Calendar widget is the part of that control.

Here is the code... 

 myScheduler.SchedulerControl = $('#schedulerdemo').data("kendoScheduler");

var schedDateLink = $('ul.k-scheduler-navigation').find('.k-nav-current');

 disabled = [27];

      schedDateLink.on('click', function () {
          setTimeout(function () {
            var schedCalendar = $('.k-scheduler-calendar.k-widget.k-calendar').data('kendoCalendar');
           schedCalendar.setOptions({
             min: new Date(minDate),//06/25/2018
             max: new Date(maxDate),//06/28/2018
               disableDates: function (date) {
                if (date && disabled.indexOf(date.getDate()) > -1) {
                  return true;
                } else {
                  return false;
                }
               },
              // change: myScheduler.onChange,
            });
          }, 100);
        });

 

I see two problem here regards to Prev/Next links.

1) Disabled dates are accessible on Prev/Next buttons.

2) I have specified range for scheduler control & Calendar widget with following properties.

     StartTime -EndTime for scheduler control (06/25/2018-06/28/2018)

    Min-Max for Calendar widget (06/25/2018-06/28/2018)

But I can still access all the Dates prior to 06/25 and future dates after 06/28 dates on Prev/Next buttons .

 

 

 

 

 

 

0
Veselin Tsvetanov
Telerik team
answered on 11 Jun 2018, 11:33 AM
Hi Jeff,

Configuring the Calendar navigation widget of the Scheduler to have min and max dates and disabled dates would not limit the navigation options of the Scheduler itself. Therefore, in order to prevent the user from navigating to undesired dates you will need to implement a handler for the navigate event of the Scheduler:
$("#scheduler").kendoScheduler({
  navigate: function(e) {
    var navigateToDate = e.date;
 
    if (navigateToDate < minDate || navigateToDate > maxDate) {
      e.preventDefault();
    } else if (disabledDates.indexOf(navigateToDate.getTime()) > -1) {
      e.preventDefault();
      if (e.action === 'next') {
        e.sender.date(new Date(navigateToDate.getTime() + 86400000));
      } else if (e.action === "previous") {
        e.sender.date(new Date(navigateToDate.getTime() - 86400000));
      }
    }
  },

With the above you will prevent any navigation outside of the configured range and will skip the disabled dates in that range

Here you will find a small sample implementing the above suggestion

Regards,
Veselin Tsvetanov
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.
0
Jeff
Top achievements
Rank 1
answered on 13 Jun 2018, 03:55 PM

Thanks Veselin for reply.

This works great.It was very helpful.

 

 

 

Tags
Scheduler
Asked by
Jeff
Top achievements
Rank 1
Answers by
Veselin Tsvetanov
Telerik team
Jeff
Top achievements
Rank 1
Share this question
or