Min/Max restrictions not always working

7 posts, 1 answers
  1. Grant
    Grant avatar
    164 posts
    Member since:
    Jul 2016

    Posted 06 Dec 2017 Link to this post

    Hi, 

    For some reason the min and max dates are only enforced on the calendar popup, not in the scheduler navigation. 
    The scheduler is first initialized without the min and max attributes, then I set them using setOptions() method. The reason being the restrictions are based on other parameters.
    If I print the scheduler reference in the console, the min and max attributes are populated as expected. However as I said before, the restriction only applies to the calendar popup.

    For example, if the max date is 2017-12-31 and the view is "month". If i click the 'next' navigation button, something is happening. I say it like that because the datsource is refreshing, but the displayed month is not changing to January.

    I'm trying to explain my problem as best I can but honestly, haven't got a clue what going on. I hope you are able to help, I'll continue to investigate myself and hopefully will have more info for you when you reply.

    Thank and kind regards, 
    Grant

  2. Tyler
    Tyler avatar
    68 posts
    Member since:
    Feb 2017

    Posted 07 Dec 2017 in reply to Grant Link to this post

    I have had very iffy results with setOptions on the scheduler... some things work, like toggling work hours, many things didn't, like setting selectability. I had to destroy and re-create my scheduler to set certain options when they changed.

    You may have to destroy the scheduler (Here is documentation on this) and recreate with your new min and max.

    Another approach that does not involve destroying and recreating your scheduler, is in the navigate event, check the date you are navigating to, if it exceeds the bounds of your min and max, e.preventDefault() to stop your scheduler from doing anything or scheduler.date(previousDate) to return to the date range the user was just on and pop up a warning or something saying that is as far as the scheduler goes. 

     

    But I believe your issue is the destroying and recreating. To utilize the min and max date, you most likely will need to destroy and recreate with those options set. To avoid that, you can utilize my suggestion to catch and stop the user going beyond the min and max date in the navigate event of the scheduler.

  3. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    1209 posts

    Posted 08 Dec 2017 Link to this post

    Hi Grant,

    Here you will find a simple Dojo implementing the described scenario. You will notice that initially, the Scheduler does not have a min or max date set. By using the arrow buttons on the toolbar the user can navigate to any previous or next month. On the Set min and max button click the min and max dates for the Scheduler are set. From that moment on the Scheduler allows navigation only to November or December 2017 (video here).

    May I ask you to modify this sample, so it reproduces the issue observed at your end and send it back to us? This way I will be able to troubleshoot the problem locally.

    Tyler, you are right, that there are number of cases in which the Scheduler widget needs to be destroyed and re-initialized in order to alter some of its configuration options. Nevertheless, setting the min and/or max navigation dates should be possible with the setOptions() method alone.

    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.
  4. Grant
    Grant avatar
    164 posts
    Member since:
    Jul 2016

    Posted 12 Dec 2017 in reply to Veselin Tsvetanov Link to this post

    Hi Gents, 

    Thanks for the replies, I've done some investigating and still havent been able to find a solution.

    @Veselin, I've updates your Dojo example (https://dojo.telerik.com/ObUPAg/4) to a working version of what Im trying to achieve.I have a drop down list of users, each with a valid date range, although some dont have a max date, indicating that they work for an indefinite length of time. The idea is to set the min and max date of the scheduler to match the effective From/To dates of the users.

    Setting the Min date does work, but only the first time. Resetting it only affects the scheduler, if you have already opned the calendar popup, its min date is not enforced

    Is there a way to reinitialize the calendar popup with a new min/max?

    Thanks, 
    Grant

  5. Answer
    Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    1209 posts

    Posted 14 Dec 2017 Link to this post

    Hello Grant,

    Thank you for the sample prepared and for the detailed explanation of the case.

    Concerning the options, that should not have max date configured, I would suggest you to set a max date may ahead in the future. For example ​2099-12-31 ​is a possible option in your case. This is needed because the ​max ​option would not accept ​null value.

    As per the calendar, which does not change its min and max options after it has been opened once, I would suggest you to set them directly on that embedded widget:
    var calendar = $('.k-scheduler-calendar').getKendoCalendar();
     
    if (calendar) {
      calendar.setOptions({
        min: new Date(user.effectiveFromDate),
        max: new Date(user.effectiveToDate)
      });
    }

    Here you could find a modified sample implementing the above suggestions.

    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.
  6. Grant
    Grant avatar
    164 posts
    Member since:
    Jul 2016

    Posted 15 Dec 2017 in reply to Veselin Tsvetanov Link to this post

    Thanks Veselin,

    Your solution to setting the min/max on the calendar widget is great. I've made some slight improvements to your demo (https://dojo.telerik.com/ObUPAg/8) though.

    I've updated the max date to be conditional on a null since the data that I used is actually from a remote source.
    You used $('.k-scheduler-calendar').getKendoCalendar(); to get a reference to the widget. I have found though that the KendoScheduler does have a 'calendar' field (like dataSource and resources) that contains a reference to the widget, but it only exists after the widget has been initialized, it seems simpler to use that.

    Perhaps this field should be documented?

    Thanks for you time and help.

    Regards,
    Grant

  7. Veselin Tsvetanov
    Admin
    Veselin Tsvetanov avatar
    1209 posts

    Posted 19 Dec 2017 Link to this post

    Hi Grant,

    Thank you for the improvements on the sample. Also, your suggestion to include in the documentation the calendar field of the Scheduler makes perfect sense. As a small token of gratitude for helping us improving our documentation I have updated your Telerik points.

    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.
Back to Top