DatePicker restrict days... almost

7 posts, 0 answers
  1. Fabien
    Fabien avatar
    7 posts
    Member since:
    Jul 2015

    Posted 19 Nov 2015 Link to this post

    Hello,

     

    I saw everywhere that we can't really restrict days in the DatePicker so I decided to find a workaround. It worked strangely till I realized that it was not my fault:

      

    data-bind="events: { open: filterAllButSaturday }, etc..."

     

    filterAllButSaturday: function (e) {
            var allDays = $('#AdjustmentDate_dateview').find('.k-link');
     
            allDays.each(function()
            {
                if ($(this).attr('data-value') === 'undefined' || new Date($(this).attr('data-value')).getDay() != 6) {
                    $(this).bind('click', function() { return false; });
                }
            });
        }

     

    This solution would have worked just great if the data-value was not messed up:

     

    <a tabindex="-1" class="k-link" href="#" data-value="2015/10/17" title="Tuesday, November 17, 2015">17</a>

     

    Now I almost found a workaround for a problem that seem to piss off many people, I'd like not to have to switch to Bootstrap which seems to incorporate this feature pretty well. could I have a bit of help to make it work please?

     

    Thanks a lot.

  2. Fabien
    Fabien avatar
    7 posts
    Member since:
    Jul 2015

    Posted 19 Nov 2015 in reply to Fabien Link to this post

    PS: little precision on the problem. data-value has 10 as month while we are in November and it should be 11.
  3. Kendo UI is VS 2017 Ready
  4. Fabien
    Fabien avatar
    7 posts
    Member since:
    Jul 2015

    Posted 19 Nov 2015 in reply to Fabien Link to this post

     Meanwhile I feel dirty:

     

    allDays.each(function()
           {
               if ($(this).attr('data-value') !== 'undefined') {
                   var date = new Date($(this).attr('data-value'));
                   date.setMonth(date.getMonth() + 1);
     
                   if (date.getDay() != 6) {
                       $(this).bind('click', function() { return false; });   
                   }
               }
           });
     

     

     

  5. Fabien
    Fabien avatar
    7 posts
    Member since:
    Jul 2015

    Posted 19 Nov 2015 Link to this post

    That solution doesn't even work properly since if the user select another month then the grid refresh... can I bind on this event rather than "open" ?

    Each time the grid refreshes then I'd like to execute my code.

     

    Thanks.

  6. Eyup
    Admin
    Eyup avatar
    3015 posts

    Posted 23 Nov 2015 Link to this post

    Hello Fabien,

    Thank you for demonstrating such fervor for this matter. I will be glad if we come up with a viable solution for your scenario, moreover, if it proves applicable for other developers as well.

    I suggest that you check the navigate event handler of the inner Calendar:
    http://docs.telerik.com/kendo-ui/api/javascript/ui/calendar#events-navigate


    This way you will be able to execute your filterAllButSaturday logic every time. This is achieved using the pickerObject.dateView.calendar approach. You can examine the following sample:
    http://jsbin.com/eyUdeni/2/edit?html,js,output

    You can also check the templates demo:
    http://demos.telerik.com/aspnet-mvc/datepicker/template

    I hope this will prove helpful.

    Regards,
    Eyup
    Telerik
     
    Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
     
  7. Fabien
    Fabien avatar
    7 posts
    Member since:
    Jul 2015

    Posted 23 Nov 2015 Link to this post

    Thanks a lot, I will try to find something with all these hints.
  8. Eyup
    Admin
    Eyup avatar
    3015 posts

    Posted 24 Nov 2015 Link to this post

    Hello Fabien,

    Please take your time to examine the suggestions and feel free to turn to us if new questions arise.

    Regards,
    Eyup
    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