how to load specific month

8 posts, 0 answers
  1. Anup
    Anup avatar
    6 posts
    Member since:
    Jul 2012

    Posted 06 Aug 2012 Link to this post

    Hi
     I want to display specific month (not current month) on load of kendo calendar, Any Suggestion
  2. John DeVight
    John DeVight avatar
    209 posts
    Member since:
    Jan 2010

    Posted 09 Aug 2012 Link to this post

    Hi Anup,

    How about setting the value after the Calendar is initialized?  For example, if you wanted to set the month to May 2012, then you could do this:

    var calendar = $("#calendar").kendoCalendar().data("kendoCalendar");
    $("#calendar").data("kendoCalendar").value(new Date(2012, 4, 1));

    This does show May 1, 2012 as the selected date.  If you don't want it to look like May 1, 2012 is selected, you could also remove the k-state-selected class like this:

    $("#calendar").find(".k-state-selected").removeClass("k-state-selected");

    Also, if you do not want the Calendar to be initialized to May 1, 2012, you can set the value to null like this:

    $("#calendar").data("kendoCalendar")._value = null;

    Attached is an example.

    Hope that helps.

    Regards,

    John DeVight
  3. Kendo UI is VS 2017 Ready
  4. Anup
    Anup avatar
    6 posts
    Member since:
    Jul 2012

    Posted 10 Aug 2012 Link to this post

    Thanks a lot...
     Can u tell me how to prevent click event on every date?

    I dnt want to highlight date on click of tht, i want to disable the click event on every date.
  5. John DeVight
    John DeVight avatar
    209 posts
    Member since:
    Jan 2010

    Posted 10 Aug 2012 Link to this post

    Hi Anup,

    To prevent the click event on every date, you could override the calendar.value function and pass in an additional argument to determine whether to allow the value to be applied.  Here is what you would do.

    Create a calendar control:
    var calendar = $("#calendar").kendoCalendar().data("kendoCalendar");

    Override the original value function and create a new value function that takes an additional argument called apply.  If apply is true, then call the original value function:
    // Override the calendar.value function.
    calendar.originalValue = calendar.value;
    calendar.value = function(value, apply) {
        var that = this;
        // The apply argument has been set to true.
        if (apply === true) {
            that.originalValue.apply(that, arguments);
        }
    }

    Now if you want to set the value, you would call the value function like this:
    calendar.value(new Date(), true);

    Let me know if you have any questions....

    Regards,

    John DeVight
  6. Anup
    Anup avatar
    6 posts
    Member since:
    Jul 2012

    Posted 13 Aug 2012 Link to this post

    Hi John

    Thanks for your reply....
    My kendo implementation is like:
    I have two array called dates and monthC, I am doing some checking in dates array and i wanna value from monthC array and set it to particular dates, but I am getting  a runtime error in below line:
    '# var x = [' + monthC + '][' + temp + ']; #' +

    if my array contains numbaer thn its working fine but here monthC contains some string value .
    while running its giving Steve is not defined....error.

    If u can let me know how can i acces string value from monthC array..it wud be very helpfull...

    my code is like below:

    $(document).ready(

     

    function () {

     

     

    var monthC = [],dates[];

     

    dates.push(

     

    "1344364200000");
    dates.push(
    "1344709800000");
    dates.push(
    "1345746600000");

     

    monthC.push("Steve");
    monthC.push(
    "Michel");
    monthC.push(
    "Robert");

    $(

     

    "#calendar").kendoCalendar({
    value: today,
    month: {
    // template for dates in month view
    content: '# if ($.inArray(+data.date, [' + dates + ']) != -1) { #' +
    '# ' + temp + ' = jQuery.inArray(+data.date, [' + dates + ']); #' +
    '# var x = [' + monthC + '][' + temp + ']; #' +
    '# } #' +
    '#= data.value #'
    },

     

    footer:

     

    "Today - #=kendo.toString(data, 'd') #",
    });

     

  7. John DeVight
    John DeVight avatar
    209 posts
    Member since:
    Jan 2010

    Posted 13 Aug 2012 Link to this post

    Hi Anup,

    I made 2 changes to your code.  The first is to move the declaration of monthC and dates to be outside of the jQuery.ready function to that their scope becomes global.  The second change was to move your code from a template into a function that is also defined outside of the jQuery.ready function (to make it easier to read) and then call the function from the template.  Here is the code:

    var monthC = [],
        dates = [];
      
    dates.push("1344364200000");
    dates.push("1344709800000");
    dates.push("1345746600000");
      
    monthC.push("Steve");
    monthC.push("Michel");
    monthC.push("Robert");
      
    function calendarContent(data) {
        if ($.inArray(data.date, dates) != -1) {
            var temp = jQuery.inArray(data.date, dates);
            var x = monthC[temp];
        }
        return data.value;
    }
      
    $(document).ready(function () {
        var today = new Date();
          
        $("#calendar").kendoCalendar({
            value: today,
            month: {
                // template for dates in month view
                content: '#= calendarContent(data) #'
            },
            footer: "Today - #=kendo.toString(data, 'd') #"
        }); 
    });

    Regards,

    John DeVight
  8. Anup
    Anup avatar
    6 posts
    Member since:
    Jul 2012

    Posted 20 Aug 2012 Link to this post

    Hi John

    I wanna stop click event on other months dates on calendar.
    please let me know if u have any suggestion.
  9. Kula
    Kula avatar
    5 posts
    Member since:
    Sep 2012

    Posted 28 Sep 2012 Link to this post

    Hi
    am working on kendo UI datepicker ..using that picker am working editable mode as "popup". Now what happen to me is ,am using dateofjoin as one of my field,in that i specify the type as "date".Then the picker will come in popup editor ..But what happen is whenever i select any date in the picker the selected date will not be inserted into the database instead the default value as"1970-01-01" or sometimes today date will be selected as default.but i want my selected date to be the dateofjoin value into the database..

    Anybody will guide me to overcome this?

    regards,
    Kulasekaran
Back to Top
Kendo UI is VS 2017 Ready