This is a migrated thread and some comments may be shown as answers.

how to load specific month

7 Answers 423 Views
Calendar
This is a migrated thread and some comments may be shown as answers.
Anup
Top achievements
Rank 1
Anup asked on 06 Aug 2012, 12:06 PM
Hi
 I want to display specific month (not current month) on load of kendo calendar, Any Suggestion

7 Answers, 1 is accepted

Sort by
0
John DeVight
Top achievements
Rank 1
answered on 09 Aug 2012, 12:00 PM
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
0
Anup
Top achievements
Rank 1
answered on 10 Aug 2012, 07:50 AM
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.
0
John DeVight
Top achievements
Rank 1
answered on 10 Aug 2012, 01:33 PM
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
0
Anup
Top achievements
Rank 1
answered on 13 Aug 2012, 07:38 AM
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') #",
});

 

0
John DeVight
Top achievements
Rank 1
answered on 13 Aug 2012, 01:51 PM
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
0
Anup
Top achievements
Rank 1
answered on 20 Aug 2012, 07:02 AM
Hi John

I wanna stop click event on other months dates on calendar.
please let me know if u have any suggestion.
0
Kula
Top achievements
Rank 1
answered on 28 Sep 2012, 06:08 AM
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
Tags
Calendar
Asked by
Anup
Top achievements
Rank 1
Answers by
John DeVight
Top achievements
Rank 1
Anup
Top achievements
Rank 1
Kula
Top achievements
Rank 1
Share this question
or