Specifies the culture info used by the widget.
Example
// specify on widget initialization
$("#calendar").kendoCalendar({
culture: "de-DE"
});
Specifies a list of dates, which will be passed to the month template.
Example
$("#calendar").kendoCalendar({
dates: [new Date(2000, 10, 10, 10, 0, 0), new Date(2000, 10, 10, 30, 0)] //can manipulate month template depending on this array.
});
Specifies the navigation depth.
Example
$("#calendar").kendoCalendar({
depth: "year"
});
Specifies the content of the footer. If false, the footer will not be rendered.
Example
// change the footer text from the default current date
$("#calendar").kendoCalendar({
footer = "My Custom Footer"
});
Example
$("#calendar").kendoCalendar({
footer = false;
});
Template to be used for rendering the footer. If false, the footer will not be rendered.
Example
//calendar intialization
<script>
$("#calendar").kendoCalendar({
footer: kendo.template("Today - #=kendo.toString(data, 'd') #")
});
</script>
Specifies the format, which is used to parse value set with value() method.
Example
$("#calendar").kendoCalendar({
format: "yyyy/MM/dd"
});
Specifies the maximum date, which the calendar can show.
Example
$("#calendar").kendoCalendar({
max = new Date(2013, 0, 1);
});
Example
// get a reference to the Kendo UI calendar widget
var calendar = $("#calendar").data("kendoCalendar");
// set the max date to Jan 1st, 2013
calendar.max(new Date(2013, 0, 1));
Specifies the minimum date, which the calendar can show.
Example
// set the min date to Jan 1st, 2011
$("#calendar").kendoCalendar({
min = new Date(2011, 0, 1)
});
Example
// get a reference to the Kendo UI calendar widget
var calendar = $("#calendar").data("kendoCalendar");
// set the min date to Jan 1st, 2011
calendar.min(new Date(2011, 0, 1));
Templates for the cells rendered in the "month" view.
Template to be used for rendering the cells in the "month" view, which are in range.
Example
//template
<script id="cellTemplate" type="text/x-kendo-tmpl">
<div class="${ data.value < 10 ? exhibition : party }">
</div>
${ data.value }
</script>
//calendar intialization
<script>
$("#calendar").kendoCalendar({
month: {
content: $("#cellTemplate").html(),
}
});
</script>
Template to be used for rendering the cells in the "month" view, which are not in the min/max range.
Specifies the start view.
Example
$("#calendar").kendoCalendar({
start: "year"
});
Specifies the selected date.
Example
// set the selected date to Jan 1st. 2012
$("#calendar").kendoCalendar({
value: new Date(2012, 0, 1)
});
Example
// get a reference to the Kendo UI calendar widget
var calendar = $("#calendar").data("kendoCalendar");
// set the selected date on the calendar to Jan 1st, 2012
calendar.value(new Date(2012, 0, 1));