do that not all days were clickable?

5 posts, 0 answers
  1. Michail
    Michail avatar
    4 posts
    Member since:
    Feb 2012

    Posted 02 Apr 2012 Link to this post

    Hello, is that possible to do with kendo calendar that not all days were selectable for user?

    something like on attached image (available days are underlined)

  2. Georgi Krustev
    Admin
    Georgi Krustev avatar
    3707 posts

    Posted 04 Apr 2012 Link to this post

    Hello Michail,

     
    Currently the required functionalty is not supported. I will suggest you, share your thoughts in our UserVoice. Thus other users, which want the same functionality, can vote for it.

    Regards,
    Georgi Krustev
    the Telerik team
    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. Joachim Karlsson
    Joachim Karlsson avatar
    17 posts
    Member since:
    May 2010

    Posted 30 May 2012 Link to this post

    I came up with an quick/easy solution for this.

    Create ur own content template, here i got bookable times (newDateArray)
    I set a class, if its in the bookable dates or not. (.bookable/.notbookable)

       $("#wheelshiftCalendar").kendoCalendar({
                        min: new Date(),
                        max: maxDate,
                        month: {
                            content: '# if ($.inArray(+data.date, [' + newDateArray + ']) !== -1) { #' +
                                                '<div class="bookable">#= data.value #</div>' +
                                         '# } else { #' +
                                                '<div class="notbookable" onclick="return false;">#= data.value #</div>' +
                                         '# } #'
                        },
                        change: function (e) {
                            if ($.inArray(+e.sender._value, newDateArray) !== -1) {
                                //bookable
                            }
                        }
            });

     //and then i finally
    //k-link seems to be triggering the selectdate function
     $(".notbookable").parent().removeClass("k-link");
  5. Josh
    Josh avatar
    4 posts
    Member since:
    Mar 2013

    Posted 24 May 2013 Link to this post

    @Joachim - i can't seem to remove the k-link parent.  Where do you put this
    $(".notbookable").parent().removeClass("k-link");

    in your code?  Since the date picker is generated dynamically, i'm not sure where this goes. 
  6. Josh
    Josh avatar
    4 posts
    Member since:
    Mar 2013

    Posted 24 May 2013 Link to this post

    Never mind, i was able to do it like this (in the open() method):

                    open: function(e) {
                      $(".k-weekend").each(function (){
                        console.info(this);
                        $(this).find("a").attr("disabled",true).removeClass("k-link").addClass("disabled-date");
                        $(this).removeClass("k-state-hover");
                      });
                    }...

    I'm trying to remove certain dates as well as all weekends.  However, clicking to the next month, that month isn't treated with this month template.  Moreover, clicking back to the original month removes the template application!  How does one get this "month" to "stick"?
Back to Top
Kendo UI is VS 2017 Ready