Date Picker -Range - disabled dates later than maximum date

11 posts, 0 answers
  1. Jenny
    Jenny avatar
    7 posts
    Member since:
    Jan 2016

    Posted 14 Apr Link to this post

    Am using Kendo datepicker Range for dates showing from date and to date  in my application developing in AngularJs. 

      My requirement is once to date is selected , the from date has to show the dates after  selected to-date as disabled  . I am using k-max = "vm.maxDate" and dates after the to-date is not visible.  Similarly for to-date , the dates prior to from-date is not visible where as it should be disabled as per my requirement .

    <input kendo-date-picker k-max = "vm.maxDate" k-rebind = "vm.maxDate" id="fromdate" />

    <input kendo-date-picker k-min = "vm.minDate" k-rebind = "vm.minDate" id="todate" />

    While loading the page , we are setting the default values as :

        vm.maxDate = new Date();
        vm.minDate = new Date(2000, 0, 1, 0, 0, 0);

    Please help me on this 

     

  2. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 18 Apr Link to this post

    Hi,

    Please check the following sample and let me know if it helps:

    http://dojo.telerik.com/ojucE

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  3. Kendo UI is VS 2017 Ready
  4. Jenny
    Jenny avatar
    7 posts
    Member since:
    Jan 2016

    Posted 13 May in reply to Kiril Nikolov Link to this post

    Thanks . This works fine for the first time . Todate calendar after the first change in fromdate or not reseting if we clear the input text .
  5. Jenny
    Jenny avatar
    7 posts
    Member since:
    Jan 2016

    Posted 13 May in reply to Jenny Link to this post

    Thanks . This works fine for the first time . Todate calendar is not getting refreshed from the next change on wards . And also not refreshing when we clears the input field
  6. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 14 May Link to this post

    Hi,

    I am not sure that I understand the problem, can you please change the example from my previous response, so it can show the issue you are facing?

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  7. Jenny
    Jenny avatar
    7 posts
    Member since:
    Jan 2016

    Posted 16 May in reply to Kiril Nikolov Link to this post

    Steps to replicate in the previous example 

    1. Select a date from FromDate calendar (say 5/18/2016)  

    2. Open the ToDate calendar , we can see the dates after the selected FromDate  (19th onwards) seems to be disabled 

    3. Repeat the same steps . ie Select another date in FromDate calendar( 5/23/2016) 

    4. now open the Todate calendar, the disabled dates are still from 19th , whereas it should be changed to 24th onwards.

    Hope the issue is clear now .

     

  8. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 16 May Link to this post

    Hello,

    If you want to change the configuration options runtime you need to use the k-rebind directive documented here:

    http://docs.telerik.com/kendo-ui/AngularJS/introduction#widget-update-upon-option-changes

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  9. Jenny
    Jenny avatar
    7 posts
    Member since:
    Jan 2016

    Posted 16 May in reply to Kiril Nikolov Link to this post

    We are using  k-rebind="toOptions"          k-options="toOptions"  as you see in the example.  Still not rebinding 
  10. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 17 May Link to this post

    Hello,

    Due to the stabilization algorithms in AngularJS the watch does not trigger change when the function is changed. As a workaround I would suggest you to use the widgets setOptions() method - it should give you better performance as well. Here is an example:

    http://dojo.telerik.com/ojucE/4

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  11. Jenny
    Jenny avatar
    7 posts
    Member since:
    Jan 2016

    Posted 19 May in reply to Kiril Nikolov Link to this post

    Thanks !!! That was a great help . 

    Here I run through another problem  with calendar .  When i select a date  and clears out the input field, ie I select  5/24/2016 from calendar , the input field displays the same . Then I clears the input field . Now when I open the calendar , it shows the previously selected date (5/24/2016) in a highlighted outlined box . I don't want the calendar to remember/show my previous selections . What I need to do for this ? Please help 

     

  12. Kiril Nikolov
    Admin
    Kiril Nikolov avatar
    2564 posts

    Posted 20 May Link to this post

    Hello,

    This question differs from the original topic of the conversation, so please open a separate thread and we will be happy to help!

    Regards,
    Kiril Nikolov
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
Back to Top
Kendo UI is VS 2017 Ready