Globally Modify Default Options
The following example demonstrates how to globally modify the default options in the DatePicker.
<input id="datepicker" value="10/10/2011" style="width:150px;" />
<br />
<br />
<input id="monthpicker" value="November 2011" style="width:150px" />
<script>
kendo.ui.DatePicker.fn.options.parseFormats = ["MMMM yyyy"];
</script>
<script>
$(document).ready(function() {
// create DatePicker from input HTML element
var datepicker = $("#datepicker").kendoDatePicker().getKendoDatePicker();
$("#monthpicker").kendoDatePicker({
// defines the start view
start: "year",
// defines when the calendar should return date
depth: "year",
// display month and year in the input
format: "MMMM yyyy"
});
console.log(datepicker.options.parseFormats); // display the set options
});
</script>
See Also
- DatePicker JavaScript API Reference
- How to Create Date Masking
- How to Hide the Default Button
- How to Integrate DatePicker with DateJS Library
- How to Make Input Elements Readonly
- How to Persist Entered Dates
- How to Resize Calendar Based on Input Width
- How to Set the First Weekday
For more runnable examples on the Kendo UI DatePicker, browse its How To documentation folder.